diff --git a/.changeset/clever-masks-film.md b/.changeset/clever-masks-film.md new file mode 100644 index 00000000..66b6c30e --- /dev/null +++ b/.changeset/clever-masks-film.md @@ -0,0 +1,8 @@ +--- +"dom-accessibility-api": patch +--- + +Don't consider `title` in 2E + +Effectively ensures that `title` will not have precedence over name from content. +For example, the `option` in `` will now have `"Content"` has its accessible name instead of `"Title"`. diff --git a/sources/__tests__/accessible-name.js b/sources/__tests__/accessible-name.js index e80d9b0c..3f4f0c49 100644 --- a/sources/__tests__/accessible-name.js +++ b/sources/__tests__/accessible-name.js @@ -108,6 +108,11 @@ describe("to upstream", () => { ``, "foo", ], + [ + "option", + ``, + "Content", + ], [ "radio", `
greek kappa
`, @@ -401,6 +406,7 @@ test.each([ ` />`, "a logo", ], + [` `, "crazy"], ])(`misc #%#`, (markup, expectedAccessibleName) => { expect(markup).toRenderIntoDocumentAccessibleName(expectedAccessibleName); }); diff --git a/sources/accessible-name-and-description.ts b/sources/accessible-name-and-description.ts index 0ef48449..16520f98 100644 --- a/sources/accessible-name-and-description.ts +++ b/sources/accessible-name-and-description.ts @@ -207,14 +207,6 @@ function isDescendantOfNativeHostLanguageTextAlternativeElement( return false; } -/** - * TODO https://github.com/eps1lon/dom-accessibility-api/issues/101 - */ -// eslint-disable-next-line @typescript-eslint/no-unused-vars -- not implemented yet -function computeTooltipAttributeValue(node: Node): string | null { - return null; -} - function getValueOfTextbox(element: Element): string { if (isHTMLInputElement(element) || isHTMLTextAreaElement(element)) { return element.value; @@ -401,30 +393,38 @@ export function computeTextAlternative( return accumulatedText.trim(); } - function computeElementTextAlternative(node: Node): string | null { + /** + * + * @param element + * @param attributeName + * @returns A string non-empty string or `null` + */ + function useAttribute( + element: Element, + attributeName: string + ): string | null { + const attribute = element.getAttributeNode(attributeName); + if ( + attribute !== null && + !consultedNodes.has(attribute) && + attribute.value.trim() !== "" + ) { + consultedNodes.add(attribute); + return attribute.value; + } + return null; + } + + function computeTooltipAttributeValue(node: Node): string | null { if (!isElement(node)) { return null; } - /** - * - * @param element - * @param attributeName - * @returns A string non-empty string or `null` - */ - function useAttribute( - element: Element, - attributeName: string - ): string | null { - const attribute = element.getAttributeNode(attributeName); - if ( - attribute !== null && - !consultedNodes.has(attribute) && - attribute.value.trim() !== "" - ) { - consultedNodes.add(attribute); - return attribute.value; - } + return useAttribute(node, "title"); + } + + function computeElementTextAlternative(node: Node): string | null { + if (!isElement(node)) { return null; } @@ -547,10 +547,9 @@ export function computeTextAlternative( if (nameFromSubTree !== "") { return nameFromSubTree; } - return useAttribute(node, "title"); } - return useAttribute(node, "title"); + return null; } function computeTextAlternative( @@ -673,11 +672,14 @@ export function computeTextAlternative( isNativeHostLanguageTextAlternativeElement(current) || isDescendantOfNativeHostLanguageTextAlternativeElement(current) ) { - consultedNodes.add(current); - return computeMiscTextAlternative(current, { + const accumulatedText2F = computeMiscTextAlternative(current, { isEmbeddedInLabel: context.isEmbeddedInLabel, isReferenced: false, }); + if (accumulatedText2F !== "") { + consultedNodes.add(current); + return accumulatedText2F; + } } if (current.nodeType === current.TEXT_NODE) {