Issue with Range: Browser differences regarding node boundaries

20 views
Skip to first unread message

Tobi

unread,
May 18, 2014, 5:41:16 AM5/18/14
to ra...@googlegroups.com
Hi Tim,

first thing I have to say: I am very happy about the work you are doing (I would not like to do it ;-)).

I am struggling with the range object (startContainer, endContainer, startOffset and endOffset) in different browsers using rangy 1.3.

Please have a look at the following example:

<div id="text" contenteditable="true">

Das ist ein <span class="italic"><span class="bold">Test</span>, der</span> nicht viel Sinn macht.

</div>

Selecting "Test" with the mouse, the result in different browser alters (Chrome, Firefox).
While Chrome returns the same textnode ("Test") as startContainer and as endContainer and the corresponding offsets (0 and 4) corresponding to the length of the selection, Firefox would return the node before the selected textnode as startContainer and its full offset (corresponding to its length) and would then return the following node as endContainer with the offset 0.

Using rangy.getSelection().getRangeAt(0) I get a RangyRange, right? Couldn't I expect the same behaviour from all browser?

I am trying to write a generic TextEditor. Now I discovered your CssClassApplierModule which perhaps solves my problems (if I don't have do deal with ranges anymore myself).

As far as I understood, I can
  • add arbitrary cssClasses to the selection using the span element by default and remove them
  • by using toggleSelection, adding and removing of spans with classes is handled automatically

This works fine as far as I have seen. This way I don't have to deal with range objects directly.

There is one thing I have to do: adding atrributes (data-) to the selection. This works with rangy 1.3 (http://stackoverflow.com/questions/20376043/elementproperties-of-rangy-doesnt-work).

My question: each time, I would have to assign a different value to the assigned attribute. Do I have to create another CssClassApplier each time (only to change its elementAttributes)?

Does isAppliedToSelection() only consider the assigned class or does the assigned attribute value also matter?


Thank you very much for your work and your answer. I you are interested in some code (I have tried to write an abstraction layer for the node boundary issue) I would deliver that gladly.

kind regards

Tobias




Reply all
Reply to author
Forward
0 new messages