Pie Chart Test Suite

Applet Name:

Pie Chart

Purpose:

This activity allows the user to view and make their own pie charts. A pie chart is an excellent way to show how the relative sizes of the parts of a whole. This activity can be used to:

Description:

This applet allows the user to make pie charts. A pie chart is a graphical way to organize data. All pie charts compare parts of a whole. This applet also allows the user to manipulate the pie chart allowing more flexibility in the 100% balance.

Platforms/Browsers:

Test Cases:

Please remember to reload applet after each test case
Test Case Title Description
Test1_piechart: Applet Layout Verify that the applet's layout is correct and formatted properly (i.e. no cutoff buttons or text).
Test2_piechart: What, How and Why pages Verify the what, how and why pages come up correctly. Ensure that any functionality or usage changes are reflected in the text of the what, how and why pages if necessary.
Note: This is not valid on totest site
Test3_piechart: Initial Values Verify that the initial values below are present when the applet is first started.
  1. Verify that a circle appears with the colors: blue, cyan, green, and magenta.
  2. Verify that the circle has 3 black end dots and one white end dot.
  3. Verify that the circle is divided equally among the four colors.
  4. Verify that percentage boxes for all colors reads, "25.00%."
  5. Verify that the "Number of Sections" are set at 4.
  6. Verify that the "Use Percentages" button is selected.
Test4_piechart: Decreasing the Number of Sections Input:
  1. Click the "-1" button located by the "Number of Sections" text
Output:
  1. Verfiy that the "Number of Sections" decreased by 1.
  2. Verify that the pie chart decreased its number of sections by 1.
  3. Verify that the numbers of sliders available, decreased by 1.
Repeat this test case until the "Number of Sections" is "1."
Test4.1_piechart: Increasing the Number of Sections Input:
  1. Click the "+1" button located by the "Number of Sections" text
Output:
  1. Verfiy that the "Number of Sections" increased by 1.
  2. Verify that the pie chart increased its number of sections by 1.
  3. Verify that the numbers of sliders available, increased by 1.
Repeat this test case until the "Number of Sections" is "9."
Test5_piechart: Changing Percentages: Slider Bar Input:
  1. Slide the slider bar to "15.00"% for the Blue percentage
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bars changed.
  3. Verify that percentages read:
    • Blue - 15.00%
    • Cyan - 35.00%
    • Green - 25.00%
    • Magenta - 25.00%
  4. Verify that nothing else changes.
    Reload the applet
Repeat this test case for the remaining colors
Test5.1_piechart: Changing Percentages: Slider Bar and Decreasing the Number of Sections Input:
  1. Click the "-1" button.
  2. Select random colors and percentages to slide.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bars changed.
  3. Verify that percentages changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "1"
Note: You can not slide the slider bar when only one section is available
Test5.2_piechart: Changing Percentages: Slider Bar and Increasing the Number of Sections Input:
  1. Click the "+1" button.
  2. Select random colors and percentages to slide.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar that is counter clockwise changed .
  3. Verify that the percentage for the counter clockwise color changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "9"
Test6_piechart: Changing Percentages: User - Input Input:
  1. Input the following values into the percentage text box for the appropriate color:
    • Blue = "48.00" %
    • Cyan = "25.00" %
    • Green = "2.00" %
    • Magenta = "25.00" %
  2. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verify that nothing else changed.
Test6.1_piechart: Changing Percentages: User - Input and Decreasing the Number of Sections Input:
  1. Click the "-1" button.
  2. Select random colors and values to input into the percentage text boxes.
    Make sure that the totals equal to "100"!!
  3. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verfiy that the percentages changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "1"
Note: You can not change the percentage when only one section is available
Test6.2_piechart: Changing Percentages: User - Input and Increasing the Number of Sections Input:
  1. Click the "+1" button.
  2. Select random colors and values to input into the percentage text boxes.
    Make sure that the totals equal to "100"!!
  3. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verfiy that the percentages changed.
  4. Verify that the "Number o Sections" changed.
Repeat this test case until the "Number of Sections" = "9"
Test7_piechart: Changing Percentages: Black-dots Input:
  1. Move the black dot located at the top of the piechart to the right.
  2. Move the black dot located at the bottom of the piechart to the left.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the percentages changed.
  4. Verify that nothing else changed.
Test7.1_piechart: Changing Percentages: Black-dots and Decreasing the Number of Sections Input A:
  1. Select random black dots located on the pie chart to move.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the percentages changed.
Input B:
  1. Click the "-1" button.
Output:
  1. Verify that the "Number of Sections" decreased by "1".
