Refactor Radio Group Example Using Roving tabindex Test Plan to V2 Te…

…st Format (#1156)

* Convert previous test plan version to v2 format

* Remove previous test plan csv files and log

* update assertions.csv file

* Update tests.csv file

* Update ATs commands

* Add htmlLin to references.csv

* Update references.csv

* Add `aria-setsize` and `aria-posinset` to references and assertions files

* Update setup scripts

* Generate .html source files with scripts automatically

---------

Co-authored-by: James Scholes <james@jamesscholes.com>
Co-authored-by: jscholes <jscholes@users.noreply.github.com>

tests/radiogroup-roving-tabindex/data/assertions.csv

@@ -0,0 +1,19 @@
+assertionId,priority,assertionStatement,assertionPhrase,refIds
+groupBoundary,1,Group boundary is conveyed,convey group boundary,radiogroup
+interactionModeEnabled,2,Screen reader switched from reading mode to interaction mode|{screenReader} switched from {readingMode} to {interactionMode},switch from reading mode to interaction mode|switch from {readingMode} to {interactionMode},
+nameDeepDish,1,"Name of the radio button, 'Deep dish', is conveyed","convey name of the radio button, 'Deep dish'",radio
+nameGroupPizzaCrust,1,"Name of the group, 'Pizza Crust', is conveyed","convey name of the group, 'Pizza Crust'",aria-labelledby
+nameNavigateBackFromHere,1,"Name of the link, 'Navigate backwards from here', is conveyed","convey name of the link, 'Navigate backwards from here'",htmlLink
+nameNavigateForwardsFromHere,1,"Name of the link, 'Navigate forwards from here', is conveyed","convey name of the link, 'Navigate forwards from here'",htmlLink
+nameRegularCrust,1,"Name of the radio button, 'Regular crust', is conveyed","convey name of the radio button, 'Regular crust'",radio
+nameThinCrust,1,"Name of the radio button, 'Thin crust', is conveyed","convey name of the radio button, 'Thin crust'",radio
+numberRadioButtonsGroup3,2,"Number of radio buttons in the group, 3, is conveyed","convey number of radio buttons in the group, 3",aria-setsize radio
+positionRadio1,2,"Position of the radio button, 1, is conveyed","convey position of the radio button, 1",aria-posinset radio
+positionRadio2,2,"Position of the radio button, 2, is conveyed","convey position of the radio button, 2",aria-posinset radio
+positionRadio3,2,"Position of the radio button, 3, is conveyed","convey position of the radio button, 3",aria-posinset radio
+roleGroup,2,Role 'group' is conveyed,convey role 'group',radiogroup
+roleLink,1,Role 'link' is conveyed,convey role 'link',htmlLink
+roleRadio,1,Role 'radio button' is conveyed,convey role 'radio button',radio
+stateChangeToChecked,1,Change in state of the radio button to 'checked' is conveyed,convey change in state of the radio button to 'checked',aria-checked
+stateRadioChecked,1,"State of the radio button, 'checked', is conveyed","convey state of the radio button, 'checked'",aria-checked
+stateRadioUnchecked,3,"State of the radio button, 'unchecked', is conveyed","convey state of the radio button, 'unchecked'",aria-checked

tests/radiogroup-roving-tabindex/data/jaws-commands.csv

@@ -0,0 +1,56 @@
+testId,command,settings,assertionExceptions,presentationNumber
+navForwardsInToRadioGroupWhereNoRadioButtonsAreChecked,f,virtualCursor,,1
+navForwardsInToRadioGroupWhereNoRadioButtonsAreChecked,a,virtualCursor,,1.1
+navForwardsInToRadioGroupWhereNoRadioButtonsAreChecked,down down,virtualCursor,,1.2
+navForwardsInToRadioGroupWhereNoRadioButtonsAreChecked,tab,virtualCursor,2:interactionModeEnabled,1.3
+navForwardsInToRadioGroupWhereNoRadioButtonsAreChecked,tab,pcCursor,,1.4
+navBackInToRadioGroupWhereNoRadioButtonsAreChecked,shift+f,virtualCursor,,3
+navBackInToRadioGroupWhereNoRadioButtonsAreChecked,shift+a,virtualCursor,,3.1
+navBackInToRadioGroupWhereNoRadioButtonsAreChecked,up up,virtualCursor,,3.2
+navBackInToRadioGroupWhereNoRadioButtonsAreChecked,shift+tab,virtualCursor,0:nameThinCrust 1:nameRegularCrust 0:positionRadio3 2:positionRadio1 2:interactionModeEnabled,3.3
+navBackInToRadioGroupWhereNoRadioButtonsAreChecked,shift+tab,pcCursor,0:nameThinCrust 1:nameRegularCrust 0:positionRadio3 2:positionRadio1,3.4
+navForwardsInToRadioGroupWhereFirstRadioButtonIsChecked,f,virtualCursor,,5
+navForwardsInToRadioGroupWhereFirstRadioButtonIsChecked,a,virtualCursor,,5.1
+navForwardsInToRadioGroupWhereFirstRadioButtonIsChecked,down down,virtualCursor,,5.2
+navForwardsInToRadioGroupWhereFirstRadioButtonIsChecked,tab,virtualCursor,2:interactionModeEnabled,5.3
+navForwardsInToRadioGroupWhereFirstRadioButtonIsChecked,tab,pcCursor,,5.4
+NavBackIntoRadioGroupWhereLastRadioChecked,shift+f,virtualCursor,,7
+NavBackIntoRadioGroupWhereLastRadioChecked,shift+a,virtualCursor,,7.1
+NavBackIntoRadioGroupWhereLastRadioChecked,up up,virtualCursor,,7.2
+NavBackIntoRadioGroupWhereLastRadioChecked,shift+tab,virtualCursor,2:interactionModeEnabled,7.3
+NavBackIntoRadioGroupWhereLastRadioChecked,shift+tab,pcCursor,,7.4
+navOutStartRadioGroup,shift+u,virtualCursor,3:groupBoundary ,10
+navOutStartRadioGroup,up up,virtualCursor,,10.1
+navOutStartRadioGroup,shift+tab,virtualCursor,3:groupBoundary ,10.2
+navOutStartRadioGroup,shift+tab,pcCursor,3:groupBoundary ,10.3
+navOutEndRadioGroup,u,virtualCursor,3:groupBoundary ,12
+navOutEndRadioGroup,down down,virtualCursor,,12.1
+navOutEndRadioGroup,tab,virtualCursor,3:groupBoundary ,12.2
+navOutEndRadioGroup,tab,pcCursor,3:groupBoundary ,12.3
+navToNextUncheckedRadio,f,virtualCursor,,20
+navToNextUncheckedRadio,a,virtualCursor,,20.1
+navToNextUncheckedRadio,down,virtualCursor,,20.2
+navToPrevUncheckedRadio,shift+f,virtualCursor,,22
+navToPrevUncheckedRadio,shift+a,virtualCursor,,22.1
+navToPrevUncheckedRadio,up,virtualCursor,,22.2
+navToNextCheckedRadio,f,virtualCursor,,24
+navToNextCheckedRadio,a,virtualCursor,,24.1
+navToNextCheckedRadio,down,virtualCursor,,24.2
+navToPrevCheckedRadio,shift+f,virtualCursor,,26
+navToPrevCheckedRadio,shift+a,virtualCursor,,26.1
+navToPrevCheckedRadio,up,virtualCursor,,26.2
+navToFirstRadio,down,pcCursor,,30
+navToFirstRadio,right,pcCursor,,30.1
+navToLastRadio,up,pcCursor,,32
+navToLastRadio,left,pcCursor,,32.1
+checkRadio,space,virtualCursor,,45
+checkRadio,enter,virtualCursor,2:interactionModeEnabled,45.1
+checkRadio,space,pcCursor,,45.2
+reqInfoAboutUncheckedRadio,ins+tab,virtualCursor,,50
+reqInfoAboutUncheckedRadio,ins+up,virtualCursor,0:positionRadio1 0:numberRadioButtonsGroup3 0:roleGroup 0:nameGroupPizzaCrust,50.1
+reqInfoAboutUncheckedRadio,ins+tab,pcCursor,,50.2
+reqInfoAboutUncheckedRadio,ins+up,pcCursor,0:positionRadio1 0:numberRadioButtonsGroup3 0:roleGroup 0:nameGroupPizzaCrust,50.3
+reqInfoAboutCheckedRadio,ins+tab,virtualCursor,,55
+reqInfoAboutCheckedRadio,ins+up,virtualCursor,0:positionRadio1 0:numberRadioButtonsGroup3 0:roleGroup 0:nameGroupPizzaCrust,55.1
+reqInfoAboutCheckedRadio,ins+tab,pcCursor,,55.2
+reqInfoAboutCheckedRadio,ins+up,pcCursor,0:positionRadio1 0:numberRadioButtonsGroup3 0:roleGroup 0:nameGroupPizzaCrust,55.3

tests/radiogroup-roving-tabindex/data/js/checkFirstRadioButtonAndSetFocusAfterRadioGroup.js

@@ -1,11 +1,10 @@
 // sets the state of the first radio button to checked, and sets focus on a link after the radio group
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
-radios[0].classList.add('focus');
+radios[0].setAttribute('tabindex', '0');
 radios[0].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[0].id);
 testPageDocument.querySelector('#afterlink').focus();

