Screen reader text is not overridable, therefore not translatable
- Dominant language
- TypeScript
- Stars
- 53
- Forks
- 63
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 15
Description
## Summary
The application I am building will be used by non-English speakers. This means that all strings in the application must be translatable. I propose to add props to all elements that contain screen-reader, and other, text that allows for that text to be overridden.
I am *explicitly not* proposing that support for any specific translation framework is implemented.
## 💬 Description
For every component that has screen reader only text, or other text, new props are added to allow that text to be overridden.
## 💰 Use value
Where applications need to be used by non-English speakers, this will allow accessibility features to remain fully functional.
## 📝 Acceptance Criteria
*Given* a component is used that currently contains screen reader text
*When* no alternative text is provided via a prop
*Then* the original default text is used
*Given* a component is used that currently contains screen reader text
*When* alternative text is provided via a prop
*Then* that text is displayed instead
## 🧾 Guidance
An index of default text strings would be useful to bootstrap translations. Providing YAML files with those strings pre-translated into some languages would also be handy, but the exact format of those files will vary by application, so has less value. I also don't think that having the text translated into however many languages should be a requirement for inclusion of new components, application developers will have their application specific strings to translate anyway.
Contributor guide
Research direction
Start by inventorying the components that contain screen-reader or other embedded text, then inspect their component sources and existing accessibility coverage. The work is done when each relevant component preserves its default text when no override is supplied and displays the supplied text when one is provided.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend, internationalization
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100