Improve accessibility by using tooltip as fallback for ariaLabel in KIconButton #798
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR addresses an accessibility issue in the
KIconButton
component. Previously, theariaLabel
andtooltip
props were treated independently, and it was possible for a developer to omit theariaLabel
prop while setting atooltip
. This could lead to accessibility issues, asariaLabel
is essential for screen readers, but thetooltip
is not.Issue addressed
#793
Addresses
It is resolved by the adding a new custom computed property
computedAriaLabel
which will dynamically sets theariaLabel
andtooltip
props.Before/after screenshots
Changelog
computedAriaLabel
that dynamically sets theariaLabel
forKIconButton
based on thetooltip
prop whenariaLabel
is not provided.tooltip
value as fallback ifariaLabel
is missing #793KIconButton
KIconbutton
.(optional) Implementation notes
At a high level, how did you implement this?
Does this introduce any tech-debt items?
Testing checklist
Reviewer guidance
Comments