tests/radiogroup-roving-tabindex/data/js/checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js

@@ -1,12 +1,11 @@
 // sets the state of the first radio button to checked, sets focus on a link before the radio group, and hides the group heading
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
-radios[0].classList.add('focus');
+radios[0].setAttribute('tabindex', '0');
 radios[0].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[0].id);
 testPageDocument.querySelector('#beforelink').focus();
 testPageDocument.querySelector('#group_label_1').style.display = 'none';

tests/radiogroup-roving-tabindex/data/js/checkThirdRadioButtonAndSetFocusAfterRadioGroup.js

@@ -1,11 +1,10 @@
 // sets the state of the third radio button to checked, and sets focus on a link after the radio group
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
-radios[2].classList.add('focus');
+radios[2].setAttribute('tabindex', '0');
 radios[2].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[2].id);
 testPageDocument.querySelector('#afterlink').focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnAndCheckFirstRadioButton.js

@@ -1,11 +1,11 @@
 // sets focus on the first radio button, and sets its state to checked
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[0].classList.add('focus');
+radios[0].setAttribute('tabindex', '0');
 radios[0].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[0].id);
-radioGroup.focus();
+radios[0].focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnFirstRadioButton.js

@@ -1,11 +1,11 @@
 // sets focus on the first radio button
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[0].classList.add('focus');
-radioGroup.setAttribute('aria-activedescendant', radios[0].id);
+radios[0].setAttribute('tabindex', '0');
 testPageDocument.querySelector('#group_label_1').style.display = 'none';
