getSelection & surroundContents em várias tags

Eu tenho um script que altera a cor de fundo do texto que foi selecionado. No entanto, estou encontrando um problema quando o texto é selecionado em vários elementos / tags.

O código que eu tenho é:

var text = window.getSelection().getRangeAt(0);
var colour = document.createElement("hlight");
colour.style.backgroundColor = "Yellow";
text.surroundContents(colour);

E o erro que está sendo produzido é:

Error: The boundary-points of a range does not meet specific requirements. =
NS_ERROR_DOM_RANGE_BAD_BOUNDARYPOINTS_ERR
Line: 7

Eu acredito que isso tem a ver com a função getRange (), embora eu não tenha muita certeza de como proceder, pois sou iniciante em javascript.

Existe alguma outra maneira de replicar o que estou tentando alcançar?

Muito Obrigado.

questionAnswers(2)

yourAnswerToTheQuestion