Skip to content
This repository has been archived by the owner on Jun 26, 2020. It is now read-only.

Commit

Permalink
Merge pull request #43 from ckeditor/t/ckeditor5/1403
Browse files Browse the repository at this point in the history
Fix: The UI buttons should be marked as toggleable for better assistive technologies support (see ckeditor/ckeditor5#1403).
  • Loading branch information
oleq committed Aug 12, 2019
2 parents 7ed2745 + 8643cee commit 1645f26
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 1 deletion.
4 changes: 3 additions & 1 deletion src/highlightui.js
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,7 @@ export default class HighlightUI extends Plugin {
button.bind( 'isEnabled' ).to( command, 'isEnabled' );
button.bind( 'isOn' ).to( command, 'value', value => value === option.model );
button.iconView.fillColor = option.color;
button.isToggleable = true;
}
}

Expand Down Expand Up @@ -187,7 +188,8 @@ export default class HighlightUI extends Plugin {
// Holds last executed highlighter.
lastExecuted: startingHighlighter.model,
// Holds current highlighter to execute (might be different then last used).
commandValue: startingHighlighter.model
commandValue: startingHighlighter.model,
isToggleable: true
} );

// Dropdown button changes to selection (command.value):
Expand Down
8 changes: 8 additions & 0 deletions tests/highlightui.js
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ describe( 'HighlightUI', () => {

expect( button ).to.have.property( 'tooltip', 'Highlight' );
expect( button ).to.have.property( 'icon', markerIcon );
expect( button ).to.have.property( 'isToggleable', true );
} );

it( 'should have proper icons in dropdown', () => {
Expand Down Expand Up @@ -124,6 +125,13 @@ describe( 'HighlightUI', () => {
.to.deep.equal( [ false, true, false, false, false, false, undefined, false ] );
} );

it( 'should mark as toggleable all markers and pens', () => {
const toolbar = dropdown.toolbarView;

expect( toolbar.items.map( item => item.isToggleable ) )
.to.deep.equal( [ true, true, true, true, true, true, undefined, false ] );
} );

describe( 'toolbar button behavior', () => {
let button, buttons, options;

Expand Down

0 comments on commit 1645f26

Please sign in to comment.