-radioGroup.focus();
+radios[0].focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js

@@ -1,11 +1,11 @@
 // sets focus on the first radio button, and checks the  second radio button
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[0].classList.add('focus');
+radios[0].setAttribute('tabindex', '0');
 radios[1].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[0].id);
-radioGroup.focus();
+radios[0].focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnSecondRadioButton.js

@@ -1,10 +1,10 @@
 // sets focus on the second radio button
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[1].classList.add('focus');
-radioGroup.setAttribute('aria-activedescendant', radios[1].id);
-radioGroup.focus();
+radios[1].setAttribute('tabindex', '0');
+radios[1].focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js

@@ -1,11 +1,11 @@
 // sets focus on the second radio button, and checks the first radio button
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[1].classList.add('focus');
+radios[1].setAttribute('tabindex', '0');
 radios[0].setAttribute('aria-checked', 'true');
-radioGroup.setAttribute('aria-activedescendant', radios[1].id);
-radioGroup.focus();
+radios[1].focus();

tests/radiogroup-roving-tabindex/data/js/setFocusOnThirdRadioButton.js

@@ -1,10 +1,10 @@
 // sets focus on the third radio button
-let radioGroup = testPageDocument.querySelector('[role="radiogroup"]');
 let radios = testPageDocument.querySelectorAll('[role="radio"]');
 radios.forEach(r => {
+  r.setAttribute('tabindex', '-1');
   r.setAttribute('aria-checked', 'false');
   r.classList.remove('focus');
 });
 radios[2].classList.add('focus');
-radioGroup.setAttribute('aria-activedescendant', radios[2].id);
-radioGroup.focus();
+radios[2].setAttribute('tabindex', '0');
+radios[2].focus();