You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The NavCloseButton element, while it accepts an aria-label itself, by default only applies an aria-label to the enclosed Icon.Close rather than the <button /> element. This means that using any further abstracted components (like ExtendedNav) will cause the resulting HTML to violate this rule.
The buttons within the modal elements already conform to this paradigm, only the nav elements appear to be effected.
To Reproduce
Steps to reproduce the behavior:
Go to the project storybook
Click on Components -> Header
Inspect any *Button element
Observe that aria-label is not present on button elements, but is present on child <svg /> elements
Expected behavior
<button /> elements should have aria-label attribute to meet WCAG § 4.1.2 requirements.
Additional context
This issue was initially identified using HTML_Codesniffer which we use alongside Axe and playwright to implement E2E testing.
The text was updated successfully, but these errors were encountered:
ReactUSWDS Version & USWDS Version:
Describe the bug
WCAG § 4.1.2 states the following:
The
NavCloseButton
element, while it accepts anaria-label
itself, by default only applies anaria-label
to the enclosedIcon.Close
rather than the<button />
element. This means that using any further abstracted components (likeExtendedNav
) will cause the resulting HTML to violate this rule.The buttons within the modal elements already conform to this paradigm, only the nav elements appear to be effected.
To Reproduce
Steps to reproduce the behavior:
*Button
elementaria-label
is not present on button elements, but is present on child<svg />
elementsExpected behavior
<button />
elements should havearia-label
attribute to meet WCAG § 4.1.2 requirements.Additional context
This issue was initially identified using HTML_Codesniffer which we use alongside Axe and playwright to implement E2E testing.
The text was updated successfully, but these errors were encountered: