From 6f0a4b1c92f39ba0216212496e2b8ced2179c4d4 Mon Sep 17 00:00:00 2001
From: Samuel Degueldre <sad@odoo.com>
Date: Thu, 27 Jan 2022 12:58:04 +0100
Subject: [PATCH] [FIX] compiler: do not pass dynamic props object as is

The child receiving the props can observe changes made to the passed
t-props object which is not desirable.
---
 src/compiler/code_generator.ts                |  2 +-
 .../__snapshots__/basics.test.ts.snap         |  2 +-
 .../__snapshots__/t_props.test.ts.snap        | 28 +++++++++++++++++--
 tests/components/t_props.test.ts              | 22 +++++++++++++--
 4 files changed, 48 insertions(+), 6 deletions(-)

diff --git a/src/compiler/code_generator.ts b/src/compiler/code_generator.ts
index 9e3fdd3c..ac772bbe 100644
--- a/src/compiler/code_generator.ts
+++ b/src/compiler/code_generator.ts
@@ -1104,7 +1104,7 @@ export class CodeGenerator {
     let propString = propStr;
     if (ast.dynamicProps) {
       if (!props.length) {
-        propString = `${compileExpr(ast.dynamicProps)}`;
+        propString = `Object.assign({}, ${compileExpr(ast.dynamicProps)})`;
       } else {
         propString = `Object.assign({}, ${compileExpr(ast.dynamicProps)}, ${propStr})`;
       }
diff --git a/tests/components/__snapshots__/basics.test.ts.snap b/tests/components/__snapshots__/basics.test.ts.snap
index 99fd4dd4..1a81e4fe 100644
--- a/tests/components/__snapshots__/basics.test.ts.snap
+++ b/tests/components/__snapshots__/basics.test.ts.snap
@@ -968,7 +968,7 @@ exports[`basics update props of component without concrete own node 1`] = `
   
   return function template(ctx, node, key = \\"\\") {
     const tKey_1 = ctx['childProps'].key;
-    let b2 = toggler(tKey_1, component(\`Child\`, ctx['childProps'], tKey_1 + key + \`__1\`, node, ctx));
+    let b2 = toggler(tKey_1, component(\`Child\`, Object.assign({}, ctx['childProps']), tKey_1 + key + \`__1\`, node, ctx));
     return block1([], [b2]);
   }
 }"
diff --git a/tests/components/__snapshots__/t_props.test.ts.snap b/tests/components/__snapshots__/t_props.test.ts.snap
index fff360b7..4d8d8d48 100644
--- a/tests/components/__snapshots__/t_props.test.ts.snap
+++ b/tests/components/__snapshots__/t_props.test.ts.snap
@@ -8,7 +8,7 @@ exports[`t-props basic use 1`] = `
   let block1 = createBlock(\`<div><block-child-0/></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = component(\`Child\`, ctx['some'].obj, key + \`__1\`, node, ctx);
+    let b2 = component(\`Child\`, Object.assign({}, ctx['some'].obj), key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
@@ -28,6 +28,30 @@ exports[`t-props basic use 2`] = `
 }"
 `;
 
+exports[`t-props child receives a copy of the t-props object, not the original 1`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  return function template(ctx, node, key = \\"\\") {
+    return component(\`Child\`, Object.assign({}, ctx['childProps']), key + \`__1\`, node, ctx);
+  }
+}"
+`;
+
+exports[`t-props child receives a copy of the t-props object, not the original 2`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
+  
+  let block1 = createBlock(\`<div/>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    return block1();
+  }
+}"
+`;
+
 exports[`t-props t-props and other props 1`] = `
 "function anonymous(bdom, helpers
 ) {
@@ -65,7 +89,7 @@ exports[`t-props t-props only 1`] = `
   let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
   
   return function template(ctx, node, key = \\"\\") {
-    let b2 = component(\`Comp\`, ctx['state'], key + \`__1\`, node, ctx);
+    let b2 = component(\`Comp\`, Object.assign({}, ctx['state']), key + \`__1\`, node, ctx);
     return block1([], [b2]);
   }
 }"
diff --git a/tests/components/t_props.test.ts b/tests/components/t_props.test.ts
index 1210a66e..e5436da7 100644
--- a/tests/components/t_props.test.ts
+++ b/tests/components/t_props.test.ts
@@ -53,7 +53,7 @@ describe("t-props", () => {
   });
 
   test("basic use", async () => {
-    expect.assertions(5);
+    expect.assertions(4);
 
     let props = { a: 1, b: 2 };
 
@@ -65,7 +65,6 @@ describe("t-props", () => {
         `;
       setup() {
         expect(this.props).toEqual({ a: 1, b: 2 });
-        expect(this.props).toBe(props);
       }
     }
     class Parent extends Component {
@@ -105,4 +104,23 @@ describe("t-props", () => {
 
     await mount(Parent, fixture);
   });
+
+  test("child receives a copy of the t-props object, not the original", async () => {
+    class Child extends Component {
+      static template = xml`<div/>`;
+      setup() {
+        expect(this.props).toEqual({ a: 1, b: 2 });
+        this.props.d = 5;
+      }
+    }
+    class Parent extends Component {
+      static template = xml`<Child t-props="childProps"/>`;
+      static components = { Child };
+
+      childProps = { a: 1, b: 2 };
+    }
+
+    const parent = await mount(Parent, fixture);
+    expect(parent.childProps).not.toHaveProperty("d");
+  });
 });