Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request for A11y: Add containerRole parameter #7707

Closed
4 tasks done
michaelbourne opened this issue Aug 28, 2024 · 0 comments · Fixed by #7708
Closed
4 tasks done

Feature Request for A11y: Add containerRole parameter #7707

michaelbourne opened this issue Aug 28, 2024 · 0 comments · Fixed by #7708

Comments

@michaelbourne
Copy link
Contributor

michaelbourne commented Aug 28, 2024

Clear and concise description of the problem

The Accessibility module currently allows for a aria-roledescription attribute on the slider container via the containerRoleDescriptionMessage option, but there is no support for setting a role to the same container.

As per https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription, this is a violation of best practices, and my a11y auditors have flagged it as an issue to be fixed.

Ensure aria-roledescription is only used on elements with an implicit or explicit role. Success criteria 4.1.2

Suggested solution

Add a containerRole parameter to the Accessibility module so we can set the proper role (region) when setting the containerRoleDescriptionMessage option.

Additional context

Answers for @nolimits4web

What is the issue?

Providing users an ability to set an aria-roledescription without an aria role is an accessibility error.

What does it do?

Adding this would allow Swiper to be more accessible.

What is it for?

Better accessibility.

What does it fix?

The accessibility error of having an aria-roledescription without a proper role.

Why you can't just add aria-role with "hands" to HTML element?

For the same reason you provide containerRoleDescriptionMessage in the first place: we don't always have direct control over the markup.

Clearly describe the issue including steps to reproduce when it is a bug.
Make sure you fill in the earliest version that you know has the issue.
Provide live link or JSFiddle/Codepen or website with isssue

This is on all versions, it's a new feature being added, not a code bug to reproduce. The w3 guidelines for this are linked above.

Validations

  • Follow our Code of Conduct
  • Read the docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

Would you like to open a PR for this feature?

  • I'm willing to open a PR
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant