Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JAWS: The color picker in Table properties is labelled as "Unlabeled 0" #11895

Closed
Mgsy opened this issue Jun 8, 2022 · 2 comments · Fixed by #11963
Closed

JAWS: The color picker in Table properties is labelled as "Unlabeled 0" #11895

Mgsy opened this issue Jun 8, 2022 · 2 comments · Fixed by #11963
Assignees
Labels
domain:accessibility This issue reports an accessibility problem. intro Good first ticket. squad:features Issue to be handled by the Features team. support:2 An issue reported by a commercially licensed client. type:bug This issue reports a buggy (incorrect) behavior.

Comments

@Mgsy
Copy link
Member

Mgsy commented Jun 8, 2022

📝 Provide detailed reproduction steps (if any)

  1. Insert table.
  2. Click Table properties.
  3. Start JAWS, use CTRL+Insert+C to get the available list of controls

✔️ Expected result

The color picker is labelled properly.

❌ Actual result

The color picker is labelled as "Unlabeled 0"


If you'd like to see this fixed sooner, add a 👍 reaction to this post.

@Mgsy Mgsy added type:bug This issue reports a buggy (incorrect) behavior. support:2 An issue reported by a commercially licensed client. domain:accessibility This issue reports an accessibility problem. squad:features Issue to be handled by the Features team. labels Jun 8, 2022
@mlewand
Copy link
Contributor

mlewand commented Jun 15, 2022

The color dropdown button has a following markup:

<button
	class="ck ck-button ck-off ck-dropdown__button ck-input-color__button"
	type="button"
	tabindex="-1"
	aria-labelledby="ck-editor__aria-label_e3335aa5a5c2924ea39541dacfea32bb9"
	aria-haspopup="true">

Where aria-labelledby leads to an empty element (so there's nothing to read).

Whereas for sighted users it has a label:

The same label ("Color picker") should be given to the screen reader.

@mlewand mlewand added the intro Good first ticket. label Jun 15, 2022
@CKEditorBot CKEditorBot added the status:planned Set automatically when an issue lands in the "Sprint backlog" column. We will be working on it soon. label Jun 15, 2022
@mateuszzagorski mateuszzagorski self-assigned this Jun 22, 2022
@CKEditorBot CKEditorBot added status:in-progress Set automatically when an issue lands in the "In progress" column. We are working on it. and removed status:planned Set automatically when an issue lands in the "Sprint backlog" column. We will be working on it soon. labels Jun 22, 2022
@mlewand
Copy link
Contributor

mlewand commented Jun 27, 2022

@Mgsy can you confirm whether fix in #11963 fixes this issue?

mlewand added a commit that referenced this issue Jun 29, 2022
…s-color-picker

Fix (table): Added a proper label for color buttons in the table properties panel so that it is available for screen readers. Closes #11895.
@CKEditorBot CKEditorBot removed the status:in-progress Set automatically when an issue lands in the "In progress" column. We are working on it. label Jun 29, 2022
@CKEditorBot CKEditorBot added this to the iteration 55 milestone Jun 29, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
domain:accessibility This issue reports an accessibility problem. intro Good first ticket. squad:features Issue to be handled by the Features team. support:2 An issue reported by a commercially licensed client. type:bug This issue reports a buggy (incorrect) behavior.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants