gamut
gamut copied to clipboard
Codecademy
fix(modal + dialog): updating aria attributes per a11y team feedback
Overview
Applying changes to the Modal and Dialog components per feedback from a11y team. Also adding a zIndex
PR Checklist
- [x] Related to designs: https://www.figma.com/design/g6pOoIOxRI6tGyAptTPMey/Cycle-F---Teams-improvements?node-id=563-2480&p=f&t=jn6CEetQkDRJLHQB-0
- [x] Related to JIRA ticket: GM-1055
- [x] I have run this code to verify it works
- [ ] This PR includes unit tests for the code change
- [x] This PR includes testing instructions tests for the code change
- [x] The alpha package of this PR is passing end-to-end tests in all relevant Codecademy repositories
Testing Instructions
The feedback from the a11y team:
- Go to the preview
- Navigate to Modal
- Turn on VO, and click the button to open the modal - it should announce the title of the modal, that it's a dialog (yes, that's not a typo), and how many items are inside the modal (this is the same behavior as prod)
- Navigate to Dialog (skip the TESTING section for now)
- With VO on, click on the button to open the dialog — it should announce the title of the dialog, that it's a dialog , and how many items are inside the dialog (this also is the same behavior as prod)
- Go back to the TESTING ... section
- Follow the instructions in the story itself
- ...
- Profit!
PR Links and Envs
| Repository | PR Link | PR Env |
|---|---|---|
| Monolith | Monolith PR | Monolith Env |
| Portal | Portal Link | Portal Env |
View your CI Pipeline Execution ↗ for commit 9dd05882086cdd88d10adb8d0576dcf1338aaced.
☁️ Nx Cloud last updated this comment at 2025-04-21 15:04:44 UTC
![nx-cloud[bot] avatar](https://avatars.githubusercontent.com/in/80458?v=4 "Published by a pub.dev verified publisher"){kind=small}
📬Published Alpha Packages:
@codecademy/[email protected]
@codecademy/[email protected]
@codecademy/[email protected]
