Using simple inserHtml in a text transform plugin causing errors in editor

[Jason Pickard]

Ok so I have started out with the text transform plugin located here: ​http://ckeditor.com/addon/texttransform

That plugin really does not work well with CKEDITOR 4.4.6. So for functions that transforms text to upper case, I have changed the code in plugin.js to this:

editor.addCommand('transformTextToUppercase',

{

exec : function( editor ) {

var selection = editor.getSelection();

var selected_text = selection.getSelectedText();

if (selected_text.length > 0) {

editor.insertHtml(selected_text.toUpperCase());

}

}

});

Where this basically works, I get a index size error when insertHtml is called. The traceback is below:

Uncaught IndexSizeError: Failed to execute 'setEnd' on 'Range': The offset 69 is larger than or equal to the node's length (63).

ckeditor.js:410 CKEDITOR.dom.selection.selectRanges ckeditor.js:403 CKEDITOR.dom.selection.unlockplugin.js?t=EAPE:36 editor.addCommand.execckeditor.js:177 execckeditor.js:244 CKEDITOR.tools.extend.execCommandckeditor.js:620 CKEDITOR.tools.extend.clickckeditor.js:621 d.executeckeditor.js:621 (anonymous function)ckeditor.js:27 (anonymous function)ckeditor.js:27 CKEDITOR.tools.callFunctionckeditor.php:1 onclick

Please advise

[Jakub Ś]

Such questions should be asked IMO on forum and not on bug tracker.

About this case. I haven't been able to reproduce it but I think it should be left as it is. Using walker is the best way to go. Another thing that might work is using ​http://docs.ckeditor.com/#!/api/CKEDITOR.editable-method-insertText instead of inserting HTML because what you do here is modifying the text.

[Jason Pickard]

Well I can reproduce almost instantly with either insertHtml or insertText I get the same issue ever time. Where I get that the dom walker would probably be the best way to do this, when I perform editor.getSelection.getRanges(), on selected text the ranges really do not match up to what was selected.

Test to reproduce initial *bug* reported.

1. Create a simple html file put an id on the body.
2. create the editor div with js

var div = document.createElement("textarea"); div.id = 'ck_editor';

document.getElementById("editor_body").appendChild(div);

CKEDITOR.replace('ck_editor', config_json);

3. Set text in editor programmatically with editor.setData('your data'). Make sure the data you insert has several <p> tags worth of data.
4. Highlight a whole line of text and change case with code above, get the error almost every time.

When I tried to perform the above using the dom walker. I would get the range to perform my changes on via editor.getSelection.getRanges(), then I would set up a dom walker based on the range returned. This function does not pull back the selected range reliably at all in my opinion. Sometimes it will bring back the range exactly right for what is selected, sometimes it brings back the whole <p></p> that the selected text lives in, and if you select text that has spaces in it and some of those spaces are nbsp html entities the ranges you get are completely random. So doing that way was incredibly complex trying to work around the inconsistency in what the ranges coming back to use for the dom walker.

[Piotrek Koszuliński]

Pushed ​branch:t/12861 with a manual test with the code which you reported - ​https://github.com/cksource/ckeditor-dev/commit/c8486123b48078ce10d2495690ffac6aaaa6f7c1

I tried to reproduce any issue, but everything works finer. We can reopen this ticket, but we need a working sample and description how to reproduce this issue.

As for the insertText or insertHtml usage - both are fine. It just depends on what you want to do.

[Piotrek Koszuliński]

PS. The version is a information for us on which version this issue was introduced.

[Jakub Ś]

@japickard just like @Reinmar has written. Please prepare reduced HTML file that can be put in samples folder of default CKEditor (freshly downloaded from our page) and will show this issue.

Also step by step scenario explaining how to reproduce this problem or a screen cast are more than welcome here.

Btw.

• Are you using predefined package (full, standard) or some custom package with third-party plugins included?
• Have you perhaps made any CKEditor code modifications that might influence this issue?
• Finally; in which browser you get this error and does this browser have any custom plugins that might cause this behaviour. Chrome plugins are known to break JavaScript applications.

[Jason Pickard]

• I am using a predefined package the full one.
• I have not made ANY code modifications to the core editor code. I have a custom plugin that started out as the text transform plugin that is in your website but I heavily modified the plugin.js file

• I have seen the insertHTML error in Chrome, IE and Firefox on both Mac and Windows platforms.

I will get the HTML and JS together for this. I plan on including the simple version of the text transform plugin and the complex version that I put together that basically works except on one use case.