Content editable screen reader compatibility
Open
Nobody has claimed this yet.
accessibility
bug
high
- Dominant language
- JavaScript
- Stars
- 659
- Forks
- 133
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 110
Description
During accessibility review the content editable element has shown quite a few issues with screen reader compatibility
- Plain content editable example seems to have the same issue https://codepen.io/juliushaertl/pen/xxWBpdw
- Sometimes text is cut up into parts or even letters, not fully recognized by screenreader
- Lists not recognized by screenreader, no info that it is a list
- Checkboxes not recognized by screenreader, and can only be checked/unchecked via mouse
- Either make them focussable (but does not work with Tab key) or add a keyboard shortcut to toggle
- Need to bring it up with ProseMirror / tiptap, is upstream issue https://tiptap.dev/guide/accessibility
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
No repository file or test is named. Start by reproducing the plain contenteditable case in the linked CodePen, then compare the editor behavior with the Tiptap accessibility guide and determine whether the reported text, list, and checkbox problems are upstream. Done should be defined for each listed screen-reader and keyboard behavior before implementation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100