fix(table): fix table accessibility issue-2813#2885
Uh oh!
There was an error while loading. Please reload this page.
Conversation
|
atharv-g-kulkarni changed the title 
atharv-g-kulkarni changed the title 
✅ Commitlint tests passed!More Info{"valid": true, "errors": [], "warnings": [], "input": "fix(table): fix table accessibility issue-2813" } |
✅ Deploy Preview for patternfly-elements ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
elements/pf-table/pf-tr.ts Outdated
| <pf-buttonid="toggle-button" | ||
| aria-expanded=${String(this.expanded)as'true'|'false'} | ||
| plain | ||
| role="button" |
There was a problem hiding this comment.
We shouldn't need to set role here as this gets applied at element internals level if the variant is not set to link, aka role should just be automatically set by the pf-button component itself.
| role="button" |
There was a problem hiding this comment.
Thank you for your suggestion.
I have removed role="button" and pushed the changes.
elements/pf-table/pf-tr.ts Outdated
| aria-expanded=${String(this.expanded)as'true'|'false'} | ||
| plain | ||
| role="button" | ||
| aria-label="Expand Button" |
There was a problem hiding this comment.
pf-button has an API for adding the accessible label. We'd use label here instead of using the aria-label on the host.
| aria-label="Expand Button" | |
| label="Expand Button" |
There was a problem hiding this comment.
Thank you for your suggestion.
I have changed aria-label to label and pushed the changes.
zeroedin left a comment
zeroedin left a comment There was a problem hiding this comment.
So enacting the requested changes myself locally I think I opened a broader issue here. Because we are using button as an expander, and using aria-expanded on it we equally need a aria-controls which isn't currently being applied. Also due to the fact the element being opened#expansion is across shadow dom roots I'm going to assume we are going to run into cross root aria issues with that.
@adamjohnson when you get the chance lets review this together.
bennypowers commented Dec 8, 2024
can the button's |
atharv-g-kulkarniforce-pushed the pf-table-2813 branch from 1e2f9a1 to 7f189aeCompare3 participants
What I did
Before:
After:
Before:
After:
