Part of Add Charts to Virtual CFO Report.
Tasks
- Register
victorychart, victorybar, victoryline, victorypie, victoryaxis, victorylabel, victorylegend, victorytooltip, victorygroup HTML element models in BaseHTMLEngineProvider.tsx
- Create
src/components/HTMLEngineProvider/HTMLRenderers/VictoryChartRenderer.tsx — tnode → victory-native translator:
<victorychart> → <CartesianChart> (bar/line) or <PolarChart> (pie), determined by first child type<victorybar> → <Bar>, <victoryline> → <Line>, <victorypie> → <Pie><victoryaxis> forwarded as axis config, <victorylegend> → legend, <victorygroup> → <VictoryGroup>- JSON.parse all json attributes (
data, tickValues, tickFormat, style, events); forward non-json props as-is
- Return
null on any parse failure (invalid json, pie+cartesian mix, unrecognized tag, empty series)
- Register
victorychart: VictoryChartRenderer in HTMLRenderers/index.ts
Automated Tests
VictoryChartRenderer.test.tsx:
- Given a tnode containing one
<VictoryBar data="...">, the renderer emits a <CartesianChart> with one <Bar> child whose data prop matches the parsed json
- Given a tnode containing both
<VictoryBar> and <VictoryLine>, the renderer emits a <CartesianChart> with one <Bar> and one <Line> child, both consuming the same parsed data
- Given a tnode containing two
<VictoryBar> children, the renderer emits a <CartesianChart> with two <Bar> children
- Given a tnode containing one
<VictoryPie>, the renderer emits a <PolarChart> containing a <Pie> child (not a <CartesianChart>)
- Given a
<VictoryBar horizontal="true">, the renderer propagates horizontal onto the <Bar> primitive
- Given malformed json in
data, a pie+cartesian mix, or an unrecognized inner tag, the renderer returns null and emits a warning log
Manual Test
- Render a static reportAction containing a
<VictoryChart> with one <VictoryBar> and confirm it draws correctly on all platforms
- Render a static reportAction containing a
<VictoryChart> with two <VictoryBar> children and also one with a <VictoryBar> + <VictoryLine> mix, and confirm both series share axes and render correctly
- Render a static reportAction containing a
<VictoryChart> whose only child is a <VictoryPie> and confirm the pie renders correctly
- Render a reportAction with a
<VictoryChart> containing invalid json in data or an unrecognized inner tag, and confirm the surrounding narrative text still renders (no crash, chart silently dropped)
Issue Owner
Current Issue Owner: @s77rt
Part of Add Charts to Virtual CFO Report.
Tasks
victorychart,victorybar,victoryline,victorypie,victoryaxis,victorylabel,victorylegend,victorytooltip,victorygroupHTML element models inBaseHTMLEngineProvider.tsxsrc/components/HTMLEngineProvider/HTMLRenderers/VictoryChartRenderer.tsx— tnode → victory-native translator:<victorychart>→<CartesianChart>(bar/line) or<PolarChart>(pie), determined by first child type<victorybar>→<Bar>,<victoryline>→<Line>,<victorypie>→<Pie><victoryaxis>forwarded as axis config,<victorylegend>→ legend,<victorygroup>→<VictoryGroup>data,tickValues,tickFormat,style,events); forward non-json props as-isnullon any parse failure (invalid json, pie+cartesian mix, unrecognized tag, empty series)victorychart: VictoryChartRendererinHTMLRenderers/index.tsAutomated Tests
VictoryChartRenderer.test.tsx:<VictoryBar data="...">, the renderer emits a<CartesianChart>with one<Bar>child whosedataprop matches the parsed json<VictoryBar>and<VictoryLine>, the renderer emits a<CartesianChart>with one<Bar>and one<Line>child, both consuming the same parsed data<VictoryBar>children, the renderer emits a<CartesianChart>with two<Bar>children<VictoryPie>, the renderer emits a<PolarChart>containing a<Pie>child (not a<CartesianChart>)<VictoryBar horizontal="true">, the renderer propagateshorizontalonto the<Bar>primitivedata, a pie+cartesian mix, or an unrecognized inner tag, the renderer returnsnulland emits a warning logManual Test
<VictoryChart>with one<VictoryBar>and confirm it draws correctly on all platforms<VictoryChart>with two<VictoryBar>children and also one with a<VictoryBar>+<VictoryLine>mix, and confirm both series share axes and render correctly<VictoryChart>whose only child is a<VictoryPie>and confirm the pie renders correctly<VictoryChart>containing invalid json indataor an unrecognized inner tag, and confirm the surrounding narrative text still renders (no crash, chart silently dropped)Issue Owner
Current Issue Owner: @s77rt