dom-accessibility-api
Advanced tools
Package description
The dom-accessibility-api package is a library that provides utility functions for querying and manipulating the accessibility tree of DOM elements. It allows developers to retrieve accessible names and descriptions, roles, and other properties related to accessibility, which are crucial for building web applications that are compliant with accessibility standards.
Getting the accessible name
This feature allows you to retrieve the accessible name of a DOM element, which is the name that screen readers will announce to users.
import { getAccessibleName } from 'dom-accessibility-api';
const element = document.getElementById('myElement');
const accessibleName = getAccessibleName(element);Getting the accessible description
This feature allows you to retrieve the accessible description of a DOM element, providing additional context to assistive technologies.
import { getAccessibleDescription } from 'dom-accessibility-api';
const element = document.getElementById('myElement');
const accessibleDescription = getAccessibleDescription(element);Getting the role
This feature allows you to get the computed role of a DOM element, which is used by assistive technologies to understand the purpose of the element.
import { getRole } from 'dom-accessibility-api';
const element = document.getElementById('myElement');
const role = getRole(element);aria-query is a package that provides maps of ARIA roles, states, and properties to use with DOM elements. It is similar to dom-accessibility-api in that it helps with accessibility concerns but does not provide functions to directly retrieve accessible names or descriptions.
ally.js is a JavaScript library to help modern web applications with accessibility concerns. It provides a higher-level API compared to dom-accessibility-api and includes features for focus handling, keyboard interaction, and more.
Readme
https://w3c.github.io/accname/ for jsdom
$ yarn add dom-accessibility-api
import { computeAccessibleName } from "dom-accessibility-api";
I wrote this down in 12 hours to get a quick overview how complex a full implementation would be.
I'm very new to working with specs so if you got any insights, something catches your eye feel free to let me know. DMs are open.
Using https://github.com/web-platform-tests/wpt. Be sure to init submodules when cloning.
web-platform-tests
accname
✓ [expected fail] description_1.0_combobox-focusable-manual.html
✓ [expected fail] description_from_content_of_describedby_element-manual.html
✓ [expected fail] description_link-with-label-manual.html
✓ [expected fail] description_test_case_557-manual.html
✓ [expected fail] description_test_case_664-manual.html
✓ [expected fail] description_test_case_665-manual.html
✓ [expected fail] description_test_case_666-manual.html
✓ [expected fail] description_test_case_772-manual.html
✓ [expected fail] description_test_case_773-manual.html
✓ [expected fail] description_test_case_774-manual.html
✓ [expected fail] description_test_case_838-manual.html
✓ [expected fail] description_test_case_broken_reference-manual.html
✓ [expected fail] description_test_case_one_valid_reference-manual.html
✓ [expected fail] description_title-same-element-manual.html
✓ name_1.0_combobox-focusable-alternative-manual.html
✓ name_1.0_combobox-focusable-manual.html
✓ name_checkbox-label-embedded-combobox-manual.html
✓ name_checkbox-label-embedded-listbox-manual.html
✓ name_checkbox-label-embedded-menu-manual.html
✓ name_checkbox-label-embedded-select-manual.html
✓ name_checkbox-label-embedded-slider-manual.html
✓ name_checkbox-label-embedded-spinbutton-manual.html
✓ name_checkbox-label-embedded-textbox-manual.html
✓ name_checkbox-label-multiple-label-alternative-manual.html
✓ name_checkbox-label-multiple-label-manual.html
✓ name_checkbox-title-manual.html
✓ name_file-label-embedded-combobox-manual.html
✓ name_file-label-embedded-menu-manual.html
✓ name_file-label-embedded-select-manual.html
✓ name_file-label-embedded-slider-manual.html
✓ name_file-label-embedded-spinbutton-manual.html
✓ [expected fail] name_file-label-inline-block-elements-manual.html
✓ [expected fail] name_file-label-inline-block-styles-manual.html
✓ name_file-label-inline-hidden-elements-manual.html
✓ name_file-label-owned-combobox-manual.html
✓ name_file-label-owned-combobox-owned-listbox-manual.html
✓ name_file-title-manual.html
✓ name_from_content-manual.html
✓ name_from_content_of_label-manual.html
✓ name_from_content_of_labelledby_element-manual.html
✓ name_from_content_of_labelledby_elements_one_of_which_is_hidden-manual.html
✓ [expected fail] name_heading-combobox-focusable-alternative-manual.html
✓ name_image-title-manual.html
✓ name_link-mixed-content-manual.html
✓ name_link-with-label-manual.html
✓ name_password-label-embedded-combobox-manual.html
✓ name_password-label-embedded-menu-manual.html
✓ name_password-label-embedded-select-manual.html
✓ name_password-label-embedded-slider-manual.html
✓ name_password-label-embedded-spinbutton-manual.html
✓ name_password-title-manual.html
✓ name_radio-label-embedded-combobox-manual.html
✓ name_radio-label-embedded-menu-manual.html
✓ name_radio-label-embedded-select-manual.html
✓ name_radio-label-embedded-slider-manual.html
✓ name_radio-label-embedded-spinbutton-manual.html
✓ name_radio-title-manual.html
✓ name_test_case_539-manual.html
✓ name_test_case_540-manual.html
✓ name_test_case_541-manual.html
✓ name_test_case_543-manual.html
✓ name_test_case_544-manual.html
✓ name_test_case_545-manual.html
✓ name_test_case_546-manual.html
✓ name_test_case_547-manual.html
✓ name_test_case_548-manual.html
✓ name_test_case_549-manual.html
✓ name_test_case_550-manual.html
✓ name_test_case_551-manual.html
✓ [expected fail] name_test_case_552-manual.html
✓ [expected fail] name_test_case_553-manual.html
✓ name_test_case_556-manual.html
✓ name_test_case_557-manual.html
✓ name_test_case_558-manual.html
✓ name_test_case_559-manual.html
✓ name_test_case_560-manual.html
✓ name_test_case_561-manual.html
✓ name_test_case_562-manual.html
✓ name_test_case_563-manual.html
✓ name_test_case_564-manual.html
✓ name_test_case_565-manual.html
✓ name_test_case_566-manual.html
✓ name_test_case_596-manual.html
✓ name_test_case_597-manual.html
✓ name_test_case_598-manual.html
✓ name_test_case_599-manual.html
✓ name_test_case_600-manual.html
✓ name_test_case_601-manual.html
✓ name_test_case_602-manual.html
✓ name_test_case_603-manual.html
✓ name_test_case_604-manual.html
✓ name_test_case_605-manual.html
✓ name_test_case_606-manual.html
✓ name_test_case_607-manual.html
✓ name_test_case_608-manual.html
✓ name_test_case_609-manual.html
✓ [expected fail] name_test_case_610-manual.html
✓ name_test_case_611-manual.html
✓ name_test_case_612-manual.html
✓ name_test_case_613-manual.html
✓ name_test_case_614-manual.html
✓ name_test_case_615-manual.html
✓ name_test_case_616-manual.html
✓ name_test_case_617-manual.html
✓ name_test_case_618-manual.html
✓ name_test_case_619-manual.html
✓ name_test_case_620-manual.html
✓ name_test_case_621-manual.html
✓ [expected fail] name_test_case_659-manual.html
✓ [expected fail] name_test_case_660-manual.html
✓ [expected fail] name_test_case_661-manual.html
✓ [expected fail] name_test_case_662-manual.html
✓ [expected fail] name_test_case_663a-manual.html
✓ name_test_case_721-manual.html
✓ name_test_case_723-manual.html
✓ name_test_case_724-manual.html
✓ name_test_case_725-manual.html
✓ name_test_case_726-manual.html
✓ name_test_case_727-manual.html
✓ name_test_case_728-manual.html
✓ name_test_case_729-manual.html
✓ name_test_case_730-manual.html
✓ name_test_case_731-manual.html
✓ name_test_case_733-manual.html
✓ name_test_case_734-manual.html
✓ name_test_case_735-manual.html
✓ name_test_case_736-manual.html
✓ name_test_case_737-manual.html
✓ name_test_case_738-manual.html
✓ name_test_case_739-manual.html
✓ name_test_case_740-manual.html
✓ name_test_case_741-manual.html
✓ name_test_case_742-manual.html
✓ name_test_case_743-manual.html
✓ name_test_case_744-manual.html
✓ name_test_case_745-manual.html
✓ name_test_case_746-manual.html
✓ name_test_case_747-manual.html
✓ name_test_case_748-manual.html
✓ name_test_case_749-manual.html
✓ name_test_case_750-manual.html
✓ name_test_case_751-manual.html
✓ name_test_case_752-manual.html
✓ [expected fail] name_test_case_753-manual.html
✓ [expected fail] name_test_case_754-manual.html
✓ [expected fail] name_test_case_755-manual.html
✓ [expected fail] name_test_case_756-manual.html
✓ [expected fail] name_test_case_757-manual.html
✓ [expected fail] name_test_case_758-manual.html
✓ [expected fail] name_test_case_759-manual.html
✓ [expected fail] name_test_case_760-manual.html
✓ [expected fail] name_test_case_761-manual.html
✓ [expected fail] name_test_case_762-manual.html
✓ name_text-label-embedded-combobox-manual.html
✓ name_text-label-embedded-menu-manual.html
✓ name_text-label-embedded-select-manual.html
✓ name_text-label-embedded-slider-manual.html
✓ name_text-label-embedded-spinbutton-manual.html
✓ name_text-title-manual.html
FAQs
Unknown package
We found that dom-accessibility-api demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
pnpm 9.5 introduces a Catalogs feature, enabling shareable dependency version specifiers, reducing merge conflicts and improving support for monorepos.
Security News
A threat actor on BreachForums is selling an unverified npm vulnerability for account takeover, but npm has not officially confirmed the existence of this security concern.
Security News
Cyber insurance rates are dropping as the market matures, according to a new report projecting global premiums to reach $43 billion by 2030, driven by international market uptake and growth in the SME sector.