restore t-att- to their initial value when destroy

addons/website/static/src/core/colibri.js

@@ -7,8 +7,7 @@ let owl = null;
 let Markup = null;
 
 export class Colibri {
-    constructor(app, I, el, env) {
-        this.app = app;
+    constructor(I, el, env) {
         this.el = el;
         this.I = I;
         this.update = null;
@@ -111,7 +110,12 @@ export class Colibri {
                 this.addListener(nodes, ev, value);
             } else if (directive.startsWith("t-att-")) {
                 const attr = directive.slice(6);
-                this.dynamicAttrs.push([nodes, attr, value]);
+                const initialValues = new Map();
+                for (let node of nodes) {
+                    const value = node.getAttribute(attr);
+                    initialValues.set(node, value);
+                }
+                this.dynamicAttrs.push([nodes, attr, value, initialValues]);
             } else if (directive === "t-out") {
                 this.tOuts.push([nodes, value]);
             } else {
@@ -140,6 +144,19 @@ export class Colibri {
     }
 
     destroy() {
+        // restore t-att to their initial values
+        for (let dynAttrs of this.dynamicAttrs) {
+            const [nodes, attr, _, initialValues] = dynAttrs;
+            for (let node of nodes) {
+                const initialValue = initialValues.get(node);
+                if (initialValue) {
+                    node.setAttribute(attr, initialValue);
+                } else {
+                    node.removeAttribute(attr);
+                }
+            }
+        }
+
         for (let cleanup of this.cleanups.reverse()) {
             cleanup();
         }
@@ -153,19 +170,6 @@ export class Colibri {
     }
 }
 
-export class ColibriApp {
-
-    constructor(env) {
-        this.env = env;
-    }
-
-    attachTo(el, I) {
-        const colibri = new Colibri(this, I, el, this.env);
-        return colibri;
-    }
-
-}
-
 function* generateEntries(content) {
     for (let key in content) {
         const value = content[key];

addons/website/static/src/core/website_core.js

@@ -1,9 +1,9 @@
 import { registry } from "@web/core/registry";
 import { _t } from "@web/core/l10n/translation";
 import { Interaction } from "./interaction";
-import { ColibriApp } from "./colibri";
 import { getTemplate } from "@web/core/templates";
 import { PairSet } from "./utils";
+import { Colibri } from "./colibri";
 
 /**
  * Website Core
@@ -36,7 +36,6 @@ class WebsiteCore {
         this.env = env;
         this.interactions = [];
         this.roots = [];
-        this.colibriApp = new ColibriApp(this.env);
         this.owlApp = null;
         this.proms = [
             env.isReady.then(() => {
@@ -103,7 +102,7 @@ class WebsiteCore {
         }
         this.activeInteractions.add(el, I);
         if (I.prototype instanceof Interaction) {
-            const interaction = this.colibriApp.attachTo(el, I);
+            const interaction = new Colibri(I, el, this.env);
             this.interactions.push(interaction);
             proms.push(interaction.startProm);
         } else {

addons/website/static/src/interactions/post_link.js

@@ -5,16 +5,12 @@ import { Interaction } from "@website/core/interaction";
 class PostLink extends Interaction {
     static selector = ".post_link";
     dynamicContent = {
-        "_root:t-on-click": this.onClickPost,
+        "_root": {
+            "t-on-click": this.onClickPost,
+            "t-att-class": () => ({"o_post_link_js_loaded": true})
+        }
     };
 
-    setup() {
-        this.el.classList.add("o_post_link_js_loaded");
-    }
-    destroy() {
-        this.el.classList.remove("o_post_link_js_loaded");
-    }
-
     onClickPost(ev) {
         ev.preventDefault();
         const url = this.el.dataset.post || this.el.href;

addons/website/static/tests/core/interaction.test.js

@@ -528,13 +528,18 @@ describe("dynamic attributes", () => {
             };
         }
 
-        const { el } = await startInteraction(
+        const { el, core } = await startInteraction(
             Test,
             `<div class="test"><span>coucou</span></div>`,
         );
         expect(el.querySelector(".test").outerHTML).toBe(
             `<div class="test" a="b"><span>coucou</span></div>`,
         );
+        core.stopInteractions();
+        expect(el.querySelector(".test").outerHTML).toBe(
+            `<div class="test"><span>coucou</span></div>`,
+        );
+
     });
 
     test("t-att-class does not override existing classes", async () => {