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.

Sign up for GitHub

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

Jump to bottom

Toolbar is incorrectly marked up #1404

Closed
Comandeer opened this issue Dec 11, 2018 · 2 comments · Fixed by ckeditor/ckeditor5-ui#500
Closed

Toolbar is incorrectly marked up #1404

Comandeer opened this issue Dec 11, 2018 · 2 comments · Fixed by ckeditor/ckeditor5-ui#500
Assignees
@msamsel
Labels
domain:accessibility This issue reports an accessibility problem. domain:ui/ux This issue reports a problem related to UI or UX. type:bug This issue reports a buggy (incorrect) behavior.
Milestone
iteration 26

Comments

@Comandeer
Copy link
Member

Is this a bug report or feature request? (choose one)

🐞 Bug report

💻 Version of CKEditor

https://ckeditor.com/docs/ckeditor5/latest/examples/builds/classic-editor.html

📋 Steps to reproduce

  1. Inspect editor's toolbar.

✅ Expected result

Toolbar has proper label and [role=toolbar].

❎ Actual result

Toolbar does not have label and [role].

📃 Other details that might be useful

https://w3c.github.io/aria-practices/examples/toolbar/toolbar.html
@oleq oleq mentioned this issue Dec 11, 2018
Closed
@oleq oleq added candidate:backlog domain:ui/ux This issue reports a problem related to UI or UX. type:bug This issue reports a buggy (incorrect) behavior. labels Dec 11, 2018
@Reinmar Reinmar added this to the next milestone Mar 25, 2019
@msamsel msamsel mentioned this issue May 20, 2019
Merged
@msamsel
Copy link
Contributor

msamsel commented May 22, 2019

@Comandeer maybe you could help with creating names for toolbar's label.
There are 3 types of toolbars available:

  1. Classic: https://ckeditor.com/docs/ckeditor5/latest/examples/builds/classic-editor.html
  2. Balloon Toolbar: https://ckeditor.com/docs/ckeditor5/latest/examples/builds/balloon-editor.html
  3. Balloon-Block Toolbar: https://ckeditor.com/docs/ckeditor5/latest/examples/builds/balloon-block-editor.html

Should those toolbars have different names? Maybe with your experience in accessibility, you have some idea how those Toolbars could be named? I appreciate any help with that matter.

@Comandeer
Copy link
Member Author

I do not see a need to create different labels for each toolbar types – it would be needed only in a case of having more than one toolbar inside one editor.

Toolbar's label can be really generic, just to communicate that it's an editor's toolbar. ARIA Practices propose "Text formatting".

@mlewand mlewand added the domain:accessibility This issue reports an accessibility problem. label Jul 15, 2019
oleq added a commit to ckeditor/ckeditor5-highlight that referenced this issue Aug 13, 2019
@oleq
Other: Made the text highlight toolbar more accessible by providing a…
8524b35 
…n aria-label (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-alignment that referenced this issue Aug 13, 2019
@oleq
Other: Made the text alignment toolbar more accessible by providing a…
f0ceac0 
…n aria-label (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-ui that referenced this issue Aug 13, 2019
@oleq
Merge pull request #500 from ckeditor/t/ckeditor5/1404
bdede90 
Fix: All editor toolbars should come with the `role` and `aria-label` attributes. Closes ckeditor/ckeditor5#1404.

BREAKING CHANGE: The `ToolbarView` class requires the [editor locale](https://ckeditor.com/docs/ckeditor5/latest/api/module_utils_locale-Locale.html) to be passed into the constructor.
oleq added a commit to ckeditor/ckeditor5-widget that referenced this issue Aug 13, 2019
@oleq
Merge pull request #91 from ckeditor/t/ckeditor5/1404
aec5888 
Other: The widget toolbar should have a proper `aria-label` attribute (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-table that referenced this issue Aug 13, 2019
@oleq
Merge pull request #201 from ckeditor/t/ckeditor5/1404
b47a94f 
Other: The table widget toolbar should have a proper `aria-label` attribute (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-image that referenced this issue Aug 13, 2019
@oleq
Merge pull request #302 from ckeditor/t/ckeditor5/1404
13af143 
Other: The image widget toolbar should have a proper `aria-label` attribute (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-media-embed that referenced this issue Aug 13, 2019
@oleq
Merge pull request #88 from ckeditor/t/ckeditor5/1404
7a95064 
Other: The media widget toolbar should have a proper `aria-label` attribute (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-alignment that referenced this issue Aug 13, 2019
@oleq
Other: The text alignment toolbar should have a proper aria-label a…
3ed81de 
…ttribute (see ckeditor/ckeditor5#1404).
oleq added a commit to ckeditor/ckeditor5-highlight that referenced this issue Aug 13, 2019
@oleq
Other: The text highlight toolbar should have a proper aria-label a…
3ee2ea0 
…ttribute (see ckeditor/ckeditor5#1404).
@oleq oleq modified the milestones: nice-to-have, iteration 26 Aug 13, 2019
oleq added a commit to ckeditor/ckeditor5-theme-lark that referenced this issue Aug 13, 2019
@oleq
Tests: Adjusted the theme manual test to the latest changes in the To…
6f9bb18 
…olbarView API (see ckeditor/ckeditor5#1404).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@msamsel msamsel

Labels
domain:accessibility This issue reports an accessibility problem. domain:ui/ux This issue reports a problem related to UI or UX. type:bug This issue reports a buggy (incorrect) behavior.
Projects
None yet
Milestone
iteration 26
Development

Successfully merging a pull request may close this issue.

Add label for editor's toolbar ckeditor/ckeditor5-ui
5 participants
@Reinmar @Comandeer @oleq @mlewand @msamsel