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

fix(material/stepper): fix nested tabpanel role in stepper #30410

Open
wants to merge 4 commits into
base: main
Choose a base branch
from

Conversation

essjay05
Copy link
Contributor

@essjay05 essjay05 commented Jan 28, 2025

Updates Angular Components Stepper component to fix the nested aria-role "tabpanel" in the vertical stepper by converting vertical stepper role from "tablist" to "tree" and updating its associated aria attributes.

Before fix screenshot
After fix screenshot

Fixes b/361783174

@jelbourn jelbourn added the dev-app preview When applied, previews of the dev-app are deployed to Firebase label Jan 28, 2025
Copy link

github-actions bot commented Jan 28, 2025

Deployed dev-app for c71e31b to: https://ng-dev-previews-comp--pr-angular-components-30410-dev-h02yz5i9.web.app

Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt.

@essjay05 essjay05 force-pushed the stepper-aria-roles-fix branch from b1e74eb to 49c1419 Compare January 30, 2025 22:27
@essjay05 essjay05 marked this pull request as ready for review January 30, 2025 23:22
@essjay05 essjay05 requested a review from a team as a code owner January 30, 2025 23:22
@essjay05 essjay05 requested review from mmalerba and andrewseguin and removed request for a team January 30, 2025 23:22
Updates Angular Components Stepper component to fix the nested
aria-role tabpanel in the vertical stepper.

Fixes b/361783174
…ee-related

Updates Angular Components Stepper vertical stepper to use and match correct
aria attributes to match role=tree instead of using tablist/tab/tabpanel since
moving the tabpanel content outside of the mat-step changes the visual look of
the vertical stepper. WIP: update the docs to mention change of roles for vertical
stepper to tree and its appropriate aria-attributes.

Fixes b/361783174
Updates previous fix to Angular Components stepper to remove
unnecessary roles and attributes. Also updates Stepper docs with
latest vertical stepper aria attribute and role changes. Updates
stepper-demo heading level elements for accessibility purposes.
Cleans up previous changes by removing unnecessary aria role
of group wrapping the step-header and step-content.
@essjay05 essjay05 force-pushed the stepper-aria-roles-fix branch from 3632365 to c71e31b Compare January 31, 2025 16:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area: material/stepper dev-app preview When applied, previews of the dev-app are deployed to Firebase
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants