Create updated tests for APG design pattern example: checkbox

Part of #443

tests/checkbox/data/commands.csv

@@ -1,8 +1,13 @@
 testId,task,mode,at,commandA,commandB,commandC,commandD,commandE,commandF
-1,navigate to unchecked checkbox,reading,JAWS,X_AND_SHIFT_X,F_AND_SHIFT_F,TAB_AND_SHIFT_TAB,UP_AND_DOWN,LEFT_AND_RIGHT(with Smart Navigation on),
-1,navigate to unchecked checkbox,reading,NVDA,X_AND_SHIFT_X,F_AND_SHIFT_F,TAB_AND_SHIFT_TAB,UP_AND_DOWN,,
-2,navigate to unchecked checkbox,interaction,JAWS,TAB_AND_SHIFT_TAB,,,,,
-2,navigate to unchecked checkbox,interaction,NVDA,TAB_AND_SHIFT_TAB,,,,,
+1,navigate forwards to checkbox,reading,JAWS,X,F,TAB,DOWN,RIGHT(with Smart Navigation on),
+1,navigate forwards to checkbox,reading,NVDA,X,F,TAB,DOWN,,
+2,navigate backwards to checkbox,reading,JAWS,SHIFT_X,SHIFT_F,SHIFT_TAB,UP,LEFT(with Smart Navigation on),
+2,navigate backwards to checkbox,reading,NVDA,SHIFT_X,SHIFT_F,SHIFT_TAB,UP,,
+3,navigate forwards to checkbox,interaction,JAWS,TAB,,,,,
+3,navigate forwards to checkbox,interaction,NVDA,TAB,,,,,
+4,navigate backwards to checkbox,interaction,JAWS,SHIFT_TAB,,,,,
+4,navigate backwards to checkbox,interaction,NVDA,SHIFT_TAB,,,,,
+TODO: fix remaining below
 3,navigate to unchecked checkbox,interaction,voiceover_macos,TAB_AND_SHIFT_TAB,CTRL_OPT_RIGHT_AND_CTRL_OPT_LEFT,CTRL_OPT_CMD_J_AND_SHIFT_CTRL_OPT_CMD_J,,,
 4,navigate to checked checkbox,reading,JAWS,X_AND_SHIFT_X,F_AND_SHIFT_F,TAB_AND_SHIFT_TAB,UP_AND_DOWN,LEFT_AND_RIGHT(with Smart Navigation on),
 4,navigate to checked checkbox,reading,NVDA,X_AND_SHIFT_X,F_AND_SHIFT_F,TAB_AND_SHIFT_TAB,UP_AND_DOWN,,

tests/checkbox/data/js/moveFocusAfterAndCheckFirstCheckbox.js

@@ -0,0 +1,3 @@
+// Move focus to link after first checkbox and set aria-checked on first checkbox
+testPageDocument.querySelector('#afterlink').focus();
+testPageDocument.querySelector('[role="checkbox"]').setAttribute('aria-checked', 'true');

tests/checkbox/data/js/moveFocusAfterFirstCheckbox.js

@@ -0,0 +1,2 @@
+// Move focus to link after first checkbox
+testPageDocument.querySelector('#afterlink').focus();

tests/checkbox/data/js/moveFocusBeforeAndCheckFirstCheckbox.js

@@ -0,0 +1,3 @@
+// Move focus to link before first checkbox and set aria-checked on first checkbox
+testPageDocument.querySelector('#beforelink').focus();
+testPageDocument.querySelector('[role="checkbox"]').setAttribute('aria-checked', 'true');

tests/checkbox/data/js/moveFocusBeforeFirstCheckbox.js

@@ -0,0 +1,2 @@
+// Move focus to link before first checkbox
+testPageDocument.querySelector('#beforelink').focus();

tests/checkbox/data/tests.csv.old

@@ -0,0 +1,27 @@
+testId,title,appliesTo,mode,task,setupScript,setupScriptDescription,refs,instructions,assertion1,assertion2,assertion3,assertion4,assertion5,assertion6
+1,Navigate to an unchecked checkbox in reading mode,"JAWS,NVDA",reading,navigate to unchecked checkbox,,,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the unchecked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+2,Navigate to an unchecked checkbox in interaction mode,"JAWS,NVDA",interaction,navigate to unchecked checkbox,,,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the unchecked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+3,Navigate to an unchecked checkbox,voiceover_macos,interaction,navigate to unchecked checkbox,,,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the unchecked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+4,Navigate to a checked checkbox in reading mode,"JAWS,NVDA",reading,navigate to checked checkbox,checkFirstCheckbox,sets the state of the first checkbox to checked,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the checked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (checked) is conveyed,,,
+5,Navigate to a checked checkbox in interaction mode,"JAWS,NVDA",interaction,navigate to checked checkbox,checkFirstCheckbox,sets the state of the first checkbox to checked,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the checked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (checked) is conveyed,,,
+6,Navigate to a checked checkbox,voiceover_macos,interaction,navigate to checked checkbox,checkFirstCheckbox,sets the state of the first checkbox to checked,checkbox aria-checked ,Navigate to the first checkbox. Note: it should be in the checked state.,Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (checked) is conveyed,,,
+7,Operate a checkbox in reading mode,"JAWS,NVDA",reading,operate checkbox,,,aria-checked ,Check and uncheck the first checkbox.,Change in state is conveyed,,,,,
+8,Operate a checkbox in interaction mode,"JAWS,NVDA",interaction,operate checkbox,,,aria-checked ,Check and uncheck the first checkbox.,Change in state is conveyed,,,,,
+9,Operate a checkbox,voiceover_macos,interaction,operate checkbox,,,aria-checked ,Check and uncheck the first checkbox.,Change in state is conveyed,,,,,
+10,Read an unchecked checkbox in reading mode,"JAWS,NVDA",reading,read unchecked checkbox,moveFocusToFirstCheckbox,sets focus on the first checkbox,checkbox aria-checked ,"When the reading cursor is on the first checkbox, read the first checkbox",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+11,Read an unchecked checkbox in interaction mode,"JAWS,NVDA",interaction,read unchecked checkbox,moveFocusToFirstCheckbox,sets focus on the first checkbox,checkbox aria-checked ,"When the focus is on the first checkbox, read the first checkbox",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+12,Read an unchecked checkbox,voiceover_macos,interaction,read unchecked checkbox,moveFocusToFirstCheckbox,sets focus on the first checkbox,checkbox aria-checked ,"When the focus is on the first checkbox, read the first checkbox",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (not checked) is conveyed,,,
+13,Read a checked checkbox in reading mode,"JAWS,NVDA",reading,read checked checkbox,moveFocusAndCheckFirstCheckbox,sets focus on the first checkbox and sets its state to checked,checkbox aria-checked ,"When the reading cursor is on the first checkbox, read the first checkbox.  Note: it should be in the checked state.",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox ( checked) is conveyed,,,
+14,Read a checked checkbox in interaction mode,"JAWS,NVDA",interaction,read checked checkbox,moveFocusAndCheckFirstCheckbox,sets focus on the first checkbox and sets its state to checked,checkbox aria-checked ,"When the focus is on the first checkbox, read the first checkbox.  Note: it should be in the checked state.",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (checked) is conveyed,,,
+15,Read a checked checkbox,voiceover_macos,interaction,read checked checkbox,moveFocusAndCheckFirstCheckbox,sets focus on the first checkbox and sets its state to checked,checkbox aria-checked ,"When the focus is on the first checkbox, read the first checkbox.  Note: it should be in the checked state.",Role 'checkbox' is conveyed,Name 'Lettuce' is conveyed,State of the checkbox (checked) is conveyed,,,
+16,Read grouping information of a grouped checkbox in reading mode,"JAWS,NVDA",reading,read checkbox group,,,group aria-labelledby,"When reading cursor is on a checkbox, read its grouping information",2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,,,,
+17,Read grouping information of a grouped checkbox in interaction mode,"JAWS,NVDA",interaction,read checkbox group,,,group aria-labelledby,"When focus is on a checkbox, read its grouping information",2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,,,,
+18,Read grouping information of a grouped checkbox,voiceover_macos,interaction,read checkbox group,,,group aria-labelledby,"When focus is on a checkbox, read its grouping information",2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,,,,
+19,Navigate sequentially through a checkbox group in reading mode,"JAWS,NVDA",reading,navigate sequentially through checkbox group,,,checkbox group aria-checked ,Navigate both forward and backward into and out of  the checkbox group.,Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,Group boundaries at start and end of group are conveyed,,,
+20,Navigate sequentially through a checkbox group,voiceover_macos,interaction,navigate sequentially through checkbox group,,,checkbox group aria-checked ,Navigate both forward and backward into and out of  the checkbox group.,Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,Group boundaries at start and end of group are conveyed,,,
+21,Navigate into a checkbox group in reading mode,"JAWS,NVDA",reading,navigate into checkbox group,,,checkbox group aria-checked ,Navigate from outside the checkbox group to a checkbox inside the group. Test both navigating forward into the start and backward into the end.,2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,
+22,Navigate into a checkbox group in interaction mode,"JAWS,NVDA",interaction,navigate into checkbox group,,,checkbox group aria-checked ,Navigate from outside the checkbox group to a checkbox inside the group. Test both navigating forward into the start and backward into the end.,2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,
+23,Navigate into a checkbox group,voiceover_macos,interaction,navigate into checkbox group,,,checkbox group aria-checked ,Navigate from outside the checkbox group to a checkbox inside the group. Test both navigating forward into the start and backward into the end.,2:Role 'group' is conveyed,Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,
+24,Navigate out of a checkbox group  in reading mode,"JAWS,NVDA",reading,navigate out of checkbox group,,,checkbox group aria-checked ,Navigate from a checkbox inside the checkbox group to an element outside the checkbox group. Test both navigating forward out of the end and backward out of the start.,2:Role 'group' is conveyed,2:Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,
+25,Navigate out of a checkbox group in interaction mode,"JAWS,NVDA",interaction,navigate out of checkbox group,,,checkbox group aria-checked ,Navigate from a checkbox inside the checkbox group to an element outside the checkbox group. Test both navigating forward out of the end and backward out of the start.,2:Role 'group' is conveyed,2:Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,
+26,Navigate out of a checkbox group,voiceover_macos,interaction,navigate out of checkbox group,,,checkbox group aria-checked ,Navigate from a checkbox inside the checkbox group to an element outside the checkbox group. Test both navigating forward out of the end and backward out of the start.,2:Role 'group' is conveyed,2:Group name 'Sandwich Condiments' is conveyed,2:The group boundary is conveyed,,,

tests/checkbox/reference/2020-11-23_175030/checkbox-1/checkbox-1.html

@@ -19,9 +19,13 @@ <h1>Checkbox Example (Two State)</h1>
 
   <div id="ex1">
         <h3 id="id-group-label">Sandwich Condiments</h3>
+        <a id="beforelink" href="#beforelink">Navigate forwards from here</a>
         <div role="group" aria-labelledby="id-group-label">
           <ul class="checkboxes">
-            <li><div role="checkbox" aria-checked="false" tabindex= "0">Lettuce</div></li>
+            <li>
+              <div role="checkbox" aria-checked="false" tabindex= "0">Lettuce</div>
+              <a id="afterlink" href="#afterlink">Navigate backwards from here</a>
+            </li>
             <li><div role="checkbox" aria-checked="true"  tabindex= "0">Tomato</div></li>
             <li><div role="checkbox" aria-checked="false" tabindex= "0">Mustard</div></li>
             <li><div role="checkbox" aria-checked="false" tabindex= "0">Sprouts</div></li>