Accessibility violation: Form control with "textbox" role has no associated label

nehagokhale · November 6, 2023, 6:27pm

In codemirror 6, I see this accessibility violation for cm-content class.

How to add aria-label for basicSetup code editor?

marijn · November 6, 2023, 7:11pm

See this issue.

github.com/codemirror/dev

ARIA input fields do not have accessible names

opened 11:03AM - 11 Apr 23 UTC

closed 11:44AM - 11 Apr 23 UTC

Rich-Harris

### Describe the issue Since this is my first issue here, let me first congratu…late you on CodeMirror 6 — we recently switched https://learn.svelte.dev from Monaco to CodeMirror and it's been an absolute dream. While running a https://pagespeed.web.dev audit I saw the following accessibility warning relating to the CodeMirror editor: > **ARIA input fields do not have accessible names** > > When an input field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. [Learn more about input field labels](https://dequeuniversity.com/rules/axe/4.6/aria-input-field-name). You can easily reproduce it with the CodeMirror website: https://pagespeed.web.dev/analysis/https-codemirror-net/9g1le9r30c?form_factor=mobile I'm not certain what the correct fix would be, but perhaps something like an `aria-label` attribute with a (configurable?) value of 'CodeMirror editor' would address it. ### Browser and platform _No response_ ### Reproduction link https://pagespeed.web.dev/analysis/https-codemirror-net/9g1le9r30c?form_factor=mobile

nehagokhale · November 28, 2023, 10:45am

@marijn I don’t understand. How to add contentAttributes.of({"aria-label": "some meaningful label"}) to the div having cm-content class?