backdrop-contrib / colorbox

A port of the Colorbox Drupal 7 module to BackdropCMS
GNU General Public License v2.0
3 stars 7 forks source link

Colorbox/DOMPurify breaks CKEditor's "insert link" functionality. #45

Open kiwiarthur opened 1 year ago

kiwiarthur commented 1 year ago

Using Colorbox on Backdrop CMS, I encountered a problem with being unable to open the link edit dialog box while in Ckeditor. With the help of the good folks on forum.backdropcms.org we narrowed it down to the Colorbox module and then further to "Allow HTML in Colorbox captions" setting. If enabled it breaks your ability to edit links (at least in Ckeditor), if disabled, the ability to edit links comes back.

It is believed this indicates a malformed html tag being inserted by the ajax response into the DOM.

The javascript error reported is: Uncaught SyntaxError: Unexpected token '<' at eval () at jquery.js?v=1.12.4:2:2651 at Function.globalEval (jquery.js?v=1.12.4:2:2662) at text script (jquery.js?v=1.12.4:4:27423) at Xb (jquery.js?v=1.12.4:4:18945) at y (jquery.js?v=1.12.4:4:22407) at c (jquery.js?v=1.12.4:4:26927) at Object.send (jquery.js?v=1.12.4:4:27033) at Function.ajax (jquery.js?v=1.12.4:4:22182) at n._evalUrl (jquery.js?v=1.12.4:4:23293)

I hope this is sufficient information for you - this is the first time I have created an issue.... it appears to affect Microsoft Edge, Firefox and Chrome browsers.

Firefox Console Export Chrome Console Log

argiepiano commented 1 year ago

@yorkshire-pudding and I helped @kiwiarthur troubleshoot the problem. Apparently, the culprit here is DOMpurify. The issue can be reproduced as follows:

  1. Install Colorbox
  2. Visit the settings page and select "Allow HTML in Colorbox captions" and "Enable Colorbox inline" and "Enable Colorbox load"
  3. Go to the node creation page (e.g. create Page)
  4. In the body field, click the "insert link" icon of CKeditor

Nothing opens when you do that. The Javascript console shows the errors posted above.

My guess is that DOMPurify is doing something to the page that prevents loading the link insertion modal window.

argiepiano commented 1 year ago

I also suggest changing the title of this issue to something like "Colorbox/COMPurify breaks CKEditor's "insert link" functionality."

I don't have the privileges to change the title... perhaps @kiwiarthur as the author can do that?

kiwiarthur commented 1 year ago

Title edited as suggested.

nattywebdev commented 1 year ago

I had this problem (inserting a link in ckeditor) and found it was caused by the DOMpurify switched on via the Colorbox option 'Allow html in Colorbox captions'. Disabled that option and I can now insert links again. Mentioned here as a workaround.