The Forem team recently opened an accessibility issue that requires a Chromebook for further investigation.
This issue highlights a problem where content that is animated from an
opacity: 0 is not read by the ChromeVox screen reader. ChromeVox is the built-in screen reading software for Chromebook.
Before a team member takes this issue, we wanted to open it up to the community for contributions.
We would love help from anyone who is interested in accessibility and has a Chromebook available for testing.
- This is a good first issue if you have never contributed to open source before.
- A potential solution is already included in the issue
- By helping us with this issue, you will help make Forem more accessible!
If this sounds like something you would like to work on please comment on the issue in GitHub👇.
Describe the bug
We recently became aware that ChromeVox (the in-built screen reading software for Chromebook) does not announce content that is set to have
opacity: 0 (even if the opacity is then later transitioned to opacity > 0 via e.g. an animation) (See https://twitter.com/sarasoueidan/status/1365696682529333253)
We have a few instances in the app where we use
opacity: 0 as the starting point for a transition - e.g. the
I haven't actually been able to reproduce this as it seems ChromeVox is only available as the native screen reader on Chromebooks.
Elements that fade or animate in should still be accessible to ChromeVox users. We can address this by adding a very small opacity to the elements that are currently 0, e.g.
We would be happy to answer any questions you have there!