orestbida / cookieconsent

:cookie: Simple cross-browser cookie-consent plugin written in vanilla js
https://playground.cookieconsent.orestbida.com/
MIT License
3.68k stars 388 forks source link

[Feat]: Focus transfer communication in the settings modal window #578

Open Equador1 opened 9 months ago

Equador1 commented 9 months ago

Description

Expected Behavior

Communicate the display of modal settings to screen readers for blind people.

Current Behavior

When users click or activate the “settings” button on the keyboard, nothing is communicated. Blind people cannot therefore know that a new modal is displayed on the screen. It's like the button doesn't do anything.

Steps to reproduce

Use NVDA Screenreader or VoiceOver, navigate with the keyboard to the button displaying the settings modal window and perform the action to display it.

The modal window is displayed, but nothing is communicated to the screen reader.

Proposed solution

Apply focus to the settings modal when opening like the close button does when returning to the consent modal. The consent text is automatically read by the screen reader when returning. Or Add a tabindex="0" attribute on the h2 title in the parameter modal window, which will make the title focusable and send focus in javascript to the title when opened. Or Inject a "Parameter window displayed" text into a live region in order to communicate the display of the modal parameter window to screen readers.

Additional details

Version

2.9.2

On which browser do you see the issue?

Firefox, Edge, Chrome