[FIX] html_editor: prevent removal of oe_unremovable with link tools

Steps to reproduce:
- Open website builder
- Click on "Contact Us" button in the header
- Click on "Remove Link"
- Save
- Bug: Website is dead

Website relies on some elements to not be removed from the view in
order to function correctly. These elements are marked with the class
`oe_unremovable`. And the editor/builder is supposed to not remove them.

With the website builder refactor, the link tools from html_editor is
now used. But it lacked proper handling of `oe_unremovable`, which could
lead to removing a critical element of a website view

Website refactor: 9fe45e2
task-4367641

closes odoo#218453

X-original-commit: 881dcc0
Signed-off-by: Géry Debongnie <[email protected]>
Signed-off-by: Sébastien Blondiau (blse) <[email protected]>

Author: blse-odoo

addons/html_editor/static/src/main/link/link_plugin.js

@@ -164,6 +164,7 @@ export class LinkPlugin extends Plugin {
                     return (
                         !!linkEl &&
                         !this.isLinkImmutable(linkEl) &&
+                        !this.isUnremovable(linkEl) &&
                         isHtmlContentSupported(selection)
                     );
                 },
@@ -589,6 +590,7 @@ export class LinkPlugin extends Plugin {
             recordInfo: this.config.getRecordInfo?.() || {},
             canEdit:
                 !this.linkInDocument || !this.linkInDocument.classList.contains("o_link_readonly"),
+            canRemove: this.linkInDocument && !this.isUnremovable(this.linkInDocument),
             canUpload: this.config.allowFile,
             onUpload: this.config.onAttachmentChange,
             type: this.type || "",
@@ -799,10 +801,17 @@ export class LinkPlugin extends Plugin {
         this.dependencies.selection.setCursorEnd(linkElement);
     }
 
+    isUnremovable(linkEl) {
+        return this.getResource("unremovable_node_predicates").some((p) => p(linkEl));
+    }
+
     /**
      * Remove the link from the collapsed selection
      */
     removeLinkInDocument(link = this.linkInDocument) {
+        if (this.isUnremovable(link)) {
+            return;
+        }
         const cursors = this.dependencies.selection.preserveSelection();
         if (link && link.isContentEditable) {
             cursors.update(callbacksForCursorUpdate.unwrap(link));

addons/html_editor/static/src/main/link/link_popover.js

@@ -30,13 +30,15 @@ export class LinkPopover extends Component {
         LinkPopoverState: Object,
         recordInfo: Object,
         canEdit: { type: Boolean, optional: true },
+        canRemove: { type: Boolean, optional: true },
         canUpload: { type: Boolean, optional: true },
         onUpload: { type: Function, optional: true },
         allowCustomStyle: { type: Boolean, optional: true },
         allowTargetBlank: { type: Boolean, optional: true },
     };
     static defaultProps = {
         canEdit: true,
+        canRemove: true,
     };
     static components = { CheckBox };
     colorsData = [

addons/html_editor/static/src/main/link/link_popover.xml

@@ -139,7 +139,7 @@
                                         <a href="#" class="mx-1 o_we_edit_link text-dark" t-on-click="onClickEdit" title="Edit Link">
                                             <i class="fa fa-edit"></i>
                                         </a>
-                                        <a href="#" class="ms-1 o_we_remove_link text-dark" t-on-click="onClickRemove" title="Remove Link">
+                                        <a href="#" t-if="props.canRemove" class="ms-1 o_we_remove_link text-dark" t-on-click="onClickRemove" title="Remove Link">
                                             <i class="fa fa-chain-broken"></i>
                                         </a>
                                     </t>

addons/html_editor/static/tests/link/popover.test.js

@@ -80,6 +80,13 @@ describe("should open a popover", () => {
         expect(".o_we_edit_link").toHaveCount(1);
         expect(".o_we_remove_link").toHaveCount(1);
     });
+    test("link popover should not have the remove button when link is unremovable", async () => {
+        await setupEditor('<p>a<a class="oe_unremovable" href="http://test.test/">bcd[]</a>e</p>');
+        await expectElementCount(".o-we-linkpopover", 1);
+        expect(".o_we_copy_link").toHaveCount(1);
+        expect(".o_we_edit_link").toHaveCount(1);
+        expect(".o_we_remove_link").toHaveCount(0);
+    });
     test("link popover should not repositioned when clicking in the input field", async () => {
         await setupEditor("<p>this is a <a>li[]nk</a></p>");
         await waitFor(".o_we_href_input_link");

addons/html_editor/static/tests/toolbar.test.js

@@ -220,6 +220,14 @@ test("toolbar link buttons react to selection change", async () => {
     expect(".btn[name='unlink']").toHaveCount(1);
 });
 
+test("toolbar unlink button should not be present when link is unremovable", async () => {
+    await setupEditor('<p>a<a class="oe_unremovable" href="http://test.test/">bc[d]</a>e</p>');
+    await waitFor(".o-we-toolbar");
+    expect(".btn[name='link']").toHaveCount(1);
+    expect(".btn[name='link']").toHaveClass("active");
+    expect(".btn[name='unlink']").toHaveCount(0);
+});
+
 test("toolbar format buttons should react to format change", async () => {
     await setupEditor(
         `<div class="o-paragraph">[\ufeff<a href="http://test.com">\ufefftest.com\ufeff</a>\ufeff&nbsp;]</div>`