react-spectrum
react-spectrum copied to clipboard
fix(accessibility): Field announce error message for focused field
Closes #8328
✅ Pull Request Checklist:
- [x] Included link to corresponding React Spectrum GitHub Issue #8328.
- [x] Added/updated unit tests and storybook for this change (for new code or code which already has tests).
- [x] Filled out test instructions.
- [ ] Updated documentation (if it already exists for this component).
- [x] Looked at the Accessibility Practices for this feature - Aria Practices
📝 Test Instructions:
- Open the Spectrum 2 Preview > Form > Example storybook example.
- With a screen reader running, like VoiceOver on macOS or NVDA on Windows, navigate to move focus to the Email field, which is the third field in the form.
- Enter an invalid email value, like "admin", and press Enter to trigger validation by submitting the form.
- The screen reader should announce the error message that renders politely.
- Type some more to modify the value to another invalid value like, "admin@", then Tab or Shift+Tab to blur the input, which again trigger validation.
- After the screen reader announces the input that receives keyboard focus, it should announce "Please review Email field: Please enter a part following '@'. 'admin@' is incomplete," with the name and error message for the Email field that was blurred.
🧢 Your Project:
Accessibility/SUSI/Adobe