[BUG] Problem with link and CKEditor

[kuhelbeher]

There is a problem with link and CKEditor. I enabled editable property for tags:

CKEDITOR.dtd.$editable.a = 1;

And when I doubleclick on the link it is editable, all works as it should. But when I finish editing and trying to edit it again I cannot do it. Can you help with this?

Please create a reproducible demo

[kuhelbeher]

@artf Here it is: https://codesandbox.io/s/link-ckeditor-8md7v?file=/src/index.js

[artf]

I see how the contenteditable remains false which is the reason of the bug but I'm not sure what is the cause. It might also be the CKEditor which prevents the propagation for some reason. If someone is willing to help I'd really appreciate it.

[longdoan7421]

The attribute contenteditable remains false, because CKEditor have already focused into the link when you started edit the second time. I don't know how to stop that behavior by CKEditor because I don't use CKEditor much. So I did a work around that I modify the focus function in grapesjs-plugin-ckeditor and move el.contentEditable = true to top

focus(el, rte) {
      el.contentEditable = true;

      // Do nothing if already focused
      if (rte && rte.focusManager.hasFocus) {
        return;
      }
      // el.contentEditable = true // <-- move this to top
      rte && rte.focus();
}

However, this work around has a drawback is that when you started edit the second time, it will show the link editor dialog of CKEditor. But I think that dialog is pretty useless in this case, I decided to disable opening that dialog when double click on link.

// Prevent open link editor dialog
rte.on(
    "doubleclick",
    function(evt) {
        const element = evt.data.element;
        if (element.is("a")) {
           evt.stop(); // don't do the other listeners
         }
     },
     null,
     null,
     1
);

@kuhelbeher you can see all the changes above in here.

[artf]

Closing this one as it's not related directly to the core