Back to Fluentui

Component testing - Donut chart test plan

packages/charts/react-charting/docs/TestPlans/DonutChart/ComponentTests.md

4.40.2-hotfix28.3 KB
Original Source
<div align="center">

Component testing - Donut chart test plan

Subcomponents: Pie and Legend

Library used: jest and (enzyme or react testing library)

</div>
Test caseExecution stepsValidation stepsLibrary used
Test case 1: [Snapshot testing] [Component]<ul><li>Renders donut chart with data.</li></ul>Donut chart renders correctlyEnzyme
Test case 2: [Snapshot testing] [Individual Props]Renders donut chart with: <ul><li>HideTooltip prop set to “true”.</li></ul>Donut chart renders correctlyEnzyme
<ul><li>HideLegend prop set to “true”.</li></ul>Donut chart renders correctlyEnzyme
<ul><li>EnabledLegendsWrapLines prop set to “true”.</li></ul>Donut chart renders correctlyEnzyme
<ul><li>ValueInsideDonut set to a string / number.</li></ul>Donut chart renders correctlyEnzyme
<ul><li>HideLabels prop set to "false".</li></ul>Donut chart renders correctlyEnzyme
<ul><li>HideLabels prop set to "false" and ShowLabelsInPercent prop set to "true".</li></ul>Donut chart renders correctlyEnzyme
Test case 3: [Specific DOM elements] Renders individual elements on a prop change:<ul><li>HideLegend prop is set to “false”.</li></ul>Legend mounts correctlyEnzyme
<ul><li>HideTootip prop is set to “false”.</li></ul>Callout mounts correctlyEnzyme
<ul><li>onRenderCalloutPerStack prop is not given.</li></ul>Should not render onRenderCalloutPerStackEnzyme
<ul><li>onRenderCalloutPerDataPoint prop is given.</li></ul>Should render onRenderCalloutPerDataPoint correctlyEnzyme
Test case 4: [Mouse events – Donut chart] Renders individual elements on mouse events:<ul><li>On mouse over on the donut chart.</li></ul>Should render calloutEnzyme
<ul><li>On mouse move on Pie 1 (step 1) -> mouse leave (step 2) -> mouse move on Pie 2 (step 3).</li></ul>Html in step 1 should not be the same as in step 3Enzyme
<ul><li>On mouse over with onRenderCalloutPerDataPoint prop provided.</li></ul>Should render the custom calloutEnzyme
<ul><li>On mouse over, followed by mouse leave on callout.</li></ul>On mouse over, callout should be defined, on mouse leave, callout should disappear.Enzyme
Test case 5: [Mouse events – Legends] Renders individual elements on mouse events:<ul><li>On mouse over on legends.</li></ul>Should highlight the corresponding pieRTL
<ul><li>On mouse over on legends.</li></ul>Should change the value inside donut with the legend valueEnzyme
<ul><li>On click on Pie.</li></ul>Should highlight the corresponding pie with aria-selected set to “true” and tabIndex set to 0.RTL
<ul><li>On mouse out after mouse over on first legend.</li></ul>Should have opacity 0.1 for second Pie initially (during mouseOver on first legend) and opacity set to 1 for both the Pies on mouse out.RTL
Test case 6: [Keyboard events – Donut chart] Renders individual elements on keyboard events:<ul><li>On focus on a Pie.</li></ul>Should render the corresponding calloutRTL
<ul><li>On blur on a Pie.</li></ul>Should remove focus from the corresponding PieRTL