├── .husky └── pre-commit ├── .gitignore ├── tests ├── aria │ └── aria-required-text-input │ │ ├── reference │ │ └── 2025-11-5 │ │ │ ├── css │ │ │ └── aria-required.css │ │ │ └── js │ │ │ └── aria-required.js │ │ └── data │ │ ├── js │ │ ├── setFocusAfterRequiredElement.js │ │ ├── setFocusOnRequiredElement.js │ │ ├── setFocusBeforeRequiredElement.js │ │ ├── setFocusAfterNotRequiredElement.js │ │ ├── setFocusOnNotRequiredElement.js │ │ └── setFocusBeforeNotRequiredElement.js │ │ ├── assertions.csv │ │ ├── references.csv │ │ └── scripts.csv └── apg │ ├── alert │ ├── data │ │ ├── scripts.csv │ │ ├── js │ │ │ └── setFocusOnButton.js │ │ ├── voiceover_macos-commands.csv │ │ ├── assertions.csv │ │ ├── jaws-commands.csv │ │ ├── nvda-commands.csv │ │ ├── tests.csv │ │ └── references.csv │ └── reference │ │ └── 2022-4-8_144013 │ │ ├── css │ │ └── alert.css │ │ └── js │ │ └── alert.js │ ├── banner │ ├── data │ │ ├── js │ │ │ ├── setFocusOnTopLink.js │ │ │ ├── setFocusOnBottomLink.js │ │ │ ├── setFocusAfterBanner.js │ │ │ ├── setFocusBeforeBanner.js │ │ │ ├── setFocusAfterBannerAndHideBottomLink.js │ │ │ └── setFocusBeforeBannerAndHideTopLink.js │ │ └── references.csv │ └── reference │ │ └── 2021-10-24_135455 │ │ └── images │ │ ├── w3c.png │ │ ├── landmarks-vo.png │ │ ├── landmarks-jaws.png │ │ ├── landmarks-nvda.png │ │ ├── landmarks-orca.png │ │ └── landmarks-skipto.png │ ├── form │ ├── data │ │ ├── js │ │ │ ├── setFocusOnTopLink.js │ │ │ ├── setFocusOnBottomLink.js │ │ │ ├── setFocusAfterForm.js │ │ │ ├── setFocusBeforeForm.js │ │ │ ├── setFocusBeforeFormAndHideTopLink.js │ │ │ └── setFocusAfterFormAndHideBottomControls.js │ │ └── references.csv │ └── reference │ │ └── 2021-10-24_152221 │ │ └── images │ │ ├── w3c.png │ │ ├── landmarks-vo.png │ │ ├── landmarks-jaws.png │ │ ├── landmarks-nvda.png │ │ ├── landmarks-orca.png │ │ └── landmarks-skipto.png │ ├── main │ ├── data │ │ ├── js │ │ │ ├── setFocusOnTopLink.js │ │ │ ├── setFocusBeforeMain.js │ │ │ ├── setFocusOnBottomLink.js │ │ │ └── setFocusAfterMain.js │ │ └── references.csv │ └── reference │ │ └── 2022-4-28_91451 │ │ ├── images │ │ ├── w3c.png │ │ ├── landmarks-vo.png │ │ ├── landmarks-jaws.png │ │ ├── landmarks-nvda.png │ │ ├── landmarks-orca.png │ │ └── landmarks-skipto.png │ │ └── js │ │ └── tabs.js │ ├── contentinfo │ ├── data │ │ ├── js │ │ │ ├── setFocusOnTopLink.js │ │ │ ├── setFocusOnBottomLink.js │ │ │ ├── setFocusAfterContentinfo.js │ │ │ └── setFocusBeforeContentinfo.js │ │ └── references.csv │ └── reference │ │ └── 2021-10-24_151010 │ │ └── images │ │ ├── w3c.png │ │ ├── landmarks-vo.png │ │ ├── landmarks-jaws.png │ │ ├── landmarks-nvda.png │ │ ├── landmarks-orca.png │ │ └── landmarks-skipto.png │ ├── meter │ ├── data │ │ ├── js │ │ │ ├── setFocusOnMeter.js │ │ │ ├── setFocusAfterMeter.js │ │ │ ├── setFocusBeforeMeter.js │ │ │ └── setFocusOnButton.js │ │ └── references.csv │ └── reference │ │ └── 2022-8-2_11826 │ │ └── css │ │ └── meter.css │ ├── toggle-button │ └── data │ │ ├── js │ │ ├── setFocusOnButton.js │ │ ├── setFocusAfterButton.js │ │ ├── setFocusBeforeButton.js │ │ ├── setFocusOnButtonAndSetStateToPressed.js │ │ ├── setFocusAfterButtonAndSetStateToPressed.js │ │ └── setFocusBeforeButtonAndSetStateToPressed.js │ │ ├── references.csv │ │ ├── scripts.csv │ │ └── assertions.csv │ ├── command-button │ └── data │ │ ├── js │ │ ├── setFocusOnButton.js │ │ ├── setFocusAfterButton.js │ │ └── setFocusBeforeButton.js │ │ ├── scripts.csv │ │ ├── assertions.csv │ │ ├── references.csv │ │ ├── voiceover_macos-commands.csv │ │ ├── tests.csv │ │ ├── nvda-commands.csv │ │ └── jaws-commands.csv │ ├── complementary │ ├── data │ │ ├── js │ │ │ ├── setFocusOnTopLink.js │ │ │ ├── setFocusOnBottomLink.js │ │ │ ├── setFocusAfterComplementary.js │ │ │ └── setFocusBeforeComplementary.js │ │ └── references.csv │ └── reference │ │ └── 2021-10-24_142522 │ │ └── images │ │ ├── w3c.png │ │ ├── landmarks-jaws.png │ │ ├── landmarks-nvda.png │ │ ├── landmarks-orca.png │ │ ├── landmarks-vo.png │ │ └── landmarks-skipto.png │ ├── link-css │ ├── data │ │ ├── js │ │ │ ├── setFocusOnLink.js │ │ │ ├── setFocusAfterLink.js │ │ │ └── setFocusBeforeLink.js │ │ ├── assertions.csv │ │ ├── scripts.csv │ │ ├── voiceover_macos-commands.csv │ │ ├── tests.csv │ │ ├── jaws-commands.csv │ │ ├── references.csv │ │ └── nvda-commands.csv │ └── reference │ │ └── 2023-3-13_142620 │ │ └── js │ │ └── link.js │ ├── link-img-alt │ ├── data │ │ ├── js │ │ │ ├── setFocusOnLink.js │ │ │ ├── setFocusAfterLink.js │ │ │ └── setFocusBeforeLink.js │ │ ├── assertions.csv │ │ ├── scripts.csv │ │ ├── voiceover_macos-commands.csv │ │ ├── references.csv │ │ ├── tests.csv │ │ ├── jaws-commands.csv │ │ └── nvda-commands.csv │ └── reference │ │ └── 2023-3-13_11377 │ │ └── js │ │ └── link.js │ ├── link-span-text │ ├── data │ │ ├── js │ │ │ ├── setFocusOnLink.js │ │ │ ├── setFocusAfterLink.js │ │ │ └── setFocusBeforeLink.js │ │ ├── assertions.csv │ │ ├── scripts.csv │ │ ├── voiceover_macos-commands.csv │ │ ├── references.csv │ │ ├── tests.csv │ │ ├── jaws-commands.csv │ │ └── nvda-commands.csv │ └── reference │ │ └── 2022-4-6_14258 │ │ └── js │ │ └── link.js │ ├── rating-slider │ └── data │ │ ├── js │ │ ├── setFocusOnSlider.js │ │ ├── setFocusAfterSlider.js │ │ ├── setFocusBeforeSlider.js │ │ ├── setFocusOnSliderAndSetValueToOne.js │ │ ├── setFocusOnSliderAndSetValueToFive.js │ │ └── setFocusOnSliderAndSetValueToOneHalfStar.js │ │ └── references.csv │ ├── seek-slider │ └── data │ │ ├── js │ │ ├── setFocusOnSlider.js │ │ ├── setFocusAfterSlider.js │ │ └── setFocusBeforeSlider.js │ │ ├── scripts.csv │ │ └── references.csv │ ├── slider-multithumb │ └── data │ │ ├── js │ │ ├── setFocusOnSlider.js │ │ ├── setFocusAfterSlider.js │ │ ├── setFocusBeforeSlider.js │ │ ├── setFocusOnSliderAndSetValueToFive.js │ │ ├── setFocusOnSliderAndSetValueToOne.js │ │ └── setFocusOnSliderAndSetValueToOneHalfStar.js │ │ └── references.csv │ ├── switch │ └── data │ │ ├── js │ │ ├── setFocusAfterSwitch.js │ │ ├── setFocusBeforeSwitch.js │ │ ├── setFocusOnSwitch.js │ │ ├── setFocusAfterAndTurnOnSwitch.js │ │ ├── setFocusOnAndTurnOnSwitch.js │ │ └── setFocusBeforeAndTurnOnSwitch.js │ │ ├── references.csv │ │ ├── scripts.csv │ │ └── assertions.csv │ ├── checkbox │ └── data │ │ ├── js │ │ ├── setFocusAfterCheckbox.js │ │ ├── setFocusOnCheckbox.js │ │ ├── setFocusBeforeCheckbox.js │ │ ├── setFocusOnAndCheckCheckbox.js │ │ ├── setFocusAfterAndCheckCheckCheckbox.js │ │ └── setFocusBeforeAndCheckCheckbox.js │ │ ├── scripts.csv │ │ └── references.csv │ ├── menu-button-actions │ └── data │ │ ├── js │ │ ├── setFocusOnMenuButton.js │ │ ├── setFocusAfterMenuButton.js │ │ ├── setFocusBeforeMenuButton.js │ │ ├── openMenuAndSetFocusToLastItem.js │ │ └── openMenuAndSetFocusToFirstItem.js │ │ └── scripts.csv │ ├── menubar-editor │ ├── data │ │ └── js │ │ │ ├── focusonfirstlink.js │ │ │ ├── focusonfont.js │ │ │ ├── focusonsize.js │ │ │ ├── focusonstylecolor.js │ │ │ └── focusontextalign.js │ └── reference │ │ ├── 2020-11-19_152059 │ │ └── images │ │ │ ├── down-arrow.svg │ │ │ ├── up-arrow-focus.svg │ │ │ ├── up-arrow.svg │ │ │ ├── down-arrow-focus.svg │ │ │ ├── separator.svg │ │ │ ├── radio-checked-focus.svg │ │ │ ├── radio-checked.svg │ │ │ ├── checkbox-checked-focus.svg │ │ │ └── checkbox-checked.svg │ │ ├── 2020-11-20_13316 │ │ └── images │ │ │ ├── down-arrow.svg │ │ │ ├── up-arrow-focus.svg │ │ │ ├── down-arrow-focus.svg │ │ │ ├── up-arrow.svg │ │ │ ├── separator.svg │ │ │ ├── radio-checked-focus.svg │ │ │ ├── radio-checked.svg │ │ │ ├── checkbox-checked-focus.svg │ │ │ └── checkbox-checked.svg │ │ └── 2020-11-23_175528 │ │ └── images │ │ ├── down-arrow.svg │ │ ├── up-arrow-focus.svg │ │ ├── up-arrow.svg │ │ ├── down-arrow-focus.svg │ │ ├── separator.svg │ │ ├── radio-checked-focus.svg │ │ ├── radio-checked.svg │ │ ├── checkbox-checked-focus.svg │ │ └── checkbox-checked.svg │ ├── minimal-data-grid │ ├── data │ │ ├── js │ │ │ ├── setFocusAfterGrid.js │ │ │ ├── setFocusBeforeGrid.js │ │ │ ├── setFocusOnFifthDataCell.js │ │ │ ├── setFocusOnFirstDataCell.js │ │ │ ├── setFocusOnFirstLinkedCell.js │ │ │ ├── setFocusOnFourthDataCell.js │ │ │ ├── setFocusOnLastDataCell.js │ │ │ ├── setFocusOnSecondDataCell.js │ │ │ ├── setFocusOnSecondLinkedCell.js │ │ │ └── setFocusOnSixthDataCell.js │ │ └── references.csv │ └── reference │ │ └── 2021-3-8_151542 │ │ └── imgs │ │ └── black_keys.png │ ├── switch-button │ └── data │ │ ├── js │ │ ├── setFocusAfterSwitch.js │ │ ├── setFocusBeforeSwitch.js │ │ ├── setFocusOnSwitch.js │ │ ├── setFocusAfterAndTurnOnSwitch.js │ │ ├── setFocusOnAndTurnOnSwitch.js │ │ └── setFocusBeforeAndTurnOnSwitch.js │ │ ├── scripts.csv │ │ ├── assertions.csv │ │ └── references.csv │ ├── combobox-select-only │ └── data │ │ ├── js │ │ ├── moveFocusToCombobox.js │ │ ├── moveFocusAfterCombobox.js │ │ ├── moveFocusBeforeCombobox.js │ │ ├── openListbox.js │ │ ├── openListboxToApple.js │ │ ├── openListboxToGuava.js │ │ └── openListboxToHuckleberry.js │ │ └── references.csv │ ├── horizontal-slider │ └── data │ │ ├── js │ │ ├── setFocusOnRedSlider.js │ │ ├── setFocusAfterRedSlider.js │ │ └── setFocusBeforeRedSlider.js │ │ ├── scripts.csv │ │ └── references.csv │ ├── menu-button-navigation │ └── data │ │ ├── js │ │ ├── setFocusOnMenuButton.js │ │ ├── setFocusAfterMenuButton.js │ │ ├── setFocusBeforeMenuButton.js │ │ ├── openMenuAndSetFocusToFirstItem.js │ │ └── openMenuAndSetFocusToLastItem.js │ │ └── scripts.csv │ ├── switch-checkbox │ └── data │ │ ├── js │ │ ├── setFocusAfterSwitch.js │ │ ├── setFocusBeforeSwitch.js │ │ ├── setFocusOnSwitch.js │ │ ├── setFocusOnAndTurnOnSwitch.js │ │ ├── setFocusAfterAndTurnOnSwitch.js │ │ └── setFocusBeforeAndTurnOnSwitch.js │ │ ├── scripts.csv │ │ ├── assertions.csv │ │ └── references.csv │ ├── vertical-temperature-slider │ ├── data │ │ ├── js │ │ │ ├── setFocusOnSlider.js │ │ │ ├── setFocusAfterSlider.js │ │ │ └── setFocusBeforeSlider.js │ │ └── scripts.csv │ └── reference │ │ └── 2025-7-15_112752 │ │ └── images │ │ ├── arrow-up-a.png │ │ ├── max-arrow-2.png │ │ ├── max-arrow.paint │ │ ├── max-arrow.png │ │ ├── min-arrow-2.png │ │ ├── min-arrow.png │ │ ├── arrow-down-a.png │ │ ├── min-arow.svg │ │ ├── min-arrow.svg │ │ └── max-arrow.svg │ ├── checkbox-tri-state │ └── data │ │ ├── js │ │ ├── moveFocusToFirstCheckbox.js │ │ ├── moveFocusAfterFirstCheckbox.js │ │ ├── moveFocusBeforeFirstCheckbox.js │ │ └── moveFocusToAndUncheckFirstCheckbox.js │ │ └── references.csv │ ├── rating-radio-group │ └── data │ │ ├── js │ │ ├── setFocusAfterRadioGroup.js │ │ ├── setFocusBeforeRadioGroup.js │ │ ├── setFocusOnFifthRadioButton.js │ │ ├── setFocusOnFirstRadioButton.js │ │ ├── setFocusOnSecondRadioButton.js │ │ ├── setFocusOnAndCheckFirstRadioButton.js │ │ ├── checkFifthRadioButtonAndSetFocusAfterRadioGroup.js │ │ ├── checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js │ │ ├── setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js │ │ └── setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js │ │ └── references.csv │ ├── tabs-manual-activation │ └── data │ │ ├── js │ │ ├── setFocusBeforeTablist.js │ │ ├── setFocusOnFirstTab.js │ │ ├── setFocusOnFourthTab.js │ │ ├── setFocusOnSecondTab.js │ │ ├── setFocusAfterTabpanel.js │ │ ├── setFocusOnTabPanel.js │ │ ├── activateAndSetFocusOnFourthTab.js │ │ └── activateAndSetFocusOnSecondTab.js │ │ └── references.csv │ ├── menu-button-actions-active-descendant │ └── data │ │ ├── js │ │ ├── setFocusOnMenuButton.js │ │ ├── setFocusAfterMenuButton.js │ │ ├── setFocusBeforeMenuButton.js │ │ ├── openMenuAndSetFocusToFirstItem.js │ │ └── openMenuAndSetFocusToLastItem.js │ │ └── scripts.csv │ ├── tabs-automatic-activation │ └── data │ │ ├── js │ │ ├── setFocusBeforeTablist.js │ │ ├── setFocusOnFirstTab.js │ │ ├── setFocusOnFourthTab.js │ │ ├── setFocusOnSecondTab.js │ │ ├── setFocusAfterTabpanel.js │ │ ├── setFocusOnTabPanel.js │ │ └── activateAndSetFocusOnFourthTab.js │ │ ├── scripts.csv │ │ └── references.csv │ ├── breadcrumb │ ├── data │ │ ├── js │ │ │ ├── setFocusOnFirstBreadcrumbLink.js │ │ │ ├── setFocusOnLastBreadcrumbLink.js │ │ │ ├── setFocusAfterLastBreadcrumbLink.js │ │ │ └── setFocusBeforeFirstBreadcrumbLink.js │ │ └── references.csv │ └── reference │ │ └── 2022-8-2_132648 │ │ └── css │ │ └── breadcrumb.css │ ├── combobox-autocomplete-both-updated │ └── data │ │ ├── js │ │ ├── moveFocusToCombobox.js │ │ ├── moveFocusBeforeCombobox.js │ │ ├── moveFocusAfterCombobox.js │ │ ├── moveFocusToAndExpandCombobox.js │ │ ├── moveFocusBeforeComboboxAndSetValueToAlabama.js │ │ ├── moveFocusToComboboxAndSetValueToA.js │ │ ├── moveFocusAfterComboboxAndSetValueToAlabama.js │ │ ├── moveFocusToComboboxAndSetValueToAlabama.js │ │ ├── moveFocusToAndExpandComboboxAndSetValueToAWithInputTextDeselected.js │ │ ├── moveFocusToAndExpandComboboxAndSetValueToA.js │ │ ├── moveFocusToAndExpandComboboxAndSetValueToAlabama.js │ │ ├── moveFocusToAlabamaInListbox.js │ │ ├── moveFocusToAlaskaInListbox.js │ │ ├── moveFocusToAlabamaInListboxAndSetInputCursorAtBeginning.js │ │ └── moveFocusToAlabamaInListboxAndSetInputCursorAtEnd.js │ │ └── references.csv │ ├── disclosure-faq │ ├── reference │ │ └── 2025-8-8_7334 │ │ │ └── images │ │ │ └── minard.png │ └── data │ │ ├── js │ │ ├── moveFocusAfterFourthDisclosure.js │ │ ├── moveFocusBeforeFirstDisclosure.js │ │ ├── moveFocusToFirstDisclosure.js │ │ ├── moveFocusToFourthDisclosure.js │ │ ├── moveFocusAfterAndExpandFourthDisclosure.js │ │ ├── moveFocusBeforeAndExpandFirstDisclosure.js │ │ ├── moveFocusToAndExpandFirstDisclosure.js │ │ └── moveFocusToAndExpandFourthDisclosure.js │ │ ├── references.csv │ │ └── scripts.csv │ ├── quantity-spin-button │ └── data │ │ ├── js │ │ ├── setFocusAfterAdultsSpinbutton.js │ │ ├── setFocusBeforeAdultsSpinbutton.js │ │ ├── setFocusOnAdultsSpinbutton.js │ │ ├── setFocusOnAdultsSpinbuttonValue2.js │ │ └── setFocusOnAdultsSpinbuttonValue9.js │ │ └── scripts.csv │ ├── radiogroup-roving-tabindex │ └── data │ │ ├── js │ │ ├── setFocusAfterRadioGroup.js │ │ ├── setFocusBeforeRadioGroup.js │ │ ├── setFocusOnFirstRadioButton.js │ │ ├── setFocusOnSecondRadioButton.js │ │ ├── setFocusOnThirdRadioButton.js │ │ ├── setFocusOnAndCheckFirstRadioButton.js │ │ ├── setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js │ │ ├── setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js │ │ ├── checkFirstRadioButtonAndSetFocusAfterRadioGroup.js │ │ ├── checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js │ │ └── checkThirdRadioButtonAndSetFocusAfterRadioGroup.js │ │ └── references.csv │ ├── disclosure-navigation │ └── data │ │ ├── js │ │ ├── moveFocusAfterThirdDisclosure.js │ │ ├── moveFocusBeforeFirstDisclosure.js │ │ ├── moveFocusToFirstDisclosure.js │ │ ├── moveFocusToSecondDisclosure.js │ │ ├── expandFirstDisclosureAndMoveFocusToOverviewLink.js │ │ ├── expandFirstDisclosureAndMoveFocusToCampusToursLink.js │ │ ├── moveFocusToAndExpandFirstDisclosure.js │ │ ├── moveFocusBeforeAndExpandFirstDisclosure.js │ │ ├── moveFocusToSecondDisclosureAndExpandFirstDisclosure.js │ │ ├── moveFocusToSecondDisclosureAndExpandThirdDisclosure.js │ │ ├── expandThirdDisclosureHideDropdownAndMoveFocusAfterDisclosure.js │ │ ├── expandFirstDisclosureHideDropdownAndMoveFocusToSecondDisclosure.js │ │ └── moveFocusToAndExpandFirstDisclosureAndSetCurrentPage.js │ │ └── references.csv │ ├── modal-dialog │ └── data │ │ ├── js │ │ ├── moveFocusToAddDeliveryAddressButton.js │ │ ├── openAddDeliveryAddressDialogAndFocusFirstInput.js │ │ ├── openAddDeliveryAddressDialogAndFocusAddButton.js │ │ ├── openAddDeliveryAddressDialogAndFocusCancelButton.js │ │ ├── openAddDeliveryAddressDialogAndFocusAddDeliveryAddressHeading.js │ │ ├── openAddressAddedDialogAndFocusOKButton.js │ │ ├── openAddressAddedDialogAndFocusAddressAddedHeading.js │ │ └── openVerificationResultDialogAndFocusCloseButton.js │ │ └── references.csv │ ├── radiogroup-aria-activedescendant │ └── data │ │ └── js │ │ ├── setFocusAfterRadioGroup.js │ │ ├── setFocusBeforeRadioGroup.js │ │ ├── setFocusOnFirstRadioButton.js │ │ ├── setFocusOnThirdRadioButton.js │ │ ├── setFocusOnSecondRadioButton.js │ │ ├── setFocusOnAndCheckFirstRadioButton.js │ │ ├── setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js │ │ ├── setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js │ │ ├── checkFirstRadioButtonAndSetFocusAfterRadioGroup.js │ │ ├── checkThirdRadioButtonAndSetFocusAfterRadioGroup.js │ │ └── checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js │ └── accordion │ └── data │ ├── js │ ├── setFocusOnFirstAccordionHeader.js │ ├── setFocusOnSecondAccordionHeader.js │ ├── setFocusOnNameInputField.js │ ├── setFocusOnAndCollapseFirstAccordionHeader.js │ └── setFocusOnSecondAccordionHeaderAndCollapseFirstAccordionHeader.js │ └── references.csv ├── babel.config.js ├── .prettierrc ├── netlify.toml ├── w3c.json ├── __test__ ├── __mocks__ │ └── tests │ │ └── apg │ │ ├── alert │ │ ├── data │ │ │ ├── scripts.csv │ │ │ ├── js │ │ │ │ └── setFocusOnButton.js │ │ │ ├── voiceover_macos-commands.csv │ │ │ ├── assertions.csv │ │ │ ├── nvda-commands.csv │ │ │ ├── tests.csv │ │ │ ├── jaws-commands.csv │ │ │ └── references.csv │ │ └── reference │ │ │ └── 2022-4-8_144013 │ │ │ ├── css │ │ │ └── alert.css │ │ │ └── js │ │ │ └── alert.js │ │ ├── banner │ │ ├── data │ │ │ ├── js │ │ │ │ ├── setFocusOnTopLink.js │ │ │ │ ├── setFocusOnBottomLink.js │ │ │ │ ├── setFocusAfterBanner.js │ │ │ │ ├── setFocusBeforeBanner.js │ │ │ │ ├── setFocusAfterBannerAndHideBottomLink.js │ │ │ │ └── setFocusBeforeBannerAndHideTopLink.js │ │ │ └── references.csv │ │ └── reference │ │ │ └── 2021-10-24_135455 │ │ │ └── images │ │ │ ├── w3c.png │ │ │ ├── landmarks-vo.png │ │ │ ├── landmarks-jaws.png │ │ │ ├── landmarks-nvda.png │ │ │ ├── landmarks-orca.png │ │ │ └── landmarks-skipto.png │ │ ├── command-button │ │ └── data │ │ │ ├── js │ │ │ ├── setFocusOnButton.js │ │ │ ├── setFocusAfterButton.js │ │ │ └── setFocusBeforeButton.js │ │ │ ├── assertions.csv │ │ │ ├── scripts.csv │ │ │ ├── references.csv │ │ │ ├── voiceover_macos-commands.csv │ │ │ ├── tests.csv │ │ │ ├── nvda-commands.csv │ │ │ └── jaws-commands.csv │ │ └── horizontal-slider │ │ └── data │ │ ├── js │ │ ├── setFocusOnRedSlider.js │ │ ├── setFocusAfterRedSlider.js │ │ └── setFocusBeforeRedSlider.js │ │ ├── scripts.csv │ │ └── references.csv └── utils │ └── index.js ├── .github ├── ISSUE_TEMPLATE │ ├── bug.md │ ├── agenda-item.md │ └── test-feedback.md ├── workflows │ ├── ensure-build-directory-is-absent.yml │ ├── update-pr.yml │ ├── test.yml │ └── js-lint.yml └── dependabot.yml ├── LICENSE.md ├── .prettierignore ├── CODE_OF_CONDUCT.md ├── scripts ├── v2substitutionsForAssertionIds.csv ├── v2substitutionsForTestIds.csv ├── create-all-tests │ └── index.js ├── v2substitutionsForCommands.csv └── test-reviewer │ ├── utils.mjs │ ├── getReferenceForDirectory.mjs │ └── getScriptsData.mjs ├── jest.config.js ├── lib ├── util │ └── console.js └── data │ └── parse-support.js ├── .gitattributes └── .editorconfig /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | npx lint-staged 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | .#* 3 | .DS_* 4 | .eslintcache 5 | build 6 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/reference/2025-11-5/css/aria-required.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: ['@babel/preset-env'], 3 | }; 4 | -------------------------------------------------------------------------------- /tests/apg/alert/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusOnButton,sets focus on the 'Trigger Alert' button 3 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/main/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "printWidth": 100, 4 | "arrowParens": "avoid", 5 | "trailingComma": "es5" 6 | } 7 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/meter/data/js/setFocusOnMeter.js: -------------------------------------------------------------------------------- 1 | // sets focus on the meter 2 | testPageDocument.querySelector('[role="meter"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the button 2 | testPageDocument.querySelector('#toggle').focus(); 3 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | command = "npm ci && npm run build" 3 | publish = "build" 4 | 5 | [build.environment] 6 | NODE_VERSION = "16" 7 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.getElementById('bottom').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the button 2 | testPageDocument.querySelector('#action').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.getElementById('bottom').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/js/setFocusOnLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'W3C website' link 2 | testPageDocument.getElementById('link').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.getElementById('bottom').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/js/setFocusOnLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'W3C website' link 2 | testPageDocument.getElementById('link').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/js/setFocusOnLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'W3C website' link 2 | testPageDocument.getElementById('link').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/meter/data/js/setFocusAfterMeter.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the meter 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusOnSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider 2 | testPageDocument.querySelector('[role="slider"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/seek-slider/data/js/setFocusOnSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider 2 | testPageDocument.querySelector('[role="slider"]').focus(); 3 | -------------------------------------------------------------------------------- /w3c.json: -------------------------------------------------------------------------------- 1 | { 2 | "group": 111355, 3 | "contacts": ["michael-n-cooper"], 4 | "policy": "restricted", 5 | "repo-type": "cg-report" 6 | } 7 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusOnButton,sets focus on the 'Trigger Alert' button 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusOnTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Top' link 2 | testPageDocument.getElementById('top').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/alert/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Trigger Alert' button 2 | testPageDocument.querySelector('#alert-trigger').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.getElementById('bottom').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusAfterForm.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the form landmark 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/meter/data/js/setFocusBeforeMeter.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the meter 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusOnSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider 2 | testPageDocument.querySelector('[role="slider"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusAfterSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusBeforeSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Report a bug 3 | about: Use this template for bugs. 4 | title: '' 5 | labels: bug 6 | assignees: '' 7 | --- 8 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the button 2 | testPageDocument.querySelector('#action').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusAfterCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the checkbox 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusOnCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Lettuce' checkbox 2 | testPageDocument.querySelector('[role="checkbox"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/js/setFocusAfterButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusBeforeForm.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the form landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/main/data/js/setFocusBeforeMain.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the main landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/js/setFocusOnMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the menu button 2 | testPageDocument.querySelector('#menubutton1').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/data/js/focusonfirstlink.js: -------------------------------------------------------------------------------- 1 | // Move focus to the link just before the meunbar 2 | testPageDocument.querySelector('a').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/data/js/focusonfont.js: -------------------------------------------------------------------------------- 1 | // Move focus to the "Font" menu item 2 | testPageDocument.querySelectorAll('[role=menuitem]')[0].focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/data/js/focusonsize.js: -------------------------------------------------------------------------------- 1 | // Move focus to the "Size" menu item 2 | testPageDocument.querySelectorAll('[role=menuitem]')[3].focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/meter/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Change Value' button 2 | testPageDocument.querySelector('button.play-meters').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusAfterGrid.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the grid 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusAfterSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the slider 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/seek-slider/data/js/setFocusAfterSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the slider 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/seek-slider/data/js/setFocusBeforeSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the slider 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusAfterSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch 2 | testPageDocument.querySelector('[role="switch"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusAfterButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.getElementById('bottom').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusAfterBanner.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the banner landmark 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusBeforeBanner.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the banner landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusBeforeCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the checkbox 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/moveFocusToCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the combobox 2 | testPageDocument.querySelector('[role="combobox"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/js/setFocusBeforeButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/horizontal-slider/data/js/setFocusOnRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Red' slider 2 | testPageDocument.querySelector('[role="slider"].red').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/js/setFocusAfterLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the 'W3C website' link 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/js/setFocusOnMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the menu button 2 | testPageDocument.querySelector('#menubutton').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusBeforeGrid.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the grid 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusBeforeSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the slider 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusAfterSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the slider 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusBeforeSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch 2 | testPageDocument.querySelector('[role="switch"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusAfterSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusBeforeSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusBeforeButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/data/js/setFocusOnSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider 2 | testPageDocument.querySelector('[role="slider"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/horizontal-slider/data/js/setFocusAfterRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the Red slider 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/js/setFocusBeforeLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the 'W3C website' link 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/js/setFocusAfterLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the 'W3C website' link 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/js/setFocusAfterLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the 'W3C website' link 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusBeforeSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the slider 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch 2 | testPageDocument.querySelector('[role="switch"]').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/js/setFocusOnButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Trigger Alert' button 2 | testPageDocument.querySelector('#alert-trigger').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox-tri-state/data/js/moveFocusToFirstCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first checkbox 2 | testPageDocument.querySelector('[role="checkbox"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/moveFocusAfterCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the Combobox 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/moveFocusBeforeCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the Combobox 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/horizontal-slider/data/js/setFocusBeforeRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the Red slider 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/js/setFocusBeforeLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the 'W3C website' link 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/js/setFocusBeforeLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the 'W3C website' link 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/js/setFocusAfterMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the menu button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/data/js/focusonstylecolor.js: -------------------------------------------------------------------------------- 1 | // Move focus to the "Style/Color" menu item 2 | testPageDocument.querySelectorAll('[role=menuitem]')[1].focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/data/js/focusontextalign.js: -------------------------------------------------------------------------------- 1 | // Move focus to the "Text Align" menu item 2 | testPageDocument.querySelectorAll('[role=menuitem]')[2].focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the radio group 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusBeforeTablist.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the tab list 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/data/js/setFocusAfterSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the slider 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | All documents in this Repository are licensed by contributors 2 | under the 3 | [W3C Document License](https://www.w3.org/Consortium/Legal/copyright-documents). 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusAfterBanner.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the banner landmark 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/js/setFocusAfterButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox-tri-state/data/js/moveFocusAfterFirstCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the first checkbox 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/data/js/setFocusAfterContentinfo.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the contentinfo landmark 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/data/js/setFocusBeforeContentinfo.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the contentinfo landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/js/setFocusOnMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the menu button 2 | testPageDocument.querySelector('#menubutton1').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/js/setFocusBeforeMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the menu button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/js/setFocusAfterMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the menu button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/js/setFocusBeforeMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the menu button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the radio group 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusBeforeTablist.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the tab list 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/data/js/setFocusBeforeSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the slider 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusAfterRequiredElement.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusOnRequiredElement.js: -------------------------------------------------------------------------------- 1 | // sets focus on the required input 2 | testPageDocument.querySelector('#imaginary-word').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusBeforeBanner.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the banner landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/js/setFocusBeforeButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/horizontal-slider/data/js/setFocusOnRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Red' slider 2 | testPageDocument.querySelector('[role="slider"].red').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/breadcrumb/data/js/setFocusOnFirstBreadcrumbLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'WAI-ARIA Authoring Practices' link 2 | testPageDocument.getElementById('breadcrumb1').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/breadcrumb/data/js/setFocusOnLastBreadcrumbLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Breadcrumb Example' link 2 | testPageDocument.querySelector('[aria-current="page"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/checkbox-tri-state/data/js/moveFocusBeforeFirstCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the first checkbox 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the combobox 2 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/data/js/setFocusAfterComplementary.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the complementary landmark 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/data/js/setFocusBeforeComplementary.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the complementary landmark 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/reference/2025-8-8_7334/images/minard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/disclosure-faq/reference/2025-8-8_7334/images/minard.png -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/landmarks-jaws.png -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/landmarks-nvda.png -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/js/setFocusAfterAdultsSpinbutton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the spin button 2 | testPageDocument.getElementById('afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the radio group 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the radio group 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusBeforeRequiredElement.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/horizontal-slider/data/js/setFocusAfterRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the Red slider 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/breadcrumb/data/js/setFocusAfterLastBreadcrumbLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the 'Breadcrumb Example' link 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusBeforeCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the Combobox 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusAfterFourthDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the fourth disclosure button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusBeforeFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the first disclosure button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusAfterThirdDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the disclosure button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/landmarks-jaws.png -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/landmarks-nvda.png -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/main/reference/2022-4-28_91451/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/moveFocusToAddDeliveryAddressButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Add Delivery Address' button 2 | testPageDocument.querySelector('#ex1 > button').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/js/setFocusBeforeAdultsSpinbutton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the chespin button 2 | testPageDocument.getElementById('beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the radio group 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the radio group 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/horizontal-slider/data/js/setFocusBeforeRedSlider.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the Red slider 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-jaws.png -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-nvda.png -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/banner/reference/2021-10-24_135455/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusToFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first disclosure button 2 | testPageDocument.querySelector('button[aria-controls="faq1_desc"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusBeforeFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the disclosure button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/form/reference/2021-10-24_152221/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/form/reference/2021-10-24_152221/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/js/setFocusAfterMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the menu button 2 | testPageDocument.querySelector('#afterlink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/js/setFocusBeforeMenuButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the menu button 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusToFourthDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fourth disclosure button 2 | testPageDocument.querySelector('button[aria-controls="faq4_desc"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/reference/2021-3-8_151542/imgs/black_keys.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/minimal-data-grid/reference/2021-3-8_151542/imgs/black_keys.png -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnFifthRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fifth radio button 2 | 3 | let radio = document.querySelector('[data-rating="5"]'); 4 | radio.focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button 2 | 3 | let radio = document.querySelector('[data-rating="1"]'); 4 | radio.focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button 2 | 3 | let radio = document.querySelector('[data-rating="2"]'); 4 | radio.focus(); 5 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | resources/keys.mjs 2 | 3 | tests/**/reference/**/* 4 | build/tests/**/* 5 | build/resources/**/* 6 | 7 | __test__/__mocks__/tests/**/reference/**/* 8 | __test__/build/tests/**/* 9 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/js/setFocusOnFirstAccordionHeader.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Personal Information' accordion header 2 | testPageDocument.querySelector('button[aria-controls="sect1"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/js/setFocusOnSecondAccordionHeader.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Billing Address' accordion header 2 | testPageDocument.querySelector('button[aria-controls="sect2"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/breadcrumb/data/js/setFocusBeforeFirstBreadcrumbLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the 'WAI-ARIA Authoring Practices' link 2 | testPageDocument.querySelector('#beforelink').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-jaws.png -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-nvda.png -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-jaws.png -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-nvda.png -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/contentinfo/reference/2021-10-24_151010/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first disclosure button 2 | testPageDocument.querySelector('button[aria-controls="id_about_menu"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusOnFirstTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first tab 2 | const firstTab = document.querySelector('#tab-1'); 3 | if (firstTab) { 4 | firstTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/w3c.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/w3c.png -------------------------------------------------------------------------------- /tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/complementary/reference/2021-10-24_142522/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusOnFirstTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first tab 2 | const firstTab = document.querySelector('#tab-1'); 3 | if (firstTab) { 4 | firstTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusOnFourthTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fourth tab 2 | const fourthTab = document.querySelector('#tab-4'); 3 | if (fourthTab) { 4 | fourthTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusOnSecondTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second tab 2 | const secondTab = document.querySelector('#tab-2'); 3 | if (secondTab) { 4 | secondTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/alert/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,ctrl+opt+space,,,3.0 3 | triggerAlert,space,,,3.1 4 | triggerAlert,enter,,,3.2 5 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToSecondDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second disclosure button 2 | testPageDocument.querySelector('button[aria-controls="id_admissions_menu"]').focus(); 3 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusOnFourthTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fourth tab 2 | const fourthTab = document.querySelector('#tab-4'); 3 | if (fourthTab) { 4 | fourthTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusOnSecondTab.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second tab 2 | const secondTab = document.querySelector('#tab-2'); 3 | if (secondTab) { 4 | secondTab.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Code of Conduct 2 | 3 | All documentation, code and communication under this repository are covered by the [W3C Code of Ethics and Professional Conduct](https://www.w3.org/Consortium/cepc/). 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-vo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-vo.png -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/arrow-up-a.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/arrow-up-a.png -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow-2.png -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow.paint: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow.paint -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow.png -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arrow-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arrow-2.png -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arrow.png -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-jaws.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-jaws.png -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-nvda.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-nvda.png -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-orca.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-orca.png -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/js/setFocusOnAdultsSpinbutton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Adults' spinbutton 2 | testPageDocument.getElementById('adults').select(); 3 | testPageDocument.getElementById('adults').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusAfterTabpanel.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the tab panel 2 | const linkAfter = document.querySelector('#afterlink'); 3 | if (linkAfter) { 4 | linkAfter.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusAfterTabpanel.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the tab panel 2 | const linkAfter = document.querySelector('#afterlink'); 3 | if (linkAfter) { 4 | linkAfter.focus(); 5 | } 6 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/arrow-down-a.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/arrow-down-a.png -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/agenda-item.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Add an agenda item 3 | about: Use this template to bring up a topic in the weekly ARIA-AT Community Group 4 | meeting. 5 | title: '' 6 | labels: '' 7 | assignees: '' 8 | --- 9 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,ctrl+opt+space,,,3.0 3 | triggerAlert,space,,,3.1 4 | triggerAlert,enter,,,3.2 5 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-skipto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/w3c/aria-at/master/__test__/__mocks__/tests/apg/banner/reference/2021-10-24_135455/images/landmarks-skipto.png -------------------------------------------------------------------------------- /tests/apg/alert/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | roleAlert,3,Role 'alert' is conveyed,convey role 'alert',alert 3 | textHello,1,Text 'Hello' is conveyed,convey text 'Hello',alert 4 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/openListbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the Combobox 2 | testPageDocument.querySelector('[role="combobox"]').focus(); 3 | testPageDocument.defaultView.selectController.updateMenuState(true); 4 | -------------------------------------------------------------------------------- /tests/apg/main/data/js/setFocusOnBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Bottom' link 2 | testPageDocument.querySelector('.button-run-test-setup').parentElement.style.display = 'none'; 3 | testPageDocument.getElementById('bottom').focus(); 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | roleAlert,3,Role 'alert' is conveyed,convey role 'alert', 3 | textHello,1,Text 'Hello' is conveyed,convey text 'Hello', 4 | -------------------------------------------------------------------------------- /scripts/v2substitutionsForAssertionIds.csv: -------------------------------------------------------------------------------- 1 | oldWords,newWords 2 | a, 3 | an, 4 | backwards,back 5 | Change in state,state change 6 | in, 7 | information,info 8 | is conveyed, 9 | of, 10 | previous,prev 11 | radio button,radio 12 | the, 13 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterButton,sets focus on a link after the button 3 | setFocusBeforeButton,sets focus on a link before the button 4 | setFocusOnButton,sets focus on the button 5 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameW3cWebsite,1,Name 'W3C website' is conveyed.,convey name 'W3C website'., 3 | roleLink,1,Role 'link' is conveyed,convey role 'link',link 4 | -------------------------------------------------------------------------------- /tests/apg/main/data/js/setFocusAfterMain.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the main landmark 2 | testPageDocument.querySelector('.button-run-test-setup').parentElement.style.display = 'none'; 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnFifthDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fifth cell of the second row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(0, 4); 3 | testPageDocument.defaultView.ex1Grid.focusCell(0, 4); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnFirstDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first cell of the second row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(0, 0); 3 | testPageDocument.defaultView.ex1Grid.focusCell(0, 0); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnFirstLinkedCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the third cell of the second row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(0, 2); 3 | testPageDocument.defaultView.ex1Grid.focusCell(0, 2); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnFourthDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fourth cell of the second row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(0, 3); 3 | testPageDocument.defaultView.ex1Grid.focusCell(0, 3); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnLastDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fifth cell of the seventh row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(5, 4); 3 | testPageDocument.defaultView.ex1Grid.focusCell(5, 4); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnSecondDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second cell of the second row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(0, 1); 3 | testPageDocument.defaultView.ex1Grid.focusCell(0, 1); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnSecondLinkedCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the third cell of the third row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(1, 2); 3 | testPageDocument.defaultView.ex1Grid.focusCell(1, 2); 4 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/js/setFocusOnSixthDataCell.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first cell of the third row in the grid 2 | testPageDocument.defaultView.ex1Grid.setFocusPointer(1, 0); 3 | testPageDocument.defaultView.ex1Grid.focusCell(1, 0); 4 | -------------------------------------------------------------------------------- /tests/apg/seek-slider/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterSlider,sets focus on a link after the slider 3 | setFocusBeforeSlider,sets focus on a link before the slider 4 | setFocusOnSlider,sets focus on the slider 5 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusAfterCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the Combobox 2 | testPageDocument.querySelector('#cb1-button').style.display = 'none'; 3 | testPageDocument.querySelector('#afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameW3cWebsite,1,Name 'W3C website' is conveyed,convey name 'W3C website',aria-label 3 | roleLink,1,Role 'link' is conveyed,convey role 'link',link 4 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameW3cWebsite,1,Name 'W3C website' is conveyed,convey name 'W3C website',link 3 | roleLink,1,Role 'link' is conveyed,convey role 'link',link 4 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/js/openMenuAndSetFocusToLastItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'Action 4' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToLastMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/alert/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,space,virtualCursor,,1.0 3 | triggerAlert,enter,virtualCursor,,1.1 4 | triggerAlert,space,pcCursor,,2.0 5 | triggerAlert,enter,pcCursor,,2.1 6 | -------------------------------------------------------------------------------- /tests/apg/alert/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,space,browseMode,,1.0 3 | triggerAlert,enter,browseMode,,1.1 4 | triggerAlert,space,focusMode,,2.0 5 | triggerAlert,enter,focusMode,,2.1 6 | -------------------------------------------------------------------------------- /tests/apg/alert/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | triggerAlert,Trigger an alert,3,setFocusOnButton,"Starting at the 'Trigger Alert' button, activate the button to trigger the alert.",roleAlert textHello 3 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/js/openMenuAndSetFocusToFirstItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'Action 1' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToFirstMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAndExpandCombobox.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the combobox 2 | testPageDocument.defaultView.comboboxController.open(); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | namePrintPage,1,Name 'Print Page' is conveyed,convey name 'Print Page',button 3 | roleButton,1,Role 'button' is conveyed,convey role 'button',button 4 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusBeforeFormAndHideTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the form landmark, and hides the 'Top' link 2 | testPageDocument.getElementById('top').setAttribute('hidden', ''); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/js/openMenuAndSetFocusToFirstItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'W3C Home Page' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToFirstMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterSlider,sets focus on a link after the slider 3 | setFocusBeforeSlider,sets focus on a link before the slider 4 | setFocusOnSlider,sets focus on the slider 5 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | namePrintPage,1,Name 'Print Page' is conveyed,convey name 'Print Page', 3 | roleButton,1,Role 'button' is conveyed,convey role 'button', 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterButton,sets focus on a link after the button 3 | setFocusBeforeButton,sets focus on a link before the button 4 | setFocusOnButton,sets focus on the button 5 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,space,browseMode,,1.0 3 | triggerAlert,enter,browseMode,,1.1 4 | triggerAlert,space,focusMode,,2.0 5 | triggerAlert,enter,focusMode,,2.1 6 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | triggerAlert,Trigger an alert,3,setFocusOnButton,"Starting at the 'Trigger Alert' button, activate the button to trigger the alert.",roleAlert textHello 3 | -------------------------------------------------------------------------------- /tests/apg/horizontal-slider/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterRedSlider,sets focus on a link after the Red slider 3 | setFocusBeforeRedSlider,sets focus on a link before the Red slider 4 | setFocusOnRedSlider,sets focus on the 'Red' slider 5 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterLink,sets focus on a link after the 'W3C website' link 3 | setFocusBeforeLink,sets focus on a link before the 'W3C website' link 4 | setFocusOnLink,sets focus on the 'W3C website' link 5 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/js/openMenuAndSetFocusToFirstItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'Action 1' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToFirstMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/js/openMenuAndSetFocusToLastItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'Action 4' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToLastMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and sets its state to checked 2 | 3 | let radio = document.querySelector('[data-rating="1"]'); 4 | document.defaultView.radioController.setChecked(radio); 5 | -------------------------------------------------------------------------------- /tests/apg/alert/reference/2022-4-8_144013/css/alert.css: -------------------------------------------------------------------------------- 1 | [role="alert"] { 2 | padding: 10px; 3 | border: 2px solid hsl(206deg 74% 54%); 4 | border-radius: 4px; 5 | background: hsl(206deg 74% 90%); 6 | } 7 | 8 | [role="alert"]:empty { 9 | display: none; 10 | } 11 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterLink,sets focus on a link after the 'W3C website' link 3 | setFocusBeforeLink,sets focus on a link before the 'W3C website' link 4 | setFocusOnLink,sets focus on the 'W3C website' link 5 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterLink,sets focus on a link after the 'W3C website' link 3 | setFocusBeforeLink,sets focus on a link before the 'W3C website' link 4 | setFocusOnLink,sets focus on the 'W3C website' link 5 | -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/js/openMenuAndSetFocusToLastItem.js: -------------------------------------------------------------------------------- 1 | // opens the menu, and sets focus on 'Accessible Name and Description' 2 | testPageDocument.defaultView.menuController.openPopup(); 3 | testPageDocument.defaultView.menuController.setFocusToLastMenuitem(); 4 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/down-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/down-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/up-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/down-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/up-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/up-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/down-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/up-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/up-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/up-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusOnAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch, and sets its state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('checked', 'true'); 3 | testPageDocument.querySelector('[role="switch"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusAfterAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch, and sets the switch state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusOnAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch, and sets its state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.querySelector('[role="switch"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusOnAndCheckCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Lettuce' checkbox, and sets its state to 'checked' 2 | testPageDocument.querySelector('[role="checkbox"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.querySelector('[role="checkbox"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/down-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/down-arrow-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusAfterAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch, and sets the switch state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusOnAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Notifications' switch, and sets its state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.querySelector('[role="switch"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusAfterAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the switch, and sets the switch state to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('checked', 'true'); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/setFocusOnTabPanel.js: -------------------------------------------------------------------------------- 1 | // sets focus on the tab panel 2 | // Find the first tab panel by its ID, #tabpanel-1, and set focus on it. 3 | const firstPanel = document.querySelector('#tabpanel-1'); 4 | if (firstPanel) { 5 | firstPanel.focus(); 6 | } 7 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/horizontal-slider/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterRedSlider,sets focus on a link after the Red slider 3 | setFocusBeforeRedSlider,sets focus on a link before the Red slider 4 | setFocusOnRedSlider,sets focus on the 'Red' slider 5 | -------------------------------------------------------------------------------- /tests/apg/checkbox-tri-state/data/js/moveFocusToAndUncheckFirstCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first checkbox and sets its state to unchecked 2 | const checkbox = testPageDocument.querySelector('[role="checkbox"]'); 3 | checkbox.setAttribute('aria-checked', 'false'); 4 | checkbox.focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/separator.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/separator.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/separator.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddDeliveryAddressDialogAndFocusFirstInput.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' modal dialog, and sets focus on the first input 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn); 4 | -------------------------------------------------------------------------------- /tests/apg/switch/data/js/setFocusBeforeAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch, and sets the state of the switch to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/reference/2022-4-8_144013/css/alert.css: -------------------------------------------------------------------------------- 1 | [role="alert"] { 2 | padding: 10px; 3 | border: 2px solid hsl(206deg 74% 54%); 4 | border-radius: 4px; 5 | background: hsl(206deg 74% 90%); 6 | } 7 | 8 | [role="alert"]:empty { 9 | display: none; 10 | } 11 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(js?|tsx?|ts?)$', 3 | transform: { 4 | '^.+\\.mjs$': 'babel-jest', 5 | }, 6 | testPathIgnorePatterns: ['/build/', '/node_modules/'], 7 | moduleFileExtensions: ['js', 'mjs'], 8 | }; 9 | -------------------------------------------------------------------------------- /scripts/v2substitutionsForTestIds.csv: -------------------------------------------------------------------------------- 1 | oldWords,newWords 2 | a, 3 | an, 4 | backwards,back 5 | in, 6 | in a group, 7 | information,info 8 | interaction, 9 | is conveyed, 10 | mode, 11 | Navigate,nav 12 | of, 13 | previous,prev 14 | radio button,radio 15 | Read,req 16 | reading, 17 | the, 18 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusAfterBannerAndHideBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the banner landmark, and hides the last link inside the landmark region 2 | testPageDocument.getElementById('bottom').setAttribute('hidden', ''); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/banner/data/js/setFocusBeforeBannerAndHideTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the banner landmark, and hides the first link inside the landmark region 2 | testPageDocument.getElementById('top').setAttribute('hidden', ''); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/js/setFocusBeforeAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch, and sets the state of the switch to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/js/setFocusBeforeAndTurnOnSwitch.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the switch, and sets the state of the switch to 'on' 2 | testPageDocument.querySelector('[role="switch"]').setAttribute('checked', 'true'); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusAfterAndCheckCheckCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the checkbox, and sets the checkbox state to 'checked' 2 | testPageDocument.querySelector('[role="checkbox"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/expandFirstDisclosureAndMoveFocusToOverviewLink.js: -------------------------------------------------------------------------------- 1 | // expands the first disclosure and sets focus on the 'Overview' link 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.querySelector('#id_about_menu a').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/radio-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/radio-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/radio-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/radio-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/radio-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/radio-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/js/setFocusBeforeAndCheckCheckbox.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the checkbox, and sets the state of the checkbox to 'checked' 2 | testPageDocument.querySelector('[role="checkbox"]').setAttribute('aria-checked', 'true'); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddDeliveryAddressDialogAndFocusAddButton.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' modal dialog, and sets focus on the 'Add' button 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_add'); 4 | -------------------------------------------------------------------------------- /scripts/create-all-tests/index.js: -------------------------------------------------------------------------------- 1 | const createAllTests = require('./createAllTests'); 2 | 3 | createAllTests() 4 | .then(() => { 5 | // Do nothing, successfully ran 6 | }) 7 | .catch(error => { 8 | console.error(`createAllTests failed to successfully run: ${error.message}`); 9 | }); 10 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/expandFirstDisclosureAndMoveFocusToCampusToursLink.js: -------------------------------------------------------------------------------- 1 | // expands the first disclosure and sets focus on the 'Campus Tours' link 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.getElementById('campus-tours-link').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddDeliveryAddressDialogAndFocusCancelButton.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' modal dialog, and sets focus on the 'Cancel' button 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_cancel'); 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusAfterBannerAndHideBottomLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the banner landmark, and hides the last link inside the landmark region 2 | testPageDocument.getElementById('bottom').setAttribute('hidden', ''); 3 | testPageDocument.getElementById('afterlink').focus(); 4 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/js/setFocusBeforeBannerAndHideTopLink.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the banner landmark, and hides the first link inside the landmark region 2 | testPageDocument.getElementById('top').setAttribute('hidden', ''); 3 | testPageDocument.getElementById('beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusBeforeComboboxAndSetValueToAlabama.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the Combobox, and sets the combobox value to 'Alabama' 2 | testPageDocument.defaultView.comboboxController.setValue('Alabama'); 3 | testPageDocument.querySelector('#beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToAndExpandFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first disclosure button, and sets its state to expanded 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.querySelector('button[aria-controls="id_about_menu"]').focus(); 4 | -------------------------------------------------------------------------------- /scripts/v2substitutionsForCommands.csv: -------------------------------------------------------------------------------- 1 | screenReader,oldCommand,newCommand,settings 2 | VoiceOver,CTRL_OPT_CMD_(\w),$1 ,quickNavOn 3 | VoiceOver,SHIFT_CTRL_OPT_CMD_(\w),$1 ,quickNavOn 4 | VoiceOver,LEFT,LEFT,quickNavOff 5 | VoiceOver,RIGHT,RIGHT,quickNavOff 6 | VoiceOver,DOWN,DOWN,quickNavOff 7 | VoiceOver,UP,UP,quickNavOff 8 | -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/js/setFocusOnAdultsSpinbuttonValue2.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Adults' spinbutton and sets value to 2 2 | testPageDocument.defaultView.spinButtonController.setValue('2', true); 3 | testPageDocument.getElementById('adults').select(); 4 | testPageDocument.getElementById('adults').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/js/setFocusOnAdultsSpinbuttonValue9.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Adults' spinbutton and sets value to 9 2 | testPageDocument.defaultView.spinButtonController.setValue('9', true); 3 | testPageDocument.getElementById('adults').select(); 4 | testPageDocument.getElementById('adults').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/checkbox-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-20_13316/images/checkbox-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusOnSliderAndSetValueToOne.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to one star 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '1'); 4 | slider.setAttribute('aria-valuetext', 'one of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusBeforeAndExpandFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the first disclosure button, and sets the state of the first button to 'expanded' 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.querySelector('#beforelink').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/checkbox-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-19_152059/images/checkbox-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/checkbox-checked-focus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/menubar-editor/reference/2020-11-23_175528/images/checkbox-checked.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusOnSliderAndSetValueToFive.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to five stars 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '5'); 4 | slider.setAttribute('aria-valuetext', 'five of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusOnSliderAndSetValueToFive.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to five stars 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '5'); 4 | slider.setAttribute('aria-valuetext', 'five of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusOnSliderAndSetValueToOne.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to one star 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '1'); 4 | slider.setAttribute('aria-valuetext', 'one of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/setFocusOnTabPanel.js: -------------------------------------------------------------------------------- 1 | // sets focus on the link inside the tab panel 2 | // Find the first link inside the first tab panel. 3 | const linkInPanel = document.querySelector('#tabpanel-1 a'); 4 | // Set focus on the link if it is found. 5 | if (linkInPanel) { 6 | linkInPanel.focus(); 7 | } 8 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | triggerAlert,space,virtualCursor,,1.0 3 | triggerAlert,enter,virtualCursor,,1.1 4 | triggerAlert,space,pcCursor,,2.0 5 | triggerAlert,jaws nvda vo del delete esc escape jaws+space nvda+space vo+space,pcCursor,,2.1 6 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusOnButtonAndSetStateToPressed.js: -------------------------------------------------------------------------------- 1 | // sets focus on the button, and sets its state to 'pressed' 2 | let button = testPageDocument.querySelector('#toggle'); 3 | button.setAttribute('aria-pressed', 'true'); 4 | button.querySelector('use').setAttribute('xlink:href', '#icon-sound'); 5 | button.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/openListboxToApple.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the Combobox, and sets the focused option to 'Apple' 2 | testPageDocument.querySelector('[role="combobox"]').focus(); 3 | testPageDocument.defaultView.selectController.updateMenuState(true); 4 | testPageDocument.defaultView.selectController.onOptionChange(1); 5 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToSecondDisclosureAndExpandFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // expands the first disclosure button and sets focus on the second disclosure button 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.querySelector('button[aria-controls="id_admissions_menu"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddDeliveryAddressDialogAndFocusAddDeliveryAddressHeading.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' modal dialog, and sets focus on the 'Add Delivery Address' heading 2 | 3 | const btn = testPageDocument.querySelector('#ex1 > button'); 4 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_label'); 5 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/js/setFocusOnSliderAndSetValueToOneHalfStar.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to one half star 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '0.5'); 4 | slider.setAttribute('aria-valuetext', 'one half of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/openListboxToGuava.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the Combobox, and sets the focused option to 'Guave' 2 | testPageDocument.querySelector('[role="combobox"]').focus(); 3 | testPageDocument.defaultView.selectController.updateMenuState(true); 4 | testPageDocument.defaultView.selectController.onOptionChange(11); 5 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/js/setFocusOnSliderAndSetValueToOneHalfStar.js: -------------------------------------------------------------------------------- 1 | // sets focus on the slider, and sets its value to one half star 2 | let slider = testPageDocument.querySelector('[role="slider"]'); 3 | slider.setAttribute('aria-valuenow', '0.5'); 4 | slider.setAttribute('aria-valuetext', 'one half of five stars'); 5 | slider.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/js/openListboxToHuckleberry.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the Combobox, and sets the focused option to 'Huckleberry' 2 | testPageDocument.querySelector('[role="combobox"]').focus(); 3 | testPageDocument.defaultView.selectController.updateMenuState(true); 4 | testPageDocument.defaultView.selectController.onOptionChange(12); 5 | -------------------------------------------------------------------------------- /scripts/test-reviewer/utils.mjs: -------------------------------------------------------------------------------- 1 | const unescapeHTML = string => 2 | string.replace( 3 | /&|<|>|'|"/g, 4 | tag => 5 | ({ 6 | '&': '&', 7 | '<': '<', 8 | '>': '>', 9 | ''': "'", 10 | '"': '"', 11 | })[tag] || tag 12 | ); 13 | 14 | export { unescapeHTML }; 15 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToSecondDisclosureAndExpandThirdDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets the state of the third disclosure button to expanded and sets focus on the second disclosure button 2 | testPageDocument.defaultView.disclosureController.toggleExpand(2, true); 3 | testPageDocument.querySelector('button[aria-controls="id_admissions_menu"]').focus(); 4 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/checkFifthRadioButtonAndSetFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the fifth radio button to checked, and sets focus on a link after the radio group 2 | 3 | let radio = document.querySelector('[data-rating="5"]'); 4 | document.defaultView.radioController.setChecked(radio); 5 | document.querySelector('#afterlink').focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first radio button to checked, and sets focus on a link before the radio group 2 | 3 | let radio = document.querySelector('[data-rating="1"]'); 4 | document.defaultView.radioController.setChecked(radio); 5 | document.querySelector('#beforelink').focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToComboboxAndSetValueToA.js: -------------------------------------------------------------------------------- 1 | // sets focus on the combobox, and sets the combobox value to 'a' 2 | testPageDocument.defaultView.comboboxController.setValue('a'); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.select(); 4 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/form/data/js/setFocusAfterFormAndHideBottomControls.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the form landmark, and hides the 'Bottom' link and 'Add Contact' button 2 | testPageDocument.querySelector('[type="submit"]').style.display = 'none'; 3 | testPageDocument.getElementById('bottom').setAttribute('hidden', ''); 4 | testPageDocument.getElementById('afterlink').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/main/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Main Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2022-4-28_91451/main.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_main 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/main.html 8 | main,https://w3c.github.io/aria/#main -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusAfterComboboxAndSetValueToAlabama.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the Combobox, and sets the combobox value to 'Alabama' 2 | testPageDocument.querySelector('#cb1-button').style.display = 'none'; 3 | testPageDocument.defaultView.comboboxController.setValue('Alabama'); 4 | testPageDocument.querySelector('#afterlink').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToComboboxAndSetValueToAlabama.js: -------------------------------------------------------------------------------- 1 | // sets focus on the combobox, and sets the combobox value to 'Alabama' 2 | testPageDocument.defaultView.comboboxController.setValue('Alabama'); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.select(); 4 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 5 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusAfterNotRequiredElement.js: -------------------------------------------------------------------------------- 1 | // Set aria-required attribute on the text input to "false" 2 | var input = testPageDocument.getElementById('imaginary-word'); 3 | if (input) { 4 | input.setAttribute('aria-required', 'false'); 5 | } 6 | // set focus on a link after the text input 7 | testPageDocument.querySelector('#afterlink').focus(); 8 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusOnNotRequiredElement.js: -------------------------------------------------------------------------------- 1 | // Set aria-required attribute on the text input to "false" 2 | var input = testPageDocument.getElementById('imaginary-word'); 3 | if (input) { 4 | input.setAttribute('aria-required', 'false'); 5 | } 6 | // set focus on the not required text input 7 | testPageDocument.querySelector('#imaginary-word').focus(); 8 | -------------------------------------------------------------------------------- /tests/apg/meter/reference/2022-8-2_11826/css/meter.css: -------------------------------------------------------------------------------- 1 | [role="meter"] { 2 | padding: 2px; 3 | width: 200px; 4 | height: 40px; 5 | border: 2px solid black; 6 | border-radius: 5px; 7 | } 8 | 9 | .fill { 10 | width: 100%; 11 | height: 100%; 12 | box-sizing: border-box; 13 | border: 2px solid black; 14 | border-radius: 3px; 15 | background-color: black; 16 | } 17 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/js/setFocusBeforeNotRequiredElement.js: -------------------------------------------------------------------------------- 1 | // Set aria-required attribute on the text input to "false" 2 | var input = testPageDocument.getElementById('imaginary-word'); 3 | if (input) { 4 | input.setAttribute('aria-required', 'false'); 5 | } 6 | // set focus on a link before the text input 7 | testPageDocument.querySelector('#beforelink').focus(); 8 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and checks the second radio button 2 | 3 | let firstRadio = document.querySelector('[data-rating="1"]'); 4 | let secondRadio = document.querySelector('[data-rating="2"]'); 5 | document.defaultView.radioController.setChecked(secondRadio); 6 | firstRadio.focus(); 7 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/js/setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button, and checks the first radio button 2 | 3 | let firstRadio = document.querySelector('[data-rating="1"]'); 4 | let secondRadio = document.querySelector('[data-rating="2"]'); 5 | document.defaultView.radioController.setChecked(firstRadio); 6 | secondRadio.focus(); 7 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusAfterButtonAndSetStateToPressed.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link after the button, and sets the state of the button to 'pressed' 2 | let button = testPageDocument.querySelector('#toggle'); 3 | button.setAttribute('aria-pressed', 'true'); 4 | button.querySelector('use').setAttribute('xlink:href', '#icon-sound'); 5 | testPageDocument.querySelector('#afterlink').focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/js/setFocusBeforeButtonAndSetStateToPressed.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the button, and sets the state of the button to 'pressed' 2 | let button = testPageDocument.querySelector('#toggle'); 3 | button.setAttribute('aria-pressed', 'true'); 4 | button.querySelector('use').setAttribute('xlink:href', '#icon-sound'); 5 | testPageDocument.querySelector('#beforelink').focus(); 6 | -------------------------------------------------------------------------------- /lib/util/console.js: -------------------------------------------------------------------------------- 1 | const colors = { 2 | reset: '\x1b[0m', 3 | red: '\x1b[91m', 4 | green: '\x1b[92m', 5 | yellow: '\x1b[93m', 6 | }; 7 | 8 | const text = (text, { color = '', severity = 'log', performReset = true }) => { 9 | console[severity](`${color}${text}${performReset ? colors.reset : ''}`); 10 | }; 11 | 12 | module.exports = { 13 | consoleColors: colors, 14 | consoleText: text, 15 | }; 16 | -------------------------------------------------------------------------------- /tests/apg/contentinfo/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Contentinfo Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-10-24_151010/contentinfo.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_contentinfo 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/contentinfo.html 8 | contentinfo,https://w3c.github.io/aria/#contentinfo -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAndExpandComboboxAndSetValueToAWithInputTextDeselected.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the combobox, sets the combobox value to 'a', and de-selects all text in the input 2 | testPageDocument.defaultView.comboboxController.setValue('a'); 3 | testPageDocument.defaultView.comboboxController.open(); 4 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,ctrl+opt+right,,,3.0 3 | navForwardsToLink,tab,,,3.1 4 | navForwardsToLink,l,quickNavOn,,3.2 5 | navBackToLink,ctrl+opt+left,,,6.0 6 | navBackToLink,shift+tab,,,6.1 7 | navBackToLink,shift+l,quickNavOn,,6.2 8 | reqInfoAboutLink,ctrl+opt+f3,,,9.0 9 | reqInfoAboutLink,ctrl+opt+f4,,,9.1 10 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,ctrl+opt+right,,,3.0 3 | navForwardsToLink,tab,,,3.1 4 | navForwardsToLink,l,quickNavOn,,3.2 5 | navBackToLink,ctrl+opt+left,,,6.0 6 | navBackToLink,shift+tab,,,6.1 7 | navBackToLink,shift+l,quickNavOn,,6.2 8 | reqInfoAboutLink,ctrl+opt+f3,,,9.0 9 | reqInfoAboutLink,ctrl+opt+f4,,,9.1 10 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/test-feedback.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feedback about tests 3 | about: Use this template to give feedback about tests. 4 | title: 'Feedback on test:' 5 | labels: '' 6 | assignees: '' 7 | --- 8 | 9 | 14 | -------------------------------------------------------------------------------- /tests/apg/complementary/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Complementary Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-10-24_142522/complementary.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_complementary 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/complementary.html 8 | complementary,https://w3c.github.io/aria/#complementary -------------------------------------------------------------------------------- /tests/apg/form/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Form Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-10-24_152221/form.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_form 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/form.html 8 | form,https://w3c.github.io/aria/#form 9 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby -------------------------------------------------------------------------------- /tests/apg/menu-button-actions/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | openMenuAndSetFocusToFirstItem,"opens the menu, and sets focus on 'Action 1'" 3 | openMenuAndSetFocusToLastItem,"opens the menu, and sets focus on 'Action 4'" 4 | setFocusAfterMenuButton,sets focus on a link after the menu button 5 | setFocusBeforeMenuButton,sets focus on a link before the menu button 6 | setFocusOnMenuButton,sets focus on the menu button 7 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddressAddedDialogAndFocusOKButton.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' dialog followed by the 'Address Added' dialog, and sets focus on the 'your profile' link inside the second dialog 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_add'); 4 | testPageDocument.defaultView.replaceDialog('dialog3', btn, 'dialog3_close_btn'); 5 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAndExpandComboboxAndSetValueToA.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the combobox, and sets the combobox value to 'a' 2 | testPageDocument.defaultView.comboboxController.setValue('a'); 3 | testPageDocument.defaultView.comboboxController.open(); 4 | testPageDocument.defaultView.comboboxController.comboboxNode.select(); 5 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,ctrl+opt+right,,,3 3 | navForwardsToLink,tab,,,3.1 4 | navForwardsToLink,l ,singleQuickKeyNavOn,,3.2 5 | navBackToLink,ctrl+opt+left,,,6 6 | navBackToLink,shift+tab,,,6.1 7 | navBackToLink,shift+l,singleQuickKeyNavOn,,6.2 8 | reqInfoAboutLink,ctrl+opt+f3,,,9 9 | reqInfoAboutLink,ctrl+opt+f4,,,9.1 10 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/expandThirdDisclosureHideDropdownAndMoveFocusAfterDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets the state of the third disclosure button to expanded, hides the associated dropdown and sets focus on the link after the disclosure 2 | testPageDocument.defaultView.disclosureController.toggleExpand(2, true); 3 | testPageDocument.getElementById('id_academics_menu').style.display = 'none'; 4 | testPageDocument.getElementById('afterlink').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('tabindex', '0'); 10 | radios[0].focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[1].classList.add('focus'); 9 | radios[1].setAttribute('tabindex', '0'); 10 | radios[1].focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnThirdRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the third radio button 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[2].classList.add('focus'); 9 | radios[2].setAttribute('tabindex', '0'); 10 | radios[2].focus(); 11 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameOfInput,1,"Name of the text input, 'Imaginary Word', is conveyed","convey name of the text input, 'Imaginary Word'",inputTypeText 3 | roleTextbox,1,Role 'textbox' is conveyed,convey role 'textbox',inputTypeText 4 | stateRequired,1,"State of the input, 'required', is conveyed","convey state of the input, 'required'",aria-required 5 | -------------------------------------------------------------------------------- /tests/apg/breadcrumb/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | authorEmail,isa.delcastillo5@gmail.com 4 | title,Breadcrumb Example 5 | reference,reference/2022-8-2_132648/index.html 6 | designPattern,https://w3c.github.io/aria-practices/#breadcrumb 7 | example,https://w3c.github.io/aria-practices/examples/breadcrumb/index.html 8 | aria-label,https://w3c.github.io/aria/#aria-label 9 | aria-current,https://w3c.github.io/aria/#aria-current -------------------------------------------------------------------------------- /tests/apg/menu-button-actions-active-descendant/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | openMenuAndSetFocusToFirstItem,"opens the menu, and sets focus on 'Action 1'" 3 | openMenuAndSetFocusToLastItem,"opens the menu, and sets focus on 'Action 4'" 4 | setFocusAfterMenuButton,sets focus on a link after the menu button 5 | setFocusBeforeMenuButton,sets focus on a link before the menu button 6 | setFocusOnMenuButton,sets focus on the menu button 7 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openAddressAddedDialogAndFocusAddressAddedHeading.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' dialog followed by the 'Address Added' dialog, and sets focus on the 'Address added' heading inside the second dialog 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_add'); 4 | testPageDocument.defaultView.replaceDialog('dialog3', undefined, 'dialog3_label'); 5 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/js/openVerificationResultDialogAndFocusCloseButton.js: -------------------------------------------------------------------------------- 1 | // opens the 'Add Delivery Address' dialog followed by the 'Verification Result' dialog, and sets focus on the 'Close' button inside the second dialog 2 | const btn = testPageDocument.querySelector('#ex1 > button'); 3 | testPageDocument.defaultView.openDialog('dialog1', btn, 'dialog1_add'); 4 | testPageDocument.defaultView.openDialog('dialog2', 'dialog1_verify', 'dialog2_close_btn'); 5 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAndExpandComboboxAndSetValueToAlabama.js: -------------------------------------------------------------------------------- 1 | // sets focus on and expands the combobox, and sets the combobox value to 'Alabama' 2 | testPageDocument.defaultView.comboboxController.setValue('Alabama'); 3 | testPageDocument.defaultView.comboboxController.open(); 4 | testPageDocument.defaultView.comboboxController.comboboxNode.select(); 5 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 6 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusAfterAndExpandFourthDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets the state of the fourth disclosure button to expanded, and sets focus on a link after the button 2 | const btn = testPageDocument.querySelector('button[aria-controls="faq4_desc"]'); 3 | const answer = testPageDocument.querySelector('#faq4_desc'); 4 | btn.setAttribute('aria-expanded', 'true'); 5 | answer.style.display = 'block'; 6 | testPageDocument.querySelector('#afterlink').focus(); 7 | -------------------------------------------------------------------------------- /tests/apg/menu-button-navigation/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | openMenuAndSetFocusToFirstItem,"opens the menu, and sets focus on 'W3C Home Page'" 3 | openMenuAndSetFocusToLastItem,"opens the menu, and sets focus on 'Accessible Name and Description'" 4 | setFocusAfterMenuButton,sets focus on a link after the menu button 5 | setFocusBeforeMenuButton,sets focus on a link before the menu button 6 | setFocusOnMenuButton,sets focus on the menu button 7 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusBeforeAndExpandFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on a link before the first disclosure button, and sets the state of the first button to expanded 2 | const btn = testPageDocument.querySelector('button[aria-controls="faq1_desc"]'); 3 | const answer = testPageDocument.querySelector('#faq1_desc'); 4 | btn.setAttribute('aria-expanded', 'true'); 5 | answer.style.display = 'block'; 6 | testPageDocument.querySelector('#beforelink').focus(); 7 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/expandFirstDisclosureHideDropdownAndMoveFocusToSecondDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first disclosure button to expanded, hides the associated dropdown and sets focus on the second disclosure 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.getElementById('id_about_menu').style.display = 'none'; 4 | testPageDocument.querySelector('button[aria-controls="id_admissions_menu"]').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/js/setFocusOnNameInputField.js: -------------------------------------------------------------------------------- 1 | // sets focus on the 'Name' input field in the 'Personal Information' region 2 | 3 | (() => { 4 | const nameInput = document.querySelector('#cufc1'); 5 | 6 | if (nameInput) { 7 | // Ensure the 'Personal Information' section is expanded (it is by default) 8 | 9 | nameInput.focus(); 10 | } else { 11 | console.error("SetupScript Error: 'Name' input field with ID #cufc1 not found."); 12 | } 13 | })(); 14 | -------------------------------------------------------------------------------- /tests/apg/minimal-data-grid/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | authorEmail,isa.delcastillo5@gmail.com 4 | title,Data Grid Example 1: Minimal Data Grid 5 | reference,reference/2021-3-8_151542/dataGrids.html 6 | designPattern,https://w3c.github.io/aria-practices/#grid 7 | example,https://w3c.github.io/aria-practices/examples/grid/dataGrids.html 8 | grid,https://w3c.github.io/aria/#grid 9 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby 10 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAlabamaInListbox.js: -------------------------------------------------------------------------------- 1 | // expands the Combobox and places focus on 'Alabama' in the listbox popup 2 | testPageDocument.defaultView.comboboxController.open(); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 4 | testPageDocument.defaultView.comboboxController.setVisualFocusListbox(); 5 | let opt = testPageDocument.querySelector('#lb1-al'); 6 | testPageDocument.defaultView.comboboxController.setOption(opt, true); 7 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/js/moveFocusToAndExpandFirstDisclosureAndSetCurrentPage.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first disclosure button, sets its state to expanded, and marks the first link in the associated dropdown as being the current page 2 | testPageDocument.defaultView.disclosureController.toggleExpand(0, true); 3 | testPageDocument.querySelector('#id_about_menu a').setAttribute('aria-current', 'page'); 4 | testPageDocument.querySelector('button[aria-controls="id_about_menu"]').focus(); 5 | -------------------------------------------------------------------------------- /tests/apg/alert/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Alert Example, 5 | reference,metadata,reference/2022-4-8_144013/alert.html,Test Case Page for Alert Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/alert/,APG Pattern: Alert 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/alert/examples/alert/,APG Example: Alert 8 | alert,aria,alert,alert 9 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Matt King, 3 | authorEmail,metadata,a11ythinker@gmail.com, 4 | title,metadata,aria-required on a Text Input, 5 | reference,metadata,reference/2025-11-5/aria-required-text-input.html,Test Case Page for aria-required on text input Example 6 | designPattern,metadata,, 7 | example,metadata,, 8 | aria-required,aria,aria-required,aria-required 9 | inputTypeText,htmlAam,inputTypeText,inputTypeText 10 | -------------------------------------------------------------------------------- /tests/apg/quantity-spin-button/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterAdultsSpinbutton,sets focus on a link after the Adults spin button 3 | setFocusBeforeAdultsSpinbutton,sets focus on a link before the Adults spin button 4 | setFocusOnAdultsSpinbutton,sets focus on the 'Adults' spin button 5 | setFocusOnAdultsSpinbuttonValue2,sets focus on the 'Adults' spin button and sets value to' 2' 6 | setFocusOnAdultsSpinbuttonValue9,sets focus on the 'Adults' spin button and sets value to' 9' 7 | -------------------------------------------------------------------------------- /.github/workflows/ensure-build-directory-is-absent.yml: -------------------------------------------------------------------------------- 1 | name: Ensure that the "build" directory is absent 2 | 3 | on: 4 | pull_request: 5 | 6 | jobs: 7 | ensure-build-directory-is-absent: 8 | runs-on: ubuntu-latest 9 | 10 | steps: 11 | - uses: actions/checkout@v5 12 | with: 13 | ref: refs/pull/${{ github.event.pull_request.number }}/head 14 | fetch-depth: 0 15 | 16 | - name: Verify that the "build" directory is absent 17 | run: '[ ! -d build ]' 18 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radioGroup.setAttribute('aria-activedescendant', radios[0].id); 10 | radioGroup.focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnThirdRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the third radio button 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[2].classList.add('focus'); 9 | radioGroup.setAttribute('aria-activedescendant', radios[2].id); 10 | radioGroup.focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[1].classList.add('focus'); 9 | radioGroup.setAttribute('aria-activedescendant', radios[1].id); 10 | radioGroup.focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAlaskaInListbox.js: -------------------------------------------------------------------------------- 1 | // expands the combobox, sets the combobox value to 'Alaska' and places focus on that option in the listbox popup 2 | testPageDocument.defaultView.comboboxController.open(); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 4 | testPageDocument.defaultView.comboboxController.setVisualFocusListbox(); 5 | let opt = testPageDocument.querySelector('#lb1-ak'); 6 | testPageDocument.defaultView.comboboxController.setOption(opt, true); 7 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusToAndExpandFirstDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first disclosure button, and sets its state to expanded 2 | const btn = testPageDocument.querySelector('button[aria-controls="faq1_desc"]'); 3 | const answer = testPageDocument.querySelector('#faq1_desc'); 4 | btn.setAttribute('aria-expanded', 'true'); 5 | answer.style.display = 'block'; 6 | // Hide the link after the button so it doesn't get in the way 7 | testPageDocument.querySelector('#afterlink').style.display = 'none'; 8 | btn.focus(); 9 | -------------------------------------------------------------------------------- /scripts/test-reviewer/getReferenceForDirectory.mjs: -------------------------------------------------------------------------------- 1 | /** 2 | * Get parsed values from tests//data/references.csv 3 | * 4 | * @param {AriaATCSV.Reference[]} references 5 | * @param {string} refId 6 | * @returns {{linkText: string, type: string, value: string}} 7 | */ 8 | const getReferenceForDirectory = (references, refId) => { 9 | const { type, value, linkText } = references.find(el => el.refId === refId) || {}; 10 | return { type, value, linkText }; 11 | }; 12 | 13 | export default getReferenceForDirectory; 14 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Command Button Example, 5 | reference,metadata,reference/2022-4-8_124112/button.html,Test Case Page for Command Button Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/,APG Pattern: Button 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/examples/button/,APG Example: Button 8 | button,aria,button,button 9 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/js/moveFocusToAndExpandFourthDisclosure.js: -------------------------------------------------------------------------------- 1 | // sets focus on the fourth disclosure button, and sets its state to expanded 2 | const btn = testPageDocument.querySelector('button[aria-controls="faq4_desc"]'); 3 | const answer = testPageDocument.querySelector('#faq1_desc'); 4 | btn.setAttribute('aria-expanded', 'true'); 5 | answer.style.display = 'block'; 6 | // Hide the link after the button so it doesn't get in the way 7 | testPageDocument.querySelector('#afterlink').style.display = 'none'; 8 | btn.focus(); 9 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and sets its state to checked 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('tabindex', '0'); 10 | radios[0].setAttribute('aria-checked', 'true'); 11 | radios[0].focus(); 12 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: 'npm' 4 | open-pull-requests-limit: 99 5 | directory: '/' 6 | schedule: 7 | interval: 'monthly' 8 | groups: 9 | dependencies: 10 | applies-to: version-updates 11 | patterns: 12 | - '*' 13 | update-types: 14 | - 'minor' 15 | - 'patch' 16 | - package-ecosystem: 'github-actions' 17 | open-pull-requests-limit: 99 18 | directory: '/' 19 | schedule: 20 | interval: 'daily' 21 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Command Button Example, 5 | reference,metadata,reference/2022-4-8_124112/button.html,Test Case Page for Command Button Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/,APG Pattern: Button 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/examples/button/,APG Example: Button 8 | button,aria,button,button 9 | -------------------------------------------------------------------------------- /tests/apg/checkbox-tri-state/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | authorEmail,isa.delcastillo5@gmail.com 4 | title,Checkbox Example (Mixed-State) 5 | reference,reference/2022-9-9_104148/checkbox-mixed.html 6 | designPattern,https://w3c.github.io/aria-practices/#checkbox 7 | example,https://w3c.github.io/aria-practices/examples/checkbox/checkbox-mixed.html 8 | checkbox,https://w3c.github.io/aria/#checkbox 9 | aria-controls,https://w3c.github.io/aria/#aria-controls 10 | aria-checked,https://w3c.github.io/aria/#aria-checked 11 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,ctrl+opt+right,,,5 3 | navForwardsToButton,b,singleQuickKeyNavOn,,5.3 4 | navForwardsToButton,tab,,,5.1 5 | navForwardsToButton,j ,singleQuickKeyNavOn,,5.2 6 | navBackToButton,ctrl+opt+left,,,6 7 | navBackToButton,shift+b,singleQuickKeyNavOn,,6.3 8 | navBackToButton,shift+tab,,,6.1 9 | navBackToButton,shift+j,singleQuickKeyNavOn,,6.2 10 | reqInfoAboutButton,ctrl+opt+f3,,,9 11 | reqInfoAboutButton,ctrl+opt+f4,,,9.1 12 | -------------------------------------------------------------------------------- /tests/apg/link-css/reference/2023-3-13_142620/js/link.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | */ 5 | 6 | /* exported goToLink */ 7 | 8 | 'use strict'; 9 | 10 | function goToLink(event, url) { 11 | var type = event.type; 12 | 13 | if (type === 'click' || (type === 'keydown' && event.keyCode === 13)) { 14 | window.location.href = url; 15 | 16 | event.preventDefault(); 17 | event.stopPropagation(); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | title,metadata,Link Example 1 (span element with text content), 4 | authorEmail,metadata,isa.delcastillo5@gmail.com, 5 | reference,metadata,reference/2022-4-6_14258/link.html,Test Case Page for Link Example 1 (span element with text content) 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/,APG Pattern: Link 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/examples/link/,APG Example: Link 8 | link,aria,link,link 9 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and checks the second radio button 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('tabindex', '0'); 10 | radios[1].setAttribute('aria-checked', 'true'); 11 | radios[0].focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button, and checks the first radio button 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[1].classList.add('focus'); 9 | radios[1].setAttribute('tabindex', '0'); 10 | radios[0].setAttribute('aria-checked', 'true'); 11 | radios[1].focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/reference/2023-3-13_11377/js/link.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | */ 5 | 6 | /* exported goToLink */ 7 | 8 | 'use strict'; 9 | 10 | function goToLink(event, url) { 11 | var type = event.type; 12 | 13 | if (type === 'click' || (type === 'keydown' && event.keyCode === 13)) { 14 | window.location.href = url; 15 | 16 | event.preventDefault(); 17 | event.stopPropagation(); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/reference/2022-4-6_14258/js/link.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | */ 5 | 6 | /* exported goToLink */ 7 | 8 | 'use strict'; 9 | 10 | function goToLink(event, url) { 11 | var type = event.type; 12 | 13 | if (type === 'click' || (type === 'keydown' && event.keyCode === 13)) { 14 | window.location.href = url; 15 | 16 | event.preventDefault(); 17 | event.stopPropagation(); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /tests/apg/switch/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Switch Example, 5 | reference,metadata,reference/2022-8-1_103716/switch.html,Test Case Page for Switch Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/,APG Pattern: Switch 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/examples/switch/,APG Example: Switch 8 | aria-checked,aria,aria-checked,aria-checked 9 | switch,aria,switch,switch 10 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | title,metadata,Link Example 2 (img element with alt attribute), 4 | authorEmail,metadata,isa.delcastillo5@gmail.com, 5 | reference,metadata,reference/2023-3-13_11377/link-img-alt.html,Test Case Page for Link Example 2 (img element with alt attribute) 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/,APG Design Pattern 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/examples/link/,APG Link Examples 8 | link,aria,link,link 9 | -------------------------------------------------------------------------------- /tests/apg/switch/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterAndTurnOnSwitch,"sets focus on a link after the switch, and sets the switch state to 'on'" 3 | setFocusAfterSwitch,sets focus on a link after the switch 4 | setFocusBeforeAndTurnOnSwitch,"sets focus on a link before the switch, and sets the state of the switch to 'on'" 5 | setFocusBeforeSwitch,sets focus on a link before the switch 6 | setFocusOnAndTurnOnSwitch,"sets focus on the 'Notifications' switch, and sets its state to 'on'" 7 | setFocusOnSwitch,sets focus on the 'Notifications' switch 8 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Toggle Button, 5 | reference,metadata,reference/2022-4-8_135651/button.html,Test Case Page for Toggle Button 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/,APG Pattern: Button 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/button/examples/button/,APG Example: Button 8 | button,htmlAam,button,button 9 | aria-pressed,aria,aria-pressed,aria-pressed 10 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterAndTurnOnSwitch,"sets focus on a link after the switch, and sets the switch state to 'on'" 3 | setFocusAfterSwitch,sets focus on a link after the switch 4 | setFocusBeforeAndTurnOnSwitch,"sets focus on a link before the switch, and sets the state of the switch to 'on'" 5 | setFocusBeforeSwitch,sets focus on a link before the switch 6 | setFocusOnAndTurnOnSwitch,"sets focus on the 'Notifications' switch, and sets its state to 'on'" 7 | setFocusOnSwitch,sets focus on the 'Notifications' switch 8 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/voiceover_macos-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,ctrl+opt+right,,,5 3 | navForwardsToButton,b,singleQuickKeyNavOn,,5.3 4 | navForwardsToButton,tab,,,5.1 5 | navForwardsToButton,j ,singleQuickKeyNavOn,,5.2 6 | navBackToButton,ctrl+opt+left,,,6 7 | navBackToButton,shift+b,singleQuickKeyNavOn,,6.3 8 | navBackToButton,shift+tab,,,6.1 9 | navBackToButton,shift+j,singleQuickKeyNavOn,,6.2 10 | reqInfoAboutButton,ctrl+opt+f3,,,9 11 | reqInfoAboutButton,ctrl+opt+f4,,,9.1 12 | -------------------------------------------------------------------------------- /tests/apg/banner/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Banner Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-10-24_135455/banner.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_banner 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/banner.html 8 | banner,https://w3c.github.io/aria/#banner 9 | aria-haspopup,https://w3c.github.io/aria/#aria-haspopup 10 | aria-describedby,https://w3c.github.io/aria/#aria-describedby 11 | aria-expanded,https://w3c.github.io/aria/#aria-expanded -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/checkFirstRadioButtonAndSetFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first radio button to checked, and sets focus on a link after the radio group 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].setAttribute('tabindex', '0'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | testPageDocument.querySelector('#afterlink').focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first radio button to checked, and sets focus on a link before the radio group 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].setAttribute('tabindex', '0'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | testPageDocument.querySelector('#beforelink').focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/js/checkThirdRadioButtonAndSetFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the third radio button to checked, and sets focus on a link after the radio group 2 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 3 | radios.forEach(r => { 4 | r.setAttribute('tabindex', '-1'); 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[2].setAttribute('tabindex', '0'); 9 | radios[2].setAttribute('aria-checked', 'true'); 10 | testPageDocument.querySelector('#afterlink').focus(); 11 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterAndTurnOnSwitch,"sets focus on a link after the switch, and sets the switch state to 'on'" 3 | setFocusAfterSwitch,sets focus on a link after the switch 4 | setFocusBeforeAndTurnOnSwitch,"sets focus on a link before the switch, and sets the state of the switch to 'on'" 5 | setFocusBeforeSwitch,sets focus on a link before the switch 6 | setFocusOnAndTurnOnSwitch,"sets focus on the 'Notifications' switch, and sets its state to 'on'" 7 | setFocusOnSwitch,sets focus on the 'Notifications' switch 8 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/banner/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Banner Landmark 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-10-24_135455/banner.html 6 | designPattern,https://w3c.github.io/aria-practices/#aria_lh_banner 7 | example,https://w3c.github.io/aria-practices/examples/landmarks/banner.html 8 | banner,https://w3c.github.io/aria/#banner 9 | aria-haspopup,https://w3c.github.io/aria/#aria-haspopup 10 | aria-describedby,https://w3c.github.io/aria/#aria-describedby 11 | aria-expanded,https://w3c.github.io/aria/#aria-expanded -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterButton,sets focus on a link after the button 3 | setFocusAfterButtonAndSetStateToPressed,"sets focus on a link after the button, and sets the state of the button to 'pressed'" 4 | setFocusBeforeButton,sets focus on a link before the button 5 | setFocusBeforeButtonAndSetStateToPressed,"sets focus on a link before the button, and sets the state of the button to 'pressed'" 6 | setFocusOnButton,sets focus on the button 7 | setFocusOnButtonAndSetStateToPressed,"sets focus on the button, and sets its state to 'pressed'" 8 | -------------------------------------------------------------------------------- /.github/workflows/update-pr.yml: -------------------------------------------------------------------------------- 1 | name: 'Update Pull Request with Preview Link' 2 | 3 | on: pull_request_target 4 | 5 | jobs: 6 | update_pr: 7 | runs-on: ubuntu-latest 8 | steps: 9 | - uses: tzkhan/pr-update-action@v2 10 | with: 11 | repo-token: '${{ secrets.GITHUB_TOKEN }}' 12 | head-branch-regex: '.*' 13 | title-template: '' 14 | body-template: '[Preview Tests](https://deploy-preview-${{ github.event.pull_request.number }}--aria-at.netlify.app)' 15 | body-update-action: prefix 16 | body-uppercase-head-match: false 17 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterAndCheckCheckCheckbox,"sets focus on a link after the checkbox, and sets the checkbox state to 'checked'" 3 | setFocusAfterCheckbox,sets focus on a link after the checkbox 4 | setFocusBeforeAndCheckCheckbox,"sets focus on a link before the checkbox, and sets the state of the checkbox to 'checked'" 5 | setFocusBeforeCheckbox,sets focus on a link before the checkbox 6 | setFocusOnAndCheckCheckbox,"sets focus on the 'Lettuce' checkbox, and sets its state to 'checked'" 7 | setFocusOnCheckbox,sets focus on the 'Lettuce' checkbox 8 | -------------------------------------------------------------------------------- /tests/apg/meter/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Meter 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2022-8-2_11826/meter.html 6 | designPattern,https://w3c.github.io/aria-practices/#meter 7 | example,https://w3c.github.io/aria-practices/examples/meter/meter.html 8 | meter,https://w3c.github.io/aria/#meter 9 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby 10 | aria-valuenow,https://w3c.github.io/aria/#aria-valuenow 11 | aria-valuemin,https://w3c.github.io/aria/#aria-valuemin 12 | aria-valuemax,https://w3c.github.io/aria/#aria-valuemax -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and sets its state to checked 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[0].id); 11 | radioGroup.focus(); 12 | -------------------------------------------------------------------------------- /.github/workflows/test.yml: -------------------------------------------------------------------------------- 1 | name: Run tests 2 | 3 | on: 4 | pull_request: 5 | 6 | jobs: 7 | test: 8 | runs-on: ubuntu-latest 9 | 10 | steps: 11 | - uses: actions/checkout@v5 12 | with: 13 | ref: refs/pull/${{ github.event.pull_request.number }}/head 14 | fetch-depth: 0 15 | 16 | - name: Use Node.js 17 | uses: actions/setup-node@v5 18 | with: 19 | node-version: '20.x' 20 | cache: 'npm' 21 | 22 | - name: Install dependencies 23 | run: npm ci 24 | 25 | - name: Run npm test 26 | run: npm test 27 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Alert Example, 5 | reference,metadata,reference/2022-4-8_144013/alert.html,Test Case Page for Alert Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/alert/,APG Pattern: Alert 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/alert/examples/alert/,APG Example: Alert 8 | alert,aria,alert,alert 9 | aria-live,aria,aria-live,aria-live 10 | aria-atomic,aria,aria-atomic,aria-atomic 11 | -------------------------------------------------------------------------------- /tests/apg/switch/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameNotifications,1,Name 'Notifications' is conveyed,convey name 'Notifications',switch 3 | roleSwitch,1,Role 'switch' is conveyed,convey role 'switch',switch 4 | stateChangeToOff,1,"Change in state, to 'off', is conveyed","convey change in state, to 'off'",aria-checked 5 | stateChangeToOn,1,"Change in state, to 'on', is conveyed","convey change in state, to 'on'",aria-checked 6 | stateOff,1,State 'off' is conveyed,convey state 'off',aria-checked 7 | stateOn,1,State 'on' is conveyed,convey state 'on',aria-checked 8 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnFirstRadioButtonAndCheckSecondRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the first radio button, and checks the second radio button 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[1].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[0].id); 11 | radioGroup.focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/setFocusOnSecondRadioButtonAndCheckFirstRadioButton.js: -------------------------------------------------------------------------------- 1 | // sets focus on the second radio button, and checks the first radio button 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[1].classList.add('focus'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[1].id); 11 | radioGroup.focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | navForwardsToLink,Navigate forwards to a link,3,setFocusBeforeLink,"With focus on the 'Navigate forwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 3 | navBackToLink,Navigate backwards to a link,6,setFocusAfterLink,"With focus on the 'Navigate backwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 4 | reqInfoAboutLink,Request information about a link,9,setFocusOnLink,"With focus on the 'W3C website' link, read information about the link.",roleLink nameW3cWebsite 5 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | navForwardsToLink,Navigate forwards to a link,3,setFocusBeforeLink,"With focus on the 'Navigate forwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 3 | navBackToLink,Navigate backwards to a link,6,setFocusAfterLink,"With focus on the 'Navigate backwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 4 | reqInfoAboutLink,Request information about a link,9,setFocusOnLink,"With focus on the 'W3C website' link, read information about the link.",roleLink nameW3cWebsite 5 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | navForwardsToLink,Navigate forwards to a link,3,setFocusBeforeLink,"Starting at the 'Navigate forwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 3 | navBackToLink,Navigate backwards to a link,6,setFocusAfterLink,"Starting at the 'Navigate backwards from here' link, navigate to the 'W3C website' link.",roleLink nameW3cWebsite 4 | reqInfoAboutLink,Request information about a link,9,setFocusOnLink,"Starting at the 'W3C website' link, read information about the link.",roleLink nameW3cWebsite 5 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,virtualCursor,,1.0 3 | navForwardsToLink,tab,virtualCursor,,1.1 4 | navForwardsToLink,down,virtualCursor,,1.2 5 | navForwardsToLink,tab,pcCursor,,2.0 6 | navBackToLink,shift+u,virtualCursor,,4.0 7 | navBackToLink,up,virtualCursor,,4.1 8 | navBackToLink,shift+tab,virtualCursor,,4.2 9 | navBackToLink,shift+tab,pcCursor,,5.0 10 | reqInfoAboutLink,ins+tab,virtualCursor,,7.0 11 | reqInfoAboutLink,ins+up,virtualCursor,,7.1 12 | reqInfoAboutLink,ins+tab,pcCursor,,8.0 13 | reqInfoAboutLink,ins+up,pcCursor,,8.1 14 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameLivingRoomLights,1,Name 'Living Room Lights' is conveyed,convey name 'Living Room Lights',switch 3 | roleSwitch,1,Role 'switch' is conveyed,convey role 'switch',switch button 4 | stateChangeToOff,1,"Change in state, to 'off', is conveyed","convey change in state, to 'off'",aria-checked 5 | stateChangeToOn,1,"Change in state, to 'on', is conveyed","convey change in state, to 'on'",aria-checked 6 | stateOff,1,State 'off' is conveyed,convey state 'off',aria-checked 7 | stateOn,1,State 'on' is conveyed,convey state 'on',aria-checked 8 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arow.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/min-arrow.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,virtualCursor,,1.0 3 | navForwardsToLink,tab,virtualCursor,,1.1 4 | navForwardsToLink,down,virtualCursor,,1.2 5 | navForwardsToLink,tab,pcCursor,,2.0 6 | navBackToLink,shift+u,virtualCursor,,4.0 7 | navBackToLink,up,virtualCursor,,4.1 8 | navBackToLink,shift+tab,virtualCursor,,4.2 9 | navBackToLink,shift+tab,pcCursor,,5.0 10 | reqInfoAboutLink,ins+tab,virtualCursor,,7.0 11 | reqInfoAboutLink,ins+up,virtualCursor,,7.1 12 | reqInfoAboutLink,ins+tab,pcCursor,,8.0 13 | reqInfoAboutLink,ins+up,pcCursor,,8.1 14 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,virtualCursor,,1.0 3 | navForwardsToLink,tab,virtualCursor,,1.1 4 | navForwardsToLink,down,virtualCursor,,1.2 5 | navForwardsToLink,tab,pcCursor,,2.0 6 | navBackToLink,shift+u,virtualCursor,,4.0 7 | navBackToLink,up,virtualCursor,,4.1 8 | navBackToLink,shift+tab,virtualCursor,,4.2 9 | navBackToLink,shift+tab,pcCursor,,5.0 10 | reqInfoAboutLink,ins+tab,virtualCursor,,7.0 11 | reqInfoAboutLink,ins+up,virtualCursor,,7.1 12 | reqInfoAboutLink,ins+tab,pcCursor,,8.0 13 | reqInfoAboutLink,ins+up,pcCursor,,8.1 14 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Link Example 3 (CSS :before content property on a span element), 5 | reference,metadata,reference/2023-3-13_142620/link-css.html,Test Case Page for Link Example 3 (CSS :before content property on a span element) 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/,APG Design Pattern 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/link/examples/link/,APG Link Examples 8 | aria-label,aria,aria-label,aria-label 9 | link,aria,link,link 10 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameReducedMotion,1,Name 'Reduced motion ' is conveyed,convey name 'Reduced motion',inputTypeCheckbox label 3 | roleSwitch,1,Role 'switch' is conveyed,convey role 'switch',switch inputTypeCheckbox 4 | stateChangeToOff,1,"Change in state, to 'off', is conveyed","convey change in state, to 'off'",@checked 5 | stateChangeToOn,1,"Change in state, to 'on', is conveyed","convey change in state, to 'on'",@checked 6 | stateOff,1,State 'off' is conveyed,convey state 'off',@checked 7 | stateOn,1,State 'on' is conveyed,convey state 'on',@checked 8 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | setFocusAfterRequiredElement,sets focus on a link after the required text input 3 | setFocusAfterNotRequiredElement,sets aria-required to false and then focuses a link after the required text input 4 | setFocusBeforeRequiredElement,sets focus on a link before the required text input 5 | setFocusBeforeNotRequiredElement,sets aria-required to false and then focuses a link before the required text input 6 | setFocusOnRequiredElement,sets focus on the required text input 7 | setFocusOnNotRequiredElement,sets aria-required to false and then focuses the text input 8 | -------------------------------------------------------------------------------- /tests/apg/vertical-temperature-slider/reference/2025-7-15_112752/images/max-arrow.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | navForwardsToButton,Navigate forwards to a button,5,setFocusBeforeButton,"Starting at the 'Navigate forwards from here' link, navigate to the 'Print Page' button.",roleButton namePrintPage 3 | navBackToButton,Navigate backwards to a button,6,setFocusAfterButton,"Starting at the 'Navigate backwards from here' link, navigate to the 'Print Page' button.",roleButton namePrintPage 4 | reqInfoAboutButton,Request information about a button,9,setFocusOnButton,"Starting at the 'Print Page' button, read information about the button.",roleButton namePrintPage 5 | -------------------------------------------------------------------------------- /tests/apg/switch-button/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Switch Example Using HTML Button, 5 | reference,metadata,reference/2025-8-22_17848/switch-button.html,Test Case Page for Switch Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/,APG Pattern: Switch 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/examples/switch-button/,APG Example: Switch Using HTML Button 8 | aria-checked,aria,aria-checked,aria-checked 9 | switch,aria,switch,switch 10 | button,htmlAam,button,button 11 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/tests.csv: -------------------------------------------------------------------------------- 1 | testId,title,presentationNumber,setupScript,instructions,assertions 2 | navForwardsToButton,Navigate forwards to a button,5,setFocusBeforeButton,"Starting at the 'Navigate forwards from here' link, navigate to the 'Print Page' button.",roleButton namePrintPage 3 | navBackToButton,Navigate backwards to a button,6,setFocusAfterButton,"Starting at the 'Navigate backwards from here' link, navigate to the 'Print Page' button.",roleButton namePrintPage 4 | reqInfoAboutButton,Request information about a button,9,setFocusOnButton,"Starting at the 'Print Page' button, read information about the button.",roleButton namePrintPage 5 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/checkFirstRadioButtonAndSetFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first radio button to checked, and sets focus on a link after the radio group 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[0].id); 11 | testPageDocument.querySelector('#afterlink').focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/checkThirdRadioButtonAndSetFocusAfterRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the third radio button to checked, and sets focus on a link after the radio group 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[2].classList.add('focus'); 9 | radios[2].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[2].id); 11 | testPageDocument.querySelector('#afterlink').focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/js/setFocusOnAndCollapseFirstAccordionHeader.js: -------------------------------------------------------------------------------- 1 | // collapses and sets focus on the 'Personal Information' accordion header 2 | (() => { 3 | const header1Button = document.querySelector('#accordion1id'); 4 | const panel1 = document.querySelector('#sect1'); 5 | 6 | if (header1Button && panel1) { 7 | // Collapse the first accordion section 8 | header1Button.setAttribute('aria-expanded', 'false'); 9 | panel1.setAttribute('hidden', ''); // or panel1.hidden = true; 10 | 11 | header1Button.focus(); 12 | } else { 13 | console.error('SetupScript 2 Error: Accordion 1 elements not found (#accordion1id or #sect1)'); 14 | } 15 | })(); 16 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-aria-activedescendant/data/js/checkFirstRadioButtonAndSetFocusBeforeRadioGroup.js: -------------------------------------------------------------------------------- 1 | // sets the state of the first radio button to checked, and sets focus on a link before the radio group 2 | let radioGroup = testPageDocument.querySelector('[role="radiogroup"]'); 3 | let radios = testPageDocument.querySelectorAll('[role="radio"]'); 4 | radios.forEach(r => { 5 | r.setAttribute('aria-checked', 'false'); 6 | r.classList.remove('focus'); 7 | }); 8 | radios[0].classList.add('focus'); 9 | radios[0].setAttribute('aria-checked', 'true'); 10 | radioGroup.setAttribute('aria-activedescendant', radios[0].id); 11 | testPageDocument.querySelector('#beforelink').focus(); 12 | -------------------------------------------------------------------------------- /tests/apg/toggle-button/data/assertions.csv: -------------------------------------------------------------------------------- 1 | assertionId,priority,assertionStatement,assertionPhrase,refIds 2 | nameMute,1,Name 'Mute' is conveyed,convey name 'Mute',button 3 | roleToggleButton,1,Role 'toggle button' is conveyed,convey role 'toggle button',aria-pressed 4 | stateChangeToNotPressed,1,"Change in state, to 'not pressed', is conveyed","convey change in state, to 'not pressed'",aria-pressed 5 | stateChangeToPressed,1,"Change in state, to 'pressed', is conveyed","convey change in state, to 'pressed'",aria-pressed 6 | stateNotPressed,3,State 'not pressed' is conveyed,convey state 'not pressed',aria-pressed 7 | statePressed,1,State 'pressed' is conveyed,convey state 'pressed',aria-pressed 8 | -------------------------------------------------------------------------------- /tests/apg/link-css/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,browseMode,,1.0 3 | navForwardsToLink,k,browseMode,,1.1 4 | navForwardsToLink,tab,browseMode,,1.2 5 | navForwardsToLink,down,browseMode,,1.3 6 | navForwardsToLink,tab,focusMode,,2.0 7 | navBackToLink,shift+u,browseMode,,4.0 8 | navBackToLink,shift+k,browseMode,,4.1 9 | navBackToLink,up,browseMode,,4.2 10 | navBackToLink,shift+tab,browseMode,,4.3 11 | navBackToLink,shift+tab,focusMode,,5.0 12 | reqInfoAboutLink,ins+tab,browseMode,,7.0 13 | reqInfoAboutLink,ins+up,browseMode,,7.1 14 | reqInfoAboutLink,ins+tab,focusMode,,8.0 15 | reqInfoAboutLink,ins+up,focusMode,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/link-img-alt/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,browseMode,,1.0 3 | navForwardsToLink,k,browseMode,,1.1 4 | navForwardsToLink,tab,browseMode,,1.2 5 | navForwardsToLink,down,browseMode,,1.3 6 | navForwardsToLink,tab,focusMode,,2.0 7 | navBackToLink,shift+u,browseMode,,4.0 8 | navBackToLink,shift+k,browseMode,,4.1 9 | navBackToLink,up,browseMode,,4.2 10 | navBackToLink,shift+tab,browseMode,,4.3 11 | navBackToLink,shift+tab,focusMode,,5.0 12 | reqInfoAboutLink,ins+tab,browseMode,,7.0 13 | reqInfoAboutLink,ins+up,browseMode,,7.1 14 | reqInfoAboutLink,ins+tab,focusMode,,8.0 15 | reqInfoAboutLink,ins+up,focusMode,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/modal-dialog/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,James Scholes, 3 | authorEmail,metadata,james@pac.bz, 4 | title,metadata,Modal Dialog Example, 5 | reference,metadata,reference/2022-4-7_15544/dialog.html,Test Case Page for Modal Dialog Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/,APG Pattern: Dialog (Modal) 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/,APG Example: Modal Dialog 8 | dialog,aria,dialog,dialog 9 | aria-modal,aria,aria-modal,aria-modal 10 | aria-labelledby,aria,aria-labelledby,aria-labelledby 11 | aria-describedby,aria,aria-describedby,aria-describedby 12 | -------------------------------------------------------------------------------- /tests/apg/link-span-text/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToLink,u,browseMode,,1.0 3 | navForwardsToLink,k,browseMode,,1.1 4 | navForwardsToLink,tab,browseMode,,1.2 5 | navForwardsToLink,down,browseMode,,1.3 6 | navForwardsToLink,tab,focusMode,,2.0 7 | navBackToLink,shift+u,browseMode,,4.0 8 | navBackToLink,shift+k,browseMode,,4.1 9 | navBackToLink,up,browseMode,,4.2 10 | navBackToLink,shift+tab,browseMode,,4.3 11 | navBackToLink,shift+tab,focusMode,,5.0 12 | reqInfoAboutLink,ins+tab,browseMode,,7.0 13 | reqInfoAboutLink,ins+up,browseMode,,7.1 14 | reqInfoAboutLink,ins+tab,focusMode,,8.0 15 | reqInfoAboutLink,ins+up,focusMode,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAlabamaInListboxAndSetInputCursorAtBeginning.js: -------------------------------------------------------------------------------- 1 | // expands the combobox, sets the combobox value to 'Alabama', places focus on that option in the listbox popup and positions the editing cursor at the beginning of the textbox 2 | testPageDocument.defaultView.comboboxController.open(); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 4 | testPageDocument.defaultView.comboboxController.setVisualFocusListbox(); 5 | let opt = testPageDocument.querySelector('#lb1-al'); 6 | testPageDocument.defaultView.comboboxController.setOption(opt, true); 7 | testPageDocument.defaultView.comboboxController.comboboxNode.setSelectionRange(0, 0); 8 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,down,browseMode,,1.0 3 | navForwardsToButton,b,browseMode,,1.1 4 | navForwardsToButton,f,browseMode,,1.2 5 | navForwardsToButton,tab,browseMode,,1.3 6 | navBackToButton,up,browseMode,,2.0 7 | navBackToButton,shift+b,browseMode,,2.1 8 | navBackToButton,shift+f,browseMode,,2.2 9 | navBackToButton,shift+tab,browseMode,,2.3 10 | navForwardsToButton,tab,focusMode,,3.0 11 | navBackToButton,shift+tab,focusMode,,4.0 12 | reqInfoAboutButton,ins+tab,browseMode,,7.0 13 | reqInfoAboutButton,ins+up,browseMode,,7.1 14 | reqInfoAboutButton,ins+tab,focusMode,,8.0 15 | reqInfoAboutButton,ins+up,focusMode,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/switch-checkbox/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Switch Example Using HTML Checkbox Input, 5 | reference,metadata,reference/2025-8-25_124251/switch-checkbox.html,Test Case Page for Switch Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/,APG Pattern: Switch 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/switch/examples/switch-checkbox/,APG Example: Switch Using HTML Checkbox Input 8 | switch,aria,switch,switch 9 | inputTypeCheckbox,htmlAam,inputTypeCheckbox,inputTypeCheckbox 10 | label,htmlAam,label,HTML label 11 | @checked,htmlAam,@checked,@checked 12 | -------------------------------------------------------------------------------- /tests/apg/breadcrumb/reference/2022-8-2_132648/css/breadcrumb.css: -------------------------------------------------------------------------------- 1 | nav.breadcrumb { 2 | padding: 0.8em 1em; 3 | border: 1px solid hsl(0deg 0% 90%); 4 | border-radius: 4px; 5 | background: hsl(300deg 14% 97%); 6 | } 7 | 8 | nav.breadcrumb ol { 9 | margin: 0; 10 | padding-left: 0; 11 | list-style: none; 12 | } 13 | 14 | nav.breadcrumb li { 15 | display: inline; 16 | } 17 | 18 | nav.breadcrumb li + li::before { 19 | display: inline-block; 20 | margin: 0 0.25em; 21 | transform: rotate(15deg); 22 | border-right: 0.1em solid currentcolor; 23 | height: 0.8em; 24 | content: ""; 25 | } 26 | 27 | nav.breadcrumb [aria-current="page"] { 28 | color: #000; 29 | font-weight: 700; 30 | text-decoration: none; 31 | } 32 | -------------------------------------------------------------------------------- /tests/apg/checkbox/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Checkbox Example (Two State), 5 | reference,metadata,reference/2025-10-2_121011/checkbox.html,Test Case Page for Checkbox Example (Two State) 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/,APG Pattern: Checkbox 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/examples/checkbox/,APG Example: Checkbox Example (Two State) 8 | aria-checked,aria,aria-checked,aria-checked 9 | checkbox,aria,Checkbox,checkbox 10 | group,aria,group,group 11 | aria-labelledby,aria,aria-labelledby,aria-labelledby 12 | list,htmlAam,list,list 13 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/nvda-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,down,browseMode,,1.0 3 | navForwardsToButton,b,browseMode,,1.1 4 | navForwardsToButton,f,browseMode,,1.2 5 | navForwardsToButton,tab,browseMode,,1.3 6 | navBackToButton,up,browseMode,,2.0 7 | navBackToButton,shift+b,browseMode,,2.1 8 | navBackToButton,shift+f,browseMode,,2.2 9 | navBackToButton,shift+tab,browseMode,,2.3 10 | navForwardsToButton,tab,focusMode,,3.0 11 | navBackToButton,shift+tab,focusMode,,4.0 12 | reqInfoAboutButton,ins+tab,browseMode,,7.0 13 | reqInfoAboutButton,ins+up,browseMode,,7.1 14 | reqInfoAboutButton,ins+tab,focusMode,,8.0 15 | reqInfoAboutButton,ins+up,focusMode,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/command-button/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,down,virtualCursor,,1.0 3 | navForwardsToButton,b,virtualCursor,,1.1 4 | navForwardsToButton,f,virtualCursor,,1.2 5 | navForwardsToButton,tab,virtualCursor,,1.3 6 | navBackToButton,up,virtualCursor,,2.0 7 | navBackToButton,shift+b,virtualCursor,,2.1 8 | navBackToButton,shift+f,virtualCursor,,2.2 9 | navBackToButton,shift+tab,virtualCursor,,2.3 10 | navForwardsToButton,tab,pcCursor,,3.0 11 | navBackToButton,shift+tab,pcCursor,,4.0 12 | reqInfoAboutButton,ins+tab,virtualCursor,,7.0 13 | reqInfoAboutButton,ins+up,virtualCursor,,7.1 14 | reqInfoAboutButton,ins+tab,pcCursor,,8.0 15 | reqInfoAboutButton,ins+up,pcCursor,,8.1 16 | -------------------------------------------------------------------------------- /__test__/utils/index.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs'); 2 | const path = require('path'); 3 | 4 | /** 5 | * @param {string} directoryPath 6 | * @param {string[]} extensions - eg. ['.html', '.json'] 7 | * @returns {string[]} 8 | */ 9 | function getFiles(directoryPath, extensions = []) { 10 | const files = fs.readdirSync(directoryPath); 11 | 12 | // Return all files in directory 13 | if (!extensions.length) return files; 14 | 15 | // Return only files included in 'extensions' 16 | return files.filter(file => extensions.includes(path.extname(file).toLowerCase())); 17 | } 18 | 19 | function getFileContent(filePath) { 20 | return fs.readFileSync(filePath, 'utf-8'); 21 | } 22 | 23 | module.exports = { 24 | getFiles, 25 | getFileContent, 26 | }; 27 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/command-button/data/jaws-commands.csv: -------------------------------------------------------------------------------- 1 | testId,command,settings,assertionExceptions,presentationNumber 2 | navForwardsToButton,down,virtualCursor,,1.0 3 | navForwardsToButton,b,virtualCursor,,1.1 4 | navForwardsToButton,f,virtualCursor,,1.2 5 | navForwardsToButton,tab,virtualCursor,,1.3 6 | navBackToButton,up,virtualCursor,,2.0 7 | navBackToButton,shift+b,virtualCursor,,2.1 8 | navBackToButton,shift+f,virtualCursor,,2.2 9 | navBackToButton,shift+tab,virtualCursor,,2.3 10 | navForwardsToButton,tab,pcCursor,,3.0 11 | navBackToButton,shift+tab,pcCursor,,4.0 12 | reqInfoAboutButton,ins+tab,virtualCursor,,7.0 13 | reqInfoAboutButton,ins+up,virtualCursor,,7.1 14 | reqInfoAboutButton,ins+tab,pcCursor,,8.0 15 | reqInfoAboutButton,ins+up,pcCursor,,8.1 16 | -------------------------------------------------------------------------------- /tests/apg/combobox-select-only/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,James Scholes 3 | authorEmail,james@pac.bz 4 | title,Select Only Combobox Example 5 | reference,reference/combobox-select-only.html 6 | example,https://w3c.github.io/aria-practices/examples/combobox/combobox-select-only.html 7 | combobox,https://w3c.github.io/aria-practices/#combobox 8 | listbox,https://w3c.github.io/aria/#listbox 9 | option,https://w3c.github.io/aria/#option 10 | aria-activedescendant,https://w3c.github.io/aria/#aria-activedescendant 11 | aria-controls,https://w3c.github.io/aria/#aria-controls 12 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby 13 | aria-expanded,https://w3c.github.io/aria/#aria-expanded 14 | aria-selected,https://w3c.github.io/aria/#aria-selected 15 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | activateAndSetFocusOnFourthTab,activates and sets focus on the fourth tab 3 | activateFourthTabAndSetFocusOnTabpanel,"activates the fourth tab in the tab list, and sets focus on the tab panel" 4 | deactivateFirstTabAndSetFocusBeforeTablist,"deactivates the first tab in the tab list, sets focus on the first link, and activates the second tab" 5 | setFocusAfterTabpanel,sets focus on a link after the tab panel 6 | setFocusBeforeTablist,sets focus on a link before the tab list 7 | setFocusOnFirstTab,sets focus on the first tab 8 | setFocusOnFourthTab,sets focus on the fourth tab 9 | setFocusOnSecondTab,sets focus on the second tab 10 | setFocusOnTabPanel,sets focus on the tab panel 11 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,James Scholes, 3 | authorEmail,metadata,james@pac.bz, 4 | title,metadata,Disclosure of Answers to Frequently Asked Questions Example, 5 | reference,metadata,reference/2025-8-8_7334/disclosure-faq.html,Test Case Page for Disclosure of Answers to Frequently Asked Questions Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/,APG Pattern: Disclosure (Show/Hide) 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-faq/,APG Example: Disclosure (Show/Hide) for Answers to Frequently Asked Questions 8 | aria-expanded,aria,aria-expanded,aria-expanded 9 | button,htmlAam,button,button 10 | div,htmlAam,div,div 11 | ul,htmlAam,ul,ul 12 | -------------------------------------------------------------------------------- /tests/apg/slider-multithumb/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Horizontal Multi-Thumb Slider 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2023-3-20_134749/slider-multithumb.html 6 | designPattern,https://www.w3.org/WAI/ARIA/apg/patterns/slider-multithumb/ 7 | example,https://www.w3.org/WAI/ARIA/apg/patterns/slider-multithumb/examples/slider-multithumb/ 8 | slider,https://w3c.github.io/aria/#slider 9 | none,https://w3c.github.io/aria/#none 10 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby 11 | aria-label,https://w3c.github.io/aria/#aria-label 12 | aria-valuenow,https://w3c.github.io/aria/#aria-valuenow 13 | aria-valuemin,https://w3c.github.io/aria/#aria-valuemin 14 | aria-valuemax,https://w3c.github.io/aria/#aria-valuemax -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/js/moveFocusToAlabamaInListboxAndSetInputCursorAtEnd.js: -------------------------------------------------------------------------------- 1 | // expands the combobox, sets the combobox value to 'Alabama', places focus on that option in the listbox popup and positions the editing cursor at the end of the textbox 2 | testPageDocument.defaultView.comboboxController.open(); 3 | testPageDocument.defaultView.comboboxController.comboboxNode.focus(); 4 | testPageDocument.defaultView.comboboxController.setVisualFocusListbox(); 5 | let opt = testPageDocument.querySelector('#lb1-al'); 6 | let optTextLength = opt.textContent.length; 7 | testPageDocument.defaultView.comboboxController.setOption(opt, true); 8 | testPageDocument.defaultView.comboboxController.comboboxNode.setSelectionRange( 9 | optTextLength, 10 | optTextLength 11 | ); 12 | -------------------------------------------------------------------------------- /tests/apg/disclosure-navigation/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,James Scholes, 3 | authorEmail,metadata,james@pac.bz, 4 | title,metadata,Disclosure Navigation Menu Example, 5 | reference,metadata,reference/2022-9-9_13844/disclosure-navigation.html,Test Case Page for Disclosure Navigation Menu Example 6 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/,APG Example: Disclosure Navigation Menu 7 | button,htmlAam,button,button 8 | heading,htmlAam,heading,heading 9 | ul,htmlAam,ul,ul 10 | htmlLink,htmlAam,a,a (hyperlink) 11 | nav,htmlAam,nav,nav 12 | region,aria,region,region 13 | aria-label,aria,aria-label,aria-label 14 | aria-current,aria,aria-current,aria-current 15 | aria-expanded,aria,aria-expanded,aria-expanded 16 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/js/setFocusOnSecondAccordionHeaderAndCollapseFirstAccordionHeader.js: -------------------------------------------------------------------------------- 1 | // collapses the 'Personal Information' accordion header, and sets focus on the 'Billing Address' accordion header 2 | (() => { 3 | const header1Button = document.querySelector('#accordion1id'); 4 | const panel1 = document.querySelector('#sect1'); 5 | const header2Button = document.querySelector('#accordion2id'); 6 | 7 | if (header1Button && panel1 && header2Button) { 8 | header1Button.setAttribute('aria-expanded', 'false'); 9 | panel1.setAttribute('hidden', ''); // or panel1.hidden = true; 10 | 11 | header2Button.focus(); 12 | } else { 13 | console.error( 14 | 'SetupScript 4 Error: Accordion elements not found (#accordion1id, #sect1, or #accordion2id)' 15 | ); 16 | } 17 | })(); 18 | -------------------------------------------------------------------------------- /tests/apg/alert/reference/2022-4-8_144013/js/alert.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | * 5 | */ 6 | 7 | 'use strict'; 8 | 9 | window.addEventListener('load', function () { 10 | var button = document.getElementById('alert-trigger'); 11 | 12 | button.addEventListener('click', addAlert); 13 | }); 14 | 15 | /* 16 | * @function addAlert 17 | * 18 | * @desc Adds an alert to the page 19 | * 20 | * @param {object} event - Standard W3C event object 21 | * 22 | */ 23 | 24 | function addAlert() { 25 | var example = document.getElementById('example'); 26 | var template = document.getElementById('alert-template').innerHTML; 27 | 28 | example.innerHTML = template; 29 | } 30 | -------------------------------------------------------------------------------- /tests/apg/accordion/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Accordion, 5 | reference,metadata,reference/2025-5-5_135654/accordion.html,Test Case Page for Accordion Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/accordion/,APG Pattern: Accordion 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/accordion/examples/accordion/,APG Example: Accordion Example 8 | aria-expanded,aria,aria-expanded,aria-expanded 9 | aria-labelledby,aria,aria-labelledby,aria-labelledby 10 | aria-required,aria,aria-required,aria-required 11 | region,aria,region,region 12 | button,htmlAam,button,button 13 | heading,htmlAam,heading,heading 14 | inputTypeText,htmlAam,inputTypeText,inputTypeText 15 | -------------------------------------------------------------------------------- /tests/apg/rating-slider/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,Isabel Del Castillo 3 | title,Rating Slider 4 | authorEmail,isa.delcastillo5@gmail.com 5 | reference,reference/2021-9-21_13436/slider-rating.html 6 | designPattern,https://w3c.github.io/aria-practices/#slider 7 | example,https://w3c.github.io/aria-practices/examples/slider/slider-rating.html 8 | slider,https://w3c.github.io/aria/#slider 9 | aria-labelledby,https://w3c.github.io/aria/#aria-labelledby 10 | aria-orientation,https://w3c.github.io/aria/#aria-orientation 11 | aria-valuenow,https://w3c.github.io/aria/#aria-valuenow 12 | aria-valuemin,https://w3c.github.io/aria/#aria-valuemin 13 | aria-valuemax,https://w3c.github.io/aria/#aria-valuemax 14 | aria-valuetext,https://w3c.github.io/aria/#aria-valuetext 15 | aria-hidden,https://w3c.github.io/aria/#aria-hidden -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.js text eol=lf 2 | *.mjs text eol=lf 3 | 4 | # build folder 5 | /build/**/*.json -diff -merge 6 | /build/**/*.html linguist-generated=true 7 | /build/*.json -diff -merge 8 | /build/*.html linguist-generated=true 9 | /build/index.html -diff -merge 10 | /build/index.html linguist-generated=true 11 | /build/review/*.html -diff -merge 12 | /build/review/*.html linguist-generated=true 13 | /build/tests/*/*.html -diff -merge 14 | /build/tests/*/*.html linguist-generated=true 15 | /build/tests/*/*.json -diff -merge 16 | /build/tests/*/*.json linguist-generated=true 17 | /build/tests/*/*.mjs -diff -merge 18 | /build/tests/*/*.mjs linguist-generated=true 19 | 20 | 21 | # ignore line endings changes for *.html files inside tests folder 22 | /tests/**/*.html -crlf 23 | -------------------------------------------------------------------------------- /.github/workflows/js-lint.yml: -------------------------------------------------------------------------------- 1 | name: Lint JS 2 | 3 | on: 4 | push: 5 | paths: 6 | - '**/*.js' 7 | - 'package*.json' 8 | - '.eslintrc.json' 9 | - '.github/workflows/js-lint.yml' 10 | branches-ignore: 11 | - 'dependabot/**' 12 | pull_request: 13 | paths: 14 | - '**/*.js' 15 | - 'package*.json' 16 | - '.eslintrc.json' 17 | - '.github/workflows/js-lint.yml' 18 | 19 | jobs: 20 | lint: 21 | runs-on: ubuntu-latest 22 | 23 | steps: 24 | - uses: actions/checkout@v5 25 | 26 | - name: Use Node.js 27 | uses: actions/setup-node@v5 28 | with: 29 | node-version: '20.x' 30 | cache: 'npm' 31 | 32 | - name: Install dependencies 33 | run: npm ci 34 | 35 | - name: Run linter 36 | run: npm run lint 37 | -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/alert/reference/2022-4-8_144013/js/alert.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | * 5 | */ 6 | 7 | 'use strict'; 8 | 9 | window.addEventListener('load', function () { 10 | var button = document.getElementById('alert-trigger'); 11 | 12 | button.addEventListener('click', addAlert); 13 | }); 14 | 15 | /* 16 | * @function addAlert 17 | * 18 | * @desc Adds an alert to the page 19 | * 20 | * @param {object} event - Standard W3C event object 21 | * 22 | */ 23 | 24 | function addAlert() { 25 | var example = document.getElementById('example'); 26 | var template = document.getElementById('alert-template').innerHTML; 27 | 28 | example.innerHTML = template; 29 | } 30 | -------------------------------------------------------------------------------- /tests/apg/horizontal-slider/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | title,metadata,Color Viewer Slider, 4 | authorEmail,metadata,isa.delcastillo5@gmail.com, 5 | reference,metadata,reference/2022-4-11_11511/slider-color-viewer.html,Test Case Page for Color Viewer Slider 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/,APG Pattern: Slider 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/examples/slider-color-viewer/,APG Example: Color Viewer Slider 8 | slider,aria,slider,slider 9 | aria-labelledby,aria,aria-labelledby,aria-labelledby 10 | aria-valuenow,aria,aria-valuenow,aria-valuenow 11 | aria-valuemin,aria,aria-valuemin,aria-valuemin 12 | aria-valuemax,aria,aria-valuemax,aria-valuemax 13 | aria-orientation,aria,aria-orientation,aria-orientation 14 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent coding styles 2 | # between different editors and IDEs. 3 | 4 | # EditorConfig has support in a wide range of text editors. You can view a 5 | # complete list—or download a plugin—at the EditorConfig website: 6 | # http://editorconfig.org/#download 7 | 8 | # More about editorconfig files on their website: http://EditorConfig.org 9 | 10 | # For now, this is the topmost editor config file. 11 | # Set to false if aria repo gets one. 12 | root = true 13 | 14 | 15 | # Unix-style newlines with a newline ending every file 16 | [*] 17 | charset = "utf-8" 18 | end_of_line = lf 19 | insert_final_newline = true 20 | trim_trailing_whitespace = true 21 | 22 | [*.{html,css,js}] 23 | indent_style = space 24 | indent_size = 2 25 | 26 | [*.md] 27 | trim_trailing_whitespace = false 28 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/activateAndSetFocusOnFourthTab.js: -------------------------------------------------------------------------------- 1 | // Activates and sets focus on the fourth tab 2 | document.querySelectorAll('[role="tab"]').forEach(tab => { 3 | tab.setAttribute('aria-selected', 'false'); 4 | tab.setAttribute('tabindex', '-1'); 5 | }); 6 | document.querySelectorAll('[role="tabpanel"]').forEach(panel => { 7 | panel.classList.add('is-hidden'); 8 | }); 9 | // Find the fourth tab and its corresponding panel 10 | const fourthTab = document.querySelector('#tab-4'); 11 | const fourthPanel = document.querySelector('#tabpanel-4'); 12 | // Activate the tab, show the panel, and set focus 13 | if (fourthTab && fourthPanel) { 14 | fourthTab.setAttribute('aria-selected', 'true'); 15 | fourthTab.setAttribute('tabindex', '0'); 16 | fourthPanel.classList.remove('is-hidden'); 17 | fourthTab.focus(); 18 | } 19 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/js/activateAndSetFocusOnFourthTab.js: -------------------------------------------------------------------------------- 1 | // Activates and sets focus on the fourth tab 2 | document.querySelectorAll('[role="tab"]').forEach(tab => { 3 | tab.setAttribute('aria-selected', 'false'); 4 | tab.setAttribute('tabindex', '-1'); 5 | }); 6 | document.querySelectorAll('[role="tabpanel"]').forEach(panel => { 7 | panel.classList.add('is-hidden'); 8 | }); 9 | // Find the fourth tab and its corresponding panel 10 | const fourthTab = document.querySelector('#tab-4'); 11 | const fourthPanel = document.querySelector('#tabpanel-4'); 12 | // Activate the tab, show the panel, and set focus 13 | if (fourthTab && fourthPanel) { 14 | fourthTab.setAttribute('aria-selected', 'true'); 15 | fourthTab.setAttribute('tabindex', '0'); 16 | fourthPanel.classList.remove('is-hidden'); 17 | fourthTab.focus(); 18 | } 19 | -------------------------------------------------------------------------------- /tests/aria/aria-required-text-input/reference/2025-11-5/js/aria-required.js: -------------------------------------------------------------------------------- 1 | /* 2 | * This content is licensed according to the W3C Software License at 3 | * https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document 4 | * 5 | */ 6 | 7 | 'use strict'; 8 | 9 | window.addEventListener('load', function () { 10 | const checkbox = document.getElementById('toggle-required'); 11 | const textInput = document.getElementById('imaginary-word'); 12 | 13 | function updateAriaRequired() { 14 | if (checkbox.checked) { 15 | textInput.setAttribute('aria-required', 'true'); 16 | } else { 17 | textInput.setAttribute('aria-required', 'false'); 18 | } 19 | } 20 | 21 | // Initial state 22 | updateAriaRequired(); 23 | 24 | // Listen for changes 25 | checkbox.addEventListener('change', updateAriaRequired); 26 | }); -------------------------------------------------------------------------------- /__test__/__mocks__/tests/apg/horizontal-slider/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | title,metadata,Color Viewer Slider, 4 | authorEmail,metadata,isa.delcastillo5@gmail.com, 5 | reference,metadata,reference/2022-4-11_11511/slider-color-viewer.html,Test Case Page for Color Viewer Slider 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/,APG Pattern: Slider 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/examples/slider-color-viewer/,APG Example: Color Viewer Slider 8 | slider,aria,slider,slider 9 | aria-labelledby,aria,aria-labelledby,aria-labelledby 10 | aria-valuenow,aria,aria-valuenow,aria-valuenow 11 | aria-valuemin,aria,aria-valuemin,aria-valuemin 12 | aria-valuemax,aria,aria-valuemax,aria-valuemax 13 | aria-orientation,aria,aria-orientation,aria-orientation 14 | -------------------------------------------------------------------------------- /tests/apg/rating-radio-group/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Rating Radio Group, 5 | reference,metadata,reference/2025-4-8_12716/radio-rating.html,Rating Radio Group Example 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/radio/,APG Pattern: Radio Group 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/radio/examples/radio-rating/,APG Example: Rating Radio Group 8 | aria-checked,aria,aria-checked,aria-checked 9 | aria-label,aria,aria-label,aria-label 10 | aria-labelledby,aria,aria-labelledby,aria-labelledby 11 | aria-posinset,aria,aria-posinset,aria-posinset 12 | aria-setsize,aria,aria-setsize,aria-setsize 13 | radio,aria,radio,radio 14 | radiogroup,aria,radiogroup,radiogroup 15 | link,htmlAam,link,link 16 | -------------------------------------------------------------------------------- /tests/apg/radiogroup-roving-tabindex/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Radio Group Example Using Roving tabindex, 5 | reference,metadata,reference/2021-3-15_144141/radio.html,Test Case Page for Radio Group Example Using Roving tabindex 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/radio/,APG Pattern: Radio Group 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/radio/examples/radio/,APG Example: Radio Group Using Roving tabindex 8 | aria-checked,aria,aria-checked,aria-checked 9 | aria-labelledby,aria,aria-labelledby,aria-labelledby 10 | aria-posinset,aria,aria-posinset,aria-posinset 11 | aria-setsize,aria,aria-setsize,aria-setsize 12 | radio,aria,radio,radio 13 | radiogroup,aria,radiogroup,radiogroup 14 | htmlLink,htmlAam,a,HTML hyperlink 15 | -------------------------------------------------------------------------------- /lib/data/parse-support.js: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | 'use strict'; 5 | 6 | /** 7 | * @param {AriaATCSV.Support} supportRaw 8 | * @returns {AriaATParsed.Support} 9 | */ 10 | function parseSupport(supportRaw) { 11 | return { 12 | ats: supportRaw.ats, 13 | atGroups: [ 14 | ...Object.entries(supportRaw.applies_to).map(([name, value]) => ({ 15 | key: name.toLowerCase(), 16 | name, 17 | ats: value.map(key => supportRaw.ats.find(at => at.key === key) || { key }), 18 | })), 19 | ...supportRaw.ats.map(at => ({ 20 | key: at.key, 21 | name: at.name, 22 | ats: [at], 23 | })), 24 | ], 25 | testPlanStrings: supportRaw.testPlanStrings, 26 | references: supportRaw.references, 27 | }; 28 | } 29 | 30 | exports.parseSupport = parseSupport; 31 | -------------------------------------------------------------------------------- /tests/apg/main/reference/2022-4-28_91451/js/tabs.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright 2011-2014 University of Illinois 3 | * Authors: Thomas Foltz and Jon Gunderson 4 | * 5 | * Licensed under the Apache License, Version 2.0 (the "License"); 6 | * you may not use this file except in compliance with the License. 7 | * You may obtain a copy of the License at 8 | * 9 | * http://www.apache.org/licenses/LICENSE-2.0 10 | * 11 | * Unless required by applicable law or agreed to in writing, software 12 | * distributed under the License is distributed on an "AS IS" BASIS, 13 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 14 | * See the License for the specific language governing permissions and 15 | * limitations under the License. 16 | */ 17 | 18 | /* global $ */ 19 | 20 | 'use strict'; 21 | 22 | $('#myTabs a').click(function (e) { 23 | e.preventDefault(); 24 | $(this).tab('show'); 25 | }); 26 | -------------------------------------------------------------------------------- /tests/apg/disclosure-faq/data/scripts.csv: -------------------------------------------------------------------------------- 1 | setupScript,setupScriptDescription 2 | moveFocusAfterAndExpandFourthDisclosure,"sets the state of the fourth disclosure button to expanded, and sets focus on a link after the button" 3 | moveFocusAfterFourthDisclosure,sets focus on a link after the fourth disclosure button 4 | moveFocusBeforeAndExpandFirstDisclosure,"sets focus on a link before the first disclosure button, and sets the state of the first button to expanded" 5 | moveFocusBeforeFirstDisclosure,sets focus on a link before the first disclosure button 6 | moveFocusToAndExpandFirstDisclosure,"sets focus on the first disclosure button, and sets its state to expanded" 7 | moveFocusToAndExpandFourthDisclosure,"sets focus on the fourth disclosure button, and sets its state to expanded" 8 | moveFocusToFirstDisclosure,sets focus on the first disclosure button 9 | moveFocusToFourthDisclosure,sets focus on the fourth disclosure 10 | -------------------------------------------------------------------------------- /tests/apg/tabs-automatic-activation/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Tabs with Automatic Activation, 5 | reference,metadata,reference/2025-6-5_142619/tabs-automatic.html,Tabs with Automatic Activation 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/tabs/,Tabs Pattern 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/tabs/examples/tabs-automatic/,Example of Tabs with Automatic Activation 8 | aria-labelledby,aria,aria-labelledby,aria-labelledby 9 | aria-posinset,aria,aria-posinset,aria-posinset 10 | aria-selected,aria,aria-selected,aria-selected 11 | aria-setsize,aria,aria-setsize,aria-setsize 12 | tab,aria,tab,tab 13 | tablist,aria,tablist,tablist 14 | tabpanel,aria,tabpanel,tabpanel 15 | htmlButton,htmlAam,button,HTML button 16 | htmlParagraph,htmlAam,p,HTML paragraph 17 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/js/activateAndSetFocusOnSecondTab.js: -------------------------------------------------------------------------------- 1 | // activates and sets focus on the second tab 2 | // Select the first and second tabs and their panels 3 | const firstTab = document.querySelector('#tab-1'); 4 | const firstPanel = document.querySelector('#tabpanel-1'); 5 | const secondTab = document.querySelector('#tab-2'); 6 | const secondPanel = document.querySelector('#tabpanel-2'); 7 | // Deactivate the first tab and hide its panel 8 | if (firstTab && firstPanel) { 9 | firstTab.setAttribute('aria-selected', 'false'); 10 | firstTab.setAttribute('tabindex', '-1'); 11 | firstPanel.classList.add('is-hidden'); 12 | } 13 | // Activate the second tab, show its panel, and set focus 14 | if (secondTab && secondPanel) { 15 | secondTab.setAttribute('aria-selected', 'true'); 16 | secondTab.setAttribute('tabindex', '0'); 17 | secondPanel.classList.remove('is-hidden'); 18 | secondTab.focus(); 19 | } 20 | -------------------------------------------------------------------------------- /tests/apg/seek-slider/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | title,metadata,Media Seek Slider, 4 | authorEmail,metadata,isa.delcastillo5@gmail.com, 5 | reference,metadata,reference/2021-9-21_14462/slider-seek.html,Test Case Page for Media Seek Slider 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/,APG Pattern: Slider 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/slider/examples/slider-seek/,APG Example: Media Seek Slider 8 | slider,aria,slider,slider 9 | none,aria,none,none 10 | aria-labelledby,aria,aria-labelledby,aria-labelledby 11 | aria-orientation,aria,aria-orientation,aria-orientation 12 | aria-valuenow,aria,aria-valuenow,aria-valuenow 13 | aria-valuemin,aria,aria-valuemin,aria-valuemin 14 | aria-valuemax,aria,aria-valuemax,aria-valuemax 15 | aria-valuetext,aria,aria-valuetext,aria-valuetext 16 | aria-hidden,aria,aria-hidden,aria-hidden 17 | -------------------------------------------------------------------------------- /scripts/test-reviewer/getScriptsData.mjs: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import fse from 'fs-extra'; 3 | 4 | /** 5 | * @param {string} testPlanDirectory 6 | * @returns {string[]} 7 | */ 8 | const getScriptsData = testPlanDirectory => { 9 | const scriptsPath = path.join(testPlanDirectory, 'data', 'js'); 10 | const scripts = []; 11 | 12 | fse.readdirSync(scriptsPath).forEach(function (scriptFile) { 13 | let script = ''; 14 | try { 15 | const data = fse.readFileSync(path.join(scriptsPath, scriptFile), 'UTF-8'); 16 | const lines = data.split(/\r?\n/); 17 | lines.forEach(line => { 18 | if (line.trim().length) script += '\t' + line.trim() + '\n'; 19 | }); 20 | } catch (err) { 21 | console.error(err); 22 | } 23 | scripts.push(`\t${scriptFile.split('.js')[0]}: function(testPageDocument){\n${script}}`); 24 | }); 25 | 26 | return scripts; 27 | }; 28 | 29 | export default getScriptsData; 30 | -------------------------------------------------------------------------------- /tests/apg/combobox-autocomplete-both-updated/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,value 2 | author,James Scholes 3 | authorEmail,james@pac.bz 4 | title,Combobox with Both List and Inline Autocomplete Example 5 | reference,reference/2020-12-11_16649/combobox-autocomplete-both.html 6 | designPattern,https://w3c.github.io/aria-practices/#combobox 7 | example,https://w3c.github.io/aria-practices/examples/combobox/combobox-autocomplete-both.html 8 | combobox,https://w3c.github.io/aria/#combobox 9 | listbox,https://w3c.github.io/aria/#listbox 10 | option,https://w3c.github.io/aria/#option 11 | aria-activedescendant,https://w3c.github.io/aria/#aria-activedescendant 12 | aria-autocomplete,https://w3c.github.io/aria/#aria-autocomplete 13 | aria-controls,https://w3c.github.io/aria/#aria-controls 14 | aria-label,https://w3c.github.io/aria/#aria-label 15 | aria-expanded,https://w3c.github.io/aria/#aria-expanded 16 | aria-selected,https://w3c.github.io/aria/#aria-selected 17 | -------------------------------------------------------------------------------- /tests/apg/tabs-manual-activation/data/references.csv: -------------------------------------------------------------------------------- 1 | refId,type,value,linkText 2 | author,metadata,Isabel Del Castillo, 3 | authorEmail,metadata,isa.delcastillo5@gmail.com, 4 | title,metadata,Tabs with Manual Activation, 5 | reference,metadata,reference/2025-8-28_13240/tabs-manual.html,Tabs with Automatic Activation 6 | designPattern,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/tabs/,Tabs Pattern 7 | example,metadata,https://www.w3.org/WAI/ARIA/apg/patterns/tabs/examples/tabs-manual/,Example of Tabs with Manual Activation 8 | aria-labelledby,aria,aria-labelledby,aria-labelledby 9 | aria-posinset,aria,aria-posinset,aria-posinset 10 | aria-selected,aria,aria-selected,aria-selected 11 | aria-setsize,aria,aria-setsize,aria-setsize 12 | tab,aria,tab,tab 13 | tablist,aria,tablist,tablist 14 | tabpanel,aria,tabpanel,tabpanel 15 | htmlButton,htmlAam,button,HTML button 16 | htmlLink,htmlAam,a,HTML hyperlink 17 | htmlParagraph,htmlAam,p,HTML paragraph 18 | --------------------------------------------------------------------------------