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(\`
\`);
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(\`\`);
+
+ 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(\`\`);
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``;
+ setup() {
+ expect(this.props).toEqual({ a: 1, b: 2 });
+ this.props.d = 5;
+ }
+ }
+ class Parent extends Component {
+ static template = xml``;
+ static components = { Child };
+
+ childProps = { a: 1, b: 2 };
+ }
+
+ const parent = await mount(Parent, fixture);
+ expect(parent.childProps).not.toHaveProperty("d");
+ });
});