Fixes an issue where the Image's id value was being duplicated in the img HTML element and in a wrapper div element that is used by the aspectRatio prop.
This issue only happens when there's an id and aspect ratio value but not a caption or credit value.
The ...rest was the culprit.
The jest-axe unit tests did not pick up this issue and neither does Storybook's accessibility tool. This was flagged in an accessibility test in DCF that @avertrees was working on.
The issue is clearly in the DOM in jest-axe unit tests but the test still passes:
This is now fixed
How has this been tested?
Locally.
Accessibility concerns or updates
Fixes a non-flagged internal issue. It should've been flagged and maybe we need to upgrade our axe tools.
Accessibility Checklist
[ ] Checked Storybook's "Accessibility" tab for color contrast and other issues.
[ ] The feature works with keyboard inputs including tabbing back and forward and pressing space, enter, arrow, and esc keys.
[ ] For hidden text or when aria-live is used, a screenreader was used to verify the text is read.
[ ] For features that involve UI updates and focusing on DOM refs, focus management was reviewed.
[ ] The feature works when the page is zoomed in to 200% and 400%.
Open Questions
-
Checklist:
[ ] I have updated the Storybook documentation and changelog accordingly.
[ ] I have added relevant accessibility documentation for this pull request.
[ ] All new and existing tests passed.
Front End Review:
[ ] Review the Vercel preview deployment once it is ready.
Fixes JIRA ticket DSD-1826
This PR does the following:
Fixes an issue where the
Image
's id value was being duplicated in theimg
HTML element and in a wrapper div element that is used by theaspectRatio
prop.This issue only happens when there's an id and aspect ratio value but not a caption or credit value.
The
...rest
was the culprit.The jest-axe unit tests did not pick up this issue and neither does Storybook's accessibility tool. This was flagged in an accessibility test in DCF that @avertrees was working on.
The issue is clearly in the DOM in jest-axe unit tests but the test still passes:
This is now fixed
How has this been tested?
Accessibility concerns or updates
Accessibility Checklist
aria-live
is used, a screenreader was used to verify the text is read.ref
s, focus management was reviewed.Open Questions
-
Checklist:
Front End Review: