Unidirectional editor configuration -> filter settings syncing breaks when button name does not equal the command name

Which is this "Media" button? Is that a contrib module?

Please see https://vimeo.com/62160137 — note how the list of allowed HTML tags is being updated when you add new buttons. That should've happened for you as well.

Reproduced. This is what should happen: https://vimeo.com/67687240 … but it does not. The image button is enabled for the Restricted HTML format if you enable CKEditor, but it should remain disabled.

So this broke somehow somewhere along the way :( I'm betting it's one of the Backbone updates.

@Kingdutch: Thanks for your great bug report :) You can fix it by adding <img> to the list of allowed HTML tags, which you can find at the bottom of what you called the CKEditor configuration page.

3 problems

- both drop & drag do not sync.
- drupalimage doesn't match correct command ?

editor.addCommand('editdrupalimage', {

- bad split tag function ( fixed in my patch )

@reinmarpl — CKEditor developer — broke Drupal's automatic updating of text filter configuration in #2039163-32: Update CKEditor library to 4.4 — by changing the command from drupalimage to image. Drupal's JS that is able to do this automatic updating assumed that feature names == button names. But that's no longer true as of that moment. And apparently it was a wrong assumption all along.

This again shows why we very much need automated JS tests! :(

1. +++ b/core/modules/ckeditor/ckeditor.libraries.yml
   @@ -73,3 +73,5 @@ drupal.ckeditor.stylescombo.admin:
   +    # Ensure to run after ckeditor/drupal.ckeditor.admin.
   +    - ckeditor/drupal.ckeditor.admin
   

   This change fixes another bug: the fact that stylescombo's settings changes do not cause the allowed HTML tags to update as expected, because its event listener is created too early. This ensures it runs at the right time.

2. +++ b/core/modules/ckeditor/js/plugins/drupalimagecaption/plugin.js
   @@ -52,7 +52,7 @@
   -        widgetDefinition.allowedContent.img.attributes += ',data-align,data-caption';
   +        widgetDefinition.allowedContent.img.attributes += ',!data-align,!data-caption';
   

   This is also strictly speaking not fixing a bug here, but helps fix another issue: [LINK WILL FOLLOW].

   This really is just making things consistent with the drupalimage plugin, which does correctly specify the exclamation points for these required attributes.

   i.e. this ensures that CKEditor knows these attributes are required.

All other changes are directly there to fix the reported bug. The other changes are so small and are also in the area of "make setting syncing work again", so I figured I'd include them here.

#2549077: Allow the "Limit allowed HTML tags" filter to also restrict HTML attributes, and only allow a small whitelist of attributes by default is also blocked on this.

buttonsToFeatures[e.editor.getCommand(featureName).uiItems[0].name] = featureName;

Following doesn't work?

var command = e.editor.getCommand(featureName);
if (command) {
  buttonsToFeatures[command.uiItems[0].name] = featureName;
}

Otherwise, no problem with it.

Oops, yes, of course. Manually tested, this also works, as one would expect since the code is equivalent :)

All good

I'm assuming this will affect Entity Embed and URL Embed? I tried testing this and it's not adding drupal-entity to the list of allowed HTML tags for us.

#11: It'd only affect it:

• in the sense that'd it'd fix it again if it was previously working
• if Entity Embed/URL Embed's CKEditor *button* names are different from the CKEditor *command* names

This cannot ever adversely affect those modules.

If it's not yet working for Entity Embed/URL Embed, then it probably means their CKEditor plugins don't have the necessary metadata set yet. I'm happy to help you fix that.

Committed f1a0e7c and pushed to 8.0.x. Thanks!