Describe the problem
This is an issue with
How do you reproduce the problem?
Go to the expandable clipboard copy examples and inspect the DOM; notice that the examples that are not expanded are missing aria-expanded="false". Also note that there is no aria-label applied to these buttons.
Expected behavior
aria-expanded is always present when expansion is possible.
Is this issue blocking you?
List the workaround if there is one.
Screenshots
If applicable, add screenshots to help explain the issue.
What is your environment?
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]
What is your product and what release date are you targeting?
Any other information?
Describe the problem
This is an issue with
Patternfly 5
Patternfly 6
other
Some expandable examples are missing the
aria-expandedattribute when the clipboard copy is not expanded. For expansion,aria-expandedmust always be present with either a true or false value; omitting the attribute provides a different context than passing a false value.The expandable buttons need to have an
aria-labelapplied. Currently theiraria-labelledbyis self-referencing, but the button itself does not have its own label.There's some inconsistency with some browser+AT combos where despite the text input having its own
aria-label, the expand or copy buttons are using the value of the input to create an accessible name (e.g. "Copy to clipboard This is editable" instead of "Copy to clipboard copyable input". Somewhat related to React issue Bug - Clipboard copy with expansion variant - screen reader issue patternfly-react#11372, this could be confusing to users. Rather than usingaria-labelledbyon these buttons, it may be better to just usearia-labelto achieve the desired result of the text "Copy to clipboard" + the aria-label of the input. For inline compact variants, we'd need to choose a fitting text to append after the "Copy.." text, possibly the example name e.g "Copy to clipboard inline compact content"?How do you reproduce the problem?
Go to the expandable clipboard copy examples and inspect the DOM; notice that the examples that are not expanded are missing
aria-expanded="false". Also note that there is noaria-labelapplied to these buttons.Expected behavior
aria-expandedis always present when expansion is possible.Is this issue blocking you?
List the workaround if there is one.
Screenshots
If applicable, add screenshots to help explain the issue.
What is your environment?
What is your product and what release date are you targeting?
Any other information?