Opened 3 years ago

Last modified 10 months ago

#11701 confirmed Bug

Richcombo breaks on HTML entities in HTML formatted values

Reported by: spuymore Owned by:
Priority: Normal Milestone:
Component: General Version: 4.0
Keywords: Cc:

Description (last modified by Jakub Ś)

  • configure an editor with latest strinsert addon from https://github.com/57u/custom-dropdown-ckeditor4/commit/32bb75a5fc5129722ddd32637e8639be2735cbb5 (http://ckeditor.com/addon/strinsert is not up to date) using following settings:
    config.extraPlugins = 'strinsert';
    config.strinsert_strings = [{'name': 'test', 'value': 'html entities like <, &gt and & wont work'}];
    
  • open the editor, select 'test' from the 'Insert' dropdown in the toolbar and you'll get a JavaScript error like:
    • Chrome:
      Uncaught TypeError: Cannot call method 'hasClass' of null ckeditor.js:746
      Uncaught TypeError: Cannot call method 'hasClass' of null ckeditor.js:746
      CKEDITOR.ui.listBlock.CKEDITOR.tools.createClass.proto.isMarked ckeditor.js:746
      CKEDITOR.ui.listBlock.CKEDITOR.tools.createClass.proto.toggle ckeditor.js:744
      (anonymous function) ckeditor.js:742
      (anonymous function) ckeditor.js:27
      CKEDITOR.tools.callFunction ckeditor.js:27
      onclick
      
    • IE:
      Error: Unable to get property 'hasClass' of undefined or null reference
      

Edit: Please see comment:5 for quick summary :)

Change History (9)

comment:1 Changed 3 years ago by spuymore

Version: 4.3.34.3.4

comment:2 Changed 3 years ago by spuymore

Summary: Richcombo seems to break on html entities in valuesRichcombo breaks on html entities in values
Version: 4.3.44.3.5 (GitHub - master)

comment:3 Changed 3 years ago by Jakub Ś

Resolution: invalid
Status: newclosed
Version: 4.3.5 (GitHub - master)

This is a DUP of #10638.

Please use

{'name': 'test', 'value': 'html entities like <, > and & won\'t work'}

and insertText because you are not inserting HTML in this case.

comment:4 Changed 3 years ago by spuymore

Summary: Richcombo breaks on html entities in valuesRichcombo breaks on HTML entities in HTML formatted values

But that's exactly the point, I want to insert HTML, not text!

So please reopen considering I would want to insert HTML with HTML entities in it:

config.strinsert_strings = [{'name': 'test', 'value': '<div>html entities like &lt;, &gt and &amp; wont work</div>'}];

The above fails with given errors but HTML without entities works, e.g.:

config.strinsert_strings = [{'name': 'test', 'value': '<div>this html without entities inserts fine!</div>'}];

comment:5 Changed 3 years ago by Jakub Ś

Description: modified (diff)
Resolution: invalid
Status: closedreopened
Version: 4.0

I want to insert HTML, not text!

Plugin name is kind of misleading.

You are right, when one wants to insert HTML with entities then dropdown breaks.

Problem can be reproduced in all browsers from CKEditor 3.0.

comment:6 Changed 3 years ago by Jakub Ś

Status: reopenedconfirmed

comment:7 Changed 3 years ago by Piotrek Koszuliński

I assume that this is a similar problem to what we found recently in the #11865 and #11811. It's very hard to encode attribute when serializing some uncontrollable value to an HTML string. Therefore, we're not planning to work on this issue for now.

The second reason why we're not going to work on this is that there is a trivial workaround. Instead of passing HTML to the option's value, pass there a key to an object which will store those HTML strings.

comment:8 in reply to:  7 Changed 3 years ago by spuymore

The second reason why we're not going to work on this is that there is a trivial workaround. Instead of passing HTML to the option's value, pass there a key to an object which will store those HTML strings.

Thanks, excellent idea, didn't think about that. I have just succesfully implemented a patch for the str_insert plugin using this workaround, will provide it to the owner.

comment:9 Changed 10 months ago by Jakub Ś

Another approach is doing what stylescombo plugin does. In styles.js you just define tag names, classes styles etc. Next inside the plugin you create styles https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/stylescombo/plugin.js#L23-L59 and populate them into dropbox - https://github.com/ckeditor/ckeditor-dev/blob/master/plugins/stylescombo/plugin.js#L79-L89

The only problem is that styles.js is an external file which gets loaded: https://github.com/ckeditor/ckeditor-dev/blob/master/core/style.js#L2022 and style definitions from that file are then processed when appropriate event is fired. You don’t need to fire any event. You can keep for example your HTML pieces (element name class etc.) in some ckeditor config option (if it is used on HTML directly it can be dynamic) and change them into styles once plugin is loaded.

Note: See TracTickets for help on using tickets.
© 2003 – 2017 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy