Cannot change existing images or links through Text Editor's image/link dialogs

This also applies to the link dialog. This is both sad and fortunate at the same time: sad because it's the same problem, fortunate because the code uses the same API calls, so if it worked there, it'd be more mysterious.

Apparently there is a magical, undocumented data-cke-saved-ATTRIBUTENAME thing you have to do. I found this only by talking to the CKEditor developers. They are going to document this.

Crosspost.

The CKEditor developers reviewed the code in #3 and found a problem with it.

The whole reason they are using this data-cke-saved-ATTRIBUTENAME thing is because browsers sometimes modify certain attribute values. For example the anchor's href and the image's src attributes contain URLs, and browsers may expand relative URLs to full URLs. IE has been known to modify an anchor's name attribute as well apparently.

Please verify that this works when reviewing (citing Wiktor Walc, CKEditor CTO):

Check CKEditor demo and change in wysiwyg area (in Firebug) the image to e.g.

<img alt="Saturn V carrying Apollo 11" data-cke-saved-src="http://b.cksource.com/a/1/img/samplexyz.jpg" src="http://b.cksource.com/a/1/img/sample.jpg" class="right">

(data-cke-saved-src != src)

Open the Image dialog, You will see that CKEditor will show the following URL in Image dialog: samplexyz.jpg (taken from saved-src)

(In other words, ensure that the drupallink and drupalimage plugins ignore any foo attribute for which there is an equivalent data-cke-saved-foo attribute.)

Also: you needn't worry, no data-cke-saved-SOMETHING attribute is ever allowed to end up in the resulting HTML.

Note that all this was reviewed by the CKEditor developers for correctness. So I think it should be fine if somebody can just confirm that this indeed fixes the problems :)

The root cause was that no change event was being triggered. At first I thought CKEditor itself was at fault, but then I realized this might have something to do with our custom link/image plugins.

So I started looking at CKEditor's own plugins. I noticed that all of them had two

editor.fire('saveSnapshot');

calls: one before making the change (because the user might have typed changed) and one after making the change (because the plugin has modified some of the HTML)

Our custom plugins were missing the second call to editor.fire('saveSnapshot');. This must've slipped through the cracks when quicksketch originally wrote this.

Note: the reason it worked fine on the back-end form is that there, the end result is saved; we don't listen to CKEditor's change event there, because there is no need to.

Also: great find Jesse :)

.