Selection ranges in webkit (Safari/Chrome)

Question

I\'m using a content-editable iframe to create a syntax-highlighter in javascript and one of the most important things is to be able to indent code properly.

The fol

Answer 1

Both Firefox and WebKit's Range objects comply fully with the DOM Range spec. If Firefox has more properties then they will be Mozilla's own extensions, but generally the spec provides everything you could need.

Anyway, the problem is that you need to reselect the range after altering it:

// Create one indent character
var sel = window.getSelection();
var range = sel.getRangeAt(0);
var newTextNode = document.createTextNode(Language.tabChar);
range.insertNode(newTextNode);
range.setStartAfter(newTextNode);
sel.removeAllRanges();
sel.addRange(range);

Note that this will not work in early versions of Safari (prior to version 3, I think), because its selection object does not support getRangeAt. There is a workaround for this I can provide if you need it.