[IMP] web_editor: embedded_view requirements

Add a custom class in web_editor to prevent the selection in an embedded view
(or another bloc using that class) from being moved out in multiple situations.
(onselectionchange, onkeyup, onmouseup, ...).

This is related to the block being contentEditable=False.

Prepares Task-2796156
Prepares odoo/enterprise#29423

X-original-commit: 86c14110294c5ff986ee88bb010dbc7513bf8b01
Part-of: odoo/odoo#101694

addons/web_editor/static/src/js/editor/odoo-editor/src/OdooEditor.js

@@ -3290,6 +3290,11 @@ export class OdooEditor extends EventTarget {
      */
     _onSelectionChange() {
         const selection = this.document.getSelection();
+        const anchorNode = selection.anchorNode;
+        if (anchorNode && closestElement(anchorNode, '.oe-blackbox')) {
+            return;
+        }
+
         if (
             !this.editable.contains(selection.anchorNode) &&
             !this.editable.contains(selection.focusNode)
@@ -3499,6 +3504,12 @@ export class OdooEditor extends EventTarget {
      * @private
      */
     _handleCommandHint() {
+        const selection = this.document.getSelection();
+        const anchorNode = selection.anchorNode;
+        if (anchorNode && closestElement(anchorNode, '.oe-blackbox')) {
+            return;
+        }
+
         const selectors = {
             BLOCKQUOTE: 'Empty quote',
             H1: 'Heading 1',
@@ -3567,12 +3578,16 @@ export class OdooEditor extends EventTarget {
     }
 
     _fixSelectionOnContenteditableFalse() {
+        const selection = this.document.getSelection();
+        const anchorNode = selection.anchorNode;
+        if (anchorNode && closestElement(anchorNode, '.oe-blackbox')) {
+            return;
+        }
         // When the browser set the selection inside a node that is
         // contenteditable=false, it breaks the edition upon keystroke. Move the
         // selection so that it remain in an editable area. An example of this
         // case happend when the selection goes into a fontawesome node.
 
-        const selection = this.document.getSelection();
         if (!selection.rangeCount) {
             return;
         }

addons/web_editor/static/src/js/wysiwyg/wysiwyg.js

@@ -286,6 +286,13 @@ const Wysiwyg = Widget.extend({
         this.showTooltip = true;
         this.$editable.on('dblclick', mediaSelector, function () {
             self.showTooltip = false;
+
+            const selection = self.odooEditor.document.getSelection();
+            const anchorNode = selection.anchorNode;
+            if (anchorNode && closestElement(anchorNode, '.oe-blackbox')) {
+                return;
+            }
+
             const $el = $(this);
             let params = {node: this};
             $el.selectElement();
@@ -1740,6 +1747,12 @@ const Wysiwyg = Widget.extend({
      * Update any editor UI that is not handled by the editor itself.
      */
     _updateEditorUI: function (e) {
+        let selection = this.odooEditor.document.getSelection();
+        const anchorNode = selection.anchorNode;
+        if (anchorNode && closestElement(anchorNode, '.oe-blackbox')) {
+            return;
+        }
+
         this.odooEditor.automaticStepSkipStack();
         // We need to use the editor's window so the tooltip displays in its
         // document even if it's in an iframe.
@@ -1787,7 +1800,7 @@ const Wysiwyg = Widget.extend({
         this.toolbar.$el.find('#colorInputButtonGroup, #create-link').toggleClass('d-none', isInMedia && !$target.is('.fa'));
         this.toolbar.$el.find('.only_fa').toggleClass('d-none', !$target.is('.fa'));
         // Hide the create-link button if the selection spans several blocks.
-        const selection = this.odooEditor.document.getSelection();
+        selection = this.odooEditor.document.getSelection();
         const range = selection && selection.rangeCount && selection.getRangeAt(0);
         const $rangeContainer = range && $(range.commonAncestorContainer);
         const spansBlocks = range && !!$rangeContainer.contents().filter((i, node) => isBlock(node)).length;