Repeat this entire test case until the "Number of Sections" = 1
Note: You do not have a black dot to select when you have only one section.
Test7.2_piechart: Changing Percentages: Black-dots and Increasing the Number of Sections Input A:
  1. Select random black dots located on the pie chart to move.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the percentages changed.
Input B:
  1. Click the "+1" button.
Output:
  1. Verify that the "Number of Sections" increased by 1.
Repeat this entire test case until the "Number of Sections" = "9"
Test8_piechart: Changing Fractions: Slider Bar Input:
  1. Select the "Use Fractions" button.
  2. Slide the blue slider bar to "59/120".
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bars changed.
  3. Verify that fractions read:
    • Blue - 53/120
    • Cyan - 7/120
    • Green - 1/4
    • Magenta - 1/4
  4. Verify that nothing else changes.
Repeat this test case for the remaining colors
Test8.1_piechart: Changing Fractions: Slider Bar and Decreasing the Number of Sections Input:
  1. Click the "-1" button.
  2. Select the "Use Fractions" button.
  3. Select random colors and Fractions to slide.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bars changed.
  3. Verify that Fractions changed.
  4. Verify that the "Number of Sections" decreased by 1.
Repeat this test case until the "Number of Sections" = "1"
Note: You can not slide the slider bar when only one section is available
Test8.2_piechart: Changing Fractions: Slider Bar and Increasing the Number of Sections Input:
  1. Click the "+1" button.
  2. Select the "Use Fractions" button.
  3. Select random colors and Fractions to slide.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bars changed.
  3. Verify that Fractions changed.
  4. Verify that the "Number o Sections" increased by 1.
Repeat this test case until the "Number of Sections" = "9"
Test9_piechart: Changing Fractions: User - Input Input:
  1. Select the "Use Fractions" button.
  2. Input the following values into the fractions text box for the appropriate color:
    • Blue = "29/120"
    • Cyan = "2/5"
    • Green = "1/60"
    • Magenta = "41/120"
  3. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verify that nothing else changed.
Test9.1_piechart: Changing Fractions: User - Input and Decreasing the Number of Sections Input:
  1. Click the "-1" button.
  2. Select the "Use Fractions" button.
  3. Select random colors and values to input into the Fractions text boxes.
    Make sure that the totals equal to "1"!!
  4. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verify that the Fractions changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "1"
Note: You can not change the fraction when only one section is available
Test9.2_piechart: Changing Fractions: User - Input and Increasing the Number of Sections Input:
  1. Click the "+1" button.
  2. Select random colors and values to input into the Fraction text boxes.
    Make sure that the totals equal to "1"!!
  3. Click the "Update Chart" button.
Output:
  1. Verify that the pie chart changed.
  2. Verify that the slider bar changed.
  3. Verify that the Fractions changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "9"
Test10_piechart: Changing Fractions: Black-dots Input:
  1. Move the black dot located at the top of the piechart to the right.
  2. Move the black dot located at the bottom of the piechart to the left.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the Fractions changed.
  4. Verify that nothing else changed.
Test10.1_piechart: Changing Fractions: Black-dots and Decreasing the Number of Sections Input:
  1. Select random black dots located on the pie chart to move.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the Fractions changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "1"
Note: You do not have a black dot to select when you have only one section.
Test10.2_piechart: Changing Fractions: Black-dots and Increasing the Number of Sections Input:
  1. Select random black dots located on the pie chart to move.
Output:
  1. Verify that the piechart changed.
  2. Verify that the slider bars changed.
  3. Verify that the Fractions changed.
  4. Verify that the "Number of Sections" changed.
Repeat this test case until the "Number of Sections" = "9"
Test11_piechart: Percentage Input greater than 100 Input:
  1. Input random numbers in the percentage boxes that total more than or less than 100%.
    For example:
    • Blue - 57%
    • Green - 60%
  2. Click the "Update Chart" button.
Output:
  1. Verify that an error message appears.
    2. Close the error message
Repeat this test case with increasing and decreasing the "Number of Sections"
Note: You can not change the percentages when there is only one section available
Test 11.1_piechart: Fraction Input greater than 1 Input:
  1. Click the "Use Fractions" button.
  2. Input random numbers in the fractions box that total more than or less than 1.
    For example:
    • Cyan - 3/5
    • Magenta - 5/12
  3. Click the "Update Chart" button.
Output:
  1. Verify that an error message appears
    Close the error message
Repeat this test case with increasing and decreasing the "Number of Section"
Note: You can not change the fractions when there is only one section available
Test11.3_piechart: User Errors Input:
  1. Select the "Use Fractions" button.
  2. Input random fractions into the percentages boxes.
  3. Click the "Update Chart" button.
Output:
  1. Verify that an error message appear
    Close the error message
Repeat this test case with inputting percentages into the fractions box