[CKEditor Dev] #16940: Clicking on the disabled toolbar button makes them enabled

[CKEditor]

#16940: Clicking on the disabled toolbar button makes them enabled
--------------------+----------------------
Reporter: ibm_rqm | Owner:
Type: Bug | Status: new
Priority: Normal | Component: General
Version: 4.5.3 | Keywords: IBM, RQM
--------------------+----------------------
== Steps to reproduce ==

1. Disable the CK Editor toolbar button using
button.setState(CKEDITOR.TRISTATE_DISABLED)
2. Click on the same button using mouse.

== Expected result ==
Nothing should happen and toolbar button should stay disabled.

== Actual result ==
Clicking the toolbar button, enables it.

== Other details (browser, OS, CKEditor version, installed plugins) ==
CKEditor version 4.5.3.1
Chrome 52
Windows 7

I have debugged the CKEditor code and CKEditor doesn't check the state of
the button before performing the Click action. This issue doesn't occur
for combo boxes (Format, Font, Size) as CKEditor checks for its state
before performing the action.

--
Ticket URL: <http://dev.ckeditor.com/ticket/16940>
CKEditor <http://ckeditor.com/>
The text editor for the Internet

[CKEditor]

#16940: Clicking on the disabled toolbar button makes them enabled

----------------------+----------------------

Reporter: ibm_rqm | Owner:
Type: Bug | Status: new

Priority: Normal | Milestone:
Component: General | Version: 4.5.3
Resolution: | Keywords: IBM, RQM
----------------------+----------------------

Comment (by j.swiderski):

Dropdowns are not related to commands so they can only be disabled through
{{{ui}}. The problem with CKEditor default dropdowns is they are all
context sensitive so as soon as you hit any dropdown matching style, the
dropdown will get enabled again.
{{{
editor.on( 'instanceReady', function( evt ){
editor.ui.instances.FontSize.setState(CKEDITOR.TRISTATE_DISABLED);
});
}}}

The above workaround will only work on custom dropdowns which do not check
current selection in editor contents.

--
Ticket URL: <http://dev.ckeditor.com/ticket/16940#comment:1>

[CKEditor]

#16940: Clicking on the disabled toolbar button makes them enabled

----------------------+----------------------

Reporter: ibm_rqm | Owner:
Type: Bug | Status: new

Priority: Normal | Milestone:
Component: General | Version: 4.5.3
Resolution: | Keywords: IBM, RQM
----------------------+----------------------

Comment (by j.swiderski):

You should not be using buttons but commands. Setting below code on editor
start, disables the buttons but there are some problems:

1. Image and Table plugins are not selection sensitive so they will be
disabled.
2. The panel button like Background Color can only be disabled through
{{{ui}}} because there is no command related to it. Again, it is not
context/selection sensitive so this code will work.
3. Dropdowns are not related to commands so they can only be disabled

through {{{ui}}}. The problem with CKEditor default dropdowns is they are

all context/selection sensitive so as soon as you hit any dropdown
matching style, the dropdown will get enabled again. Please also see:
#13852
4. The same goes for buttons like bold. You can disable them by disabling
the command but as soon as you focus bold text, button will get enabled
again.

{{{
editor.on( 'instanceReady', function( evt ){
editor.ui.instances.FontSize.setState(CKEDITOR.TRISTATE_DISABLED);

editor.getCommand('bold').setState( CKEDITOR.TRISTATE_ON );

editor.getCommand('image').setState( CKEDITOR.TRISTATE_DISABLED );
editor.getCommand('table').setState( CKEDITOR.TRISTATE_DISABLED );
editor.ui.instances.BGColor.setState(CKEDITOR.TRISTATE_DISABLED);
});
}}}

I think the main problem here is that we are missing some configuration
setting or method or TRISTATE_xxx option which could disable the buttons
(even these selection sensitive ones) permanently. Additionally it could
also disable dropdown and panel buttons which are not related to any
command.

--
Ticket URL: <http://dev.ckeditor.com/ticket/16940#comment:1>