execCommand marked as obsolete

[peterpeterparker]

Affected part of DeckDeckGo

• Studio
• Web Components (inline-editor and highlight-code)

Feature Description

Document.execCommand() has been marked as obsolete. Therefore, before not supported by the browser anymore (I'm guessing that it ain't gonna be tomorrow but someday), we should replace the usages.

[peterpeterparker]

I'm on it. Got a small proof of concept.

if (this.selection.anchorNode.nodeType === 3) {
      const content = this.selection.anchorNode.nodeValue;

      const a = document.createTextNode(content.substring(0, this.selection.anchorOffset));
      const b = document.createTextNode(content.substring(this.selection.focusOffset));

      const span = document.createElement('span');
      span.style.backgroundColor = 'yellow';
      span.innerHTML = this.selection.toString();

      if (this.selection.focusNode.nextSibling === null) {
        this.selection.anchorNode.parentElement.appendChild(a);
        this.selection.anchorNode.parentElement.appendChild(span);
        this.selection.anchorNode.parentElement.appendChild(b);
      } else {
        this.selection.anchorNode.parentElement.insertBefore(b, this.selection.focusNode.nextSibling);
        this.selection.anchorNode.parentElement.insertBefore(span, this.selection.focusNode.nextSibling);
        this.selection.anchorNode.parentElement.insertBefore(a, this.selection.focusNode.nextSibling);
      }

      this.selection.anchorNode.parentElement.removeChild(this.selection.anchorNode);
    }