WYSIWG: Improved handling of cross-block code block creation

- Updated code content to get specific text selection instead of using
  node-based handling which could return the whole document when
  multiple top-level nodes were in selection.
- Simplified how code gets applied into the page to not be node based
  but use native editor methods to replace the selection. Allows
  creation from half-way through a block.

Tested on chrome+Firefox on Fedora 35.
Builds upon changes in #3246.
For #3200.

resources/js/components/wysiwyg-editor.js

@@ -136,18 +136,14 @@ function codePlugin() {
         const selectedNode = editor.selection.getNode();
 
         if (!elemIsCodeBlock(selectedNode)) {
-            const providedCode = editor.selection.getNode().innerText;
+            const providedCode = editor.selection.getContent({format: 'text'});
             window.components.first('code-editor').open(providedCode, '', (code, lang) => {
                 const wrap = document.createElement('div');
                 wrap.innerHTML = `<pre><code class="language-${lang}"></code></pre>`;
                 wrap.querySelector('code').innerText = code;
 
-                editor.formatter.toggle('pre');
-                const node = editor.selection.getNode();
-                editor.dom.setHTML(node, wrap.querySelector('pre').innerHTML);
-                editor.fire('SetContent');
-
-                editor.focus()
+                editor.insertContent(wrap.innerHTML);
+                editor.focus();
             });
             return;
         }