getSelection & surroundContents en varias etiquetas

Tengo un script que cambia el color de fondo del texto que se ha seleccionado. Sin embargo, me encuentro con un problema cuando el texto se selecciona en varios elementos / etiquetas.

El código que tengo es:

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

Y el error que se muestra es:

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

Creo que esto tiene que ver con la función getRange (), aunque no estoy muy seguro de cómo proceder, ya que soy un principiante en javascript.

¿Hay alguna otra forma en que pueda replicar lo que estoy tratando de lograr?

Muchas gracias.

Respuestas a la pregunta(2)

Su respuesta a la pregunta