Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/runtime/component_node.ts
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ export class ComponentNode implements VNode<ComponentNode> {
const previousComputation = getCurrentComputation();
setComputation(this.signalComputation);
this.component = new C(this);
const ctx = Object.assign(Object.create(this.component), { this: this.component });
const ctx ={ this: this.component };
this.renderFn = app.getTemplate(C.template).bind(this.component, ctx, this);
this.component.setup();
setComputation(previousComputation);
Expand Down
13 changes: 0 additions & 13 deletions tests/compiler/__snapshots__/t_slot.test.ts.snap

This file was deleted.

76 changes: 38 additions & 38 deletions tests/components/__snapshots__/basics.test.ts.snap
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ exports[`basics GrandChild display is controlled by its GrandParent 1`] = `
const comp1 = app.createComponent(null, false, false, false, ["displayGrandChild"]);

return function template(ctx, node, key = "") {
const Comp1 = ctx['myComp'];
return toggler(Comp1, comp1({displayGrandChild: ctx['displayGrandChild']}, (Comp1).name + key + \`__1\`, node, this, Comp1));
const Comp1 = ctx['this'].myComp;
return toggler(Comp1, comp1({displayGrandChild: ctx['this'].displayGrandChild}, (Comp1).name + key + \`__1\`, node, this, Comp1));
}
}"
`;
Expand Down Expand Up @@ -146,9 +146,9 @@ exports[`basics can be clicked on and updated 1`] = `
let block1 = createBlock(\`<div><block-text-0/><button block-handler-1="click">Inc</button></div>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['state'].counter;
const v1 = ctx['state'];
let hdlr1 = [()=>v1.counter++, ctx];
let txt1 = ctx['this'].state.counter;
const v1 = ctx['this'];
let hdlr1 = [()=>v1.state.counter++, ctx];
return block1([txt1, hdlr1]);
}
}"
Expand Down Expand Up @@ -203,7 +203,7 @@ exports[`basics can inject values in tagged templates 2`] = `
let block1 = createBlock(\`<span><block-text-0/></span>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['state'].n;
let txt1 = ctx['this'].state.n;
return block1([txt1]);
}
}"
Expand Down Expand Up @@ -294,7 +294,7 @@ exports[`basics child can be updated 1`] = `
const comp1 = app.createComponent(\`Child\`, true, false, false, ["value"]);

return function template(ctx, node, key = "") {
return comp1({value: ctx['state'].counter}, key + \`__1\`, node, this, null);
return comp1({value: ctx['this'].state.counter}, key + \`__1\`, node, this, null);
}
}"
`;
Expand All @@ -318,7 +318,7 @@ exports[`basics class component with dynamic text 1`] = `
let block1 = createBlock(\`<span>My value: <block-text-0/></span>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['value'];
let txt1 = ctx['this'].value;
return block1([txt1]);
}
}"
Expand Down Expand Up @@ -358,7 +358,7 @@ exports[`basics component children doesn't leak (if case) 1`] = `

return function template(ctx, node, key = "") {
let b2;
if (ctx['ifVar']) {
if (ctx['this'].ifVar) {
b2 = comp1({}, key + \`__1\`, node, this, null);
}
return multi([b2]);
Expand Down Expand Up @@ -386,7 +386,7 @@ exports[`basics component children doesn't leak (t-key case) 1`] = `
const comp1 = app.createComponent(\`Child\`, true, false, false, []);

return function template(ctx, node, key = "") {
const tKey_1 = ctx['keyVar'];
const tKey_1 = ctx['this'].keyVar;
return toggler(tKey_1, comp1({}, tKey_1 + key + \`__1\`, node, this, null));
}
}"
Expand All @@ -413,7 +413,7 @@ exports[`basics component with dynamic content can be updated 1`] = `
let block1 = createBlock(\`<span><block-text-0/></span>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['value'];
let txt1 = ctx['this'].value;
return block1([txt1]);
}
}"
Expand All @@ -440,7 +440,7 @@ exports[`basics do not remove previously rendered dom if not necessary, variatio
let block1 = createBlock(\`<div><h1>h1</h1><span><block-text-0/></span></div>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['state'].value;
let txt1 = ctx['this'].state.value;
return block1([txt1]);
}
}"
Expand All @@ -453,7 +453,7 @@ exports[`basics higher order components parent and child 1`] = `
const comp1 = app.createComponent(\`Child\`, true, false, false, ["child"]);

return function template(ctx, node, key = "") {
return comp1({child: ctx['state'].child}, key + \`__1\`, node, this, null);
return comp1({child: ctx['this'].state.child}, key + \`__1\`, node, this, null);
}
}"
`;
Expand Down Expand Up @@ -516,7 +516,7 @@ exports[`basics list of two sub components inside other nodes 1`] = `

return function template(ctx, node, key = "") {
ctx = Object.create(ctx);
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].blips);;
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['this'].state.blips);;
for (let i1 = 0; i1 < l_block2; i1++) {
ctx[\`blip\`] = k_block2[i1];
const key1 = ctx['blip'].id;
Expand Down Expand Up @@ -670,9 +670,9 @@ exports[`basics rerendering a widget with a sub widget 2`] = `
let block1 = createBlock(\`<div><block-text-0/><button block-handler-1="click">Inc</button></div>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['state'].counter;
const v1 = ctx['state'];
let hdlr1 = [()=>v1.counter++, ctx];
let txt1 = ctx['this'].state.counter;
const v1 = ctx['this'];
let hdlr1 = [()=>v1.state.counter++, ctx];
return block1([txt1, hdlr1]);
}
}"
Expand Down Expand Up @@ -719,7 +719,7 @@ exports[`basics simple component with a dynamic text 1`] = `
let block1 = createBlock(\`<div><block-text-0/></div>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['value'];
let txt1 = ctx['this'].value;
return block1([txt1]);
}
}"
Expand All @@ -733,7 +733,7 @@ exports[`basics simple component, proxy 1`] = `
let block1 = createBlock(\`<div><block-text-0/></div>\`);

return function template(ctx, node, key = "") {
let txt1 = ctx['state'].value;
let txt1 = ctx['this'].state.value;
return block1([txt1]);
}
}"
Expand Down Expand Up @@ -765,13 +765,13 @@ exports[`basics sub components between t-ifs 1`] = `

return function template(ctx, node, key = "") {
let b2, b3, b4, b5;
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b2 = block2();
} else {
b3 = block3();
}
b4 = comp1({}, key + \`__1\`, node, this, null);
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b5 = block5();
}
return block1([], [b2, b3, b4, b5]);
Expand Down Expand Up @@ -803,9 +803,9 @@ exports[`basics t-elif works with t-component 1`] = `

return function template(ctx, node, key = "") {
let b2, b3;
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b2 = block2();
} else if (!ctx['state'].flag) {
} else if (!ctx['this'].state.flag) {
b3 = comp1({}, key + \`__1\`, node, this, null);
}
return block1([], [b2, b3]);
Expand Down Expand Up @@ -837,7 +837,7 @@ exports[`basics t-else with empty string works with t-component 1`] = `

return function template(ctx, node, key = "") {
let b2, b3;
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b2 = block2();
} else {
b3 = comp1({}, key + \`__1\`, node, this, null);
Expand Down Expand Up @@ -871,7 +871,7 @@ exports[`basics t-else works with t-component 1`] = `

return function template(ctx, node, key = "") {
let b2, b3;
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b2 = block2();
} else {
b3 = comp1({}, key + \`__1\`, node, this, null);
Expand Down Expand Up @@ -904,7 +904,7 @@ exports[`basics t-if works with t-component 1`] = `

return function template(ctx, node, key = "") {
let b2;
if (ctx['state'].flag) {
if (ctx['this'].state.flag) {
b2 = comp1({}, key + \`__1\`, node, this, null);
}
return block1([], [b2]);
Expand Down Expand Up @@ -969,10 +969,10 @@ exports[`basics text after a conditional component 1`] = `

return function template(ctx, node, key = "") {
let b2;
if (ctx['state'].hasChild) {
if (ctx['this'].state.hasChild) {
b2 = comp1({}, key + \`__1\`, node, this, null);
}
let txt1 = ctx['state'].text;
let txt1 = ctx['this'].state.text;
return block1([txt1], [b2]);
}
}"
Expand Down Expand Up @@ -1078,8 +1078,8 @@ exports[`basics update props of component without concrete own node 1`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`);

return function template(ctx, node, key = "") {
const tKey_1 = ctx['childProps'].key;
const b2 = toggler(tKey_1, comp1(Object.assign({}, ctx['childProps']), tKey_1 + key + \`__1\`, node, this, null));
const tKey_1 = ctx['this'].childProps.key;
const b2 = toggler(tKey_1, comp1(Object.assign({}, ctx['this'].childProps), tKey_1 + key + \`__1\`, node, this, null));
return block1([], [b2]);
}
}"
Expand Down Expand Up @@ -1121,7 +1121,7 @@ exports[`basics updating a component with t-foreach as root 1`] = `

return function template(ctx, node, key = "") {
ctx = Object.create(ctx);
const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['items']);;
const [k_block1, v_block1, l_block1, c_block1] = prepareList(ctx['this'].items);;
for (let i1 = 0; i1 < l_block1; i1++) {
ctx[\`item\`] = k_block1[i1];
const key1 = ctx['item'];
Expand All @@ -1139,7 +1139,7 @@ exports[`basics updating widget immediately 1`] = `
const comp1 = app.createComponent(\`Child\`, true, false, false, ["flag"]);

return function template(ctx, node, key = "") {
return comp1({flag: ctx['state'].flag}, key + \`__1\`, node, this, null);
return comp1({flag: ctx['this'].state.flag}, key + \`__1\`, node, this, null);
}
}"
`;
Expand Down Expand Up @@ -1208,7 +1208,7 @@ exports[`basics zero or one child components 1`] = `

return function template(ctx, node, key = "") {
let b2;
if (ctx['state'].hasChild) {
if (ctx['this'].state.hasChild) {
b2 = comp1({}, key + \`__1\`, node, this, null);
}
return multi([b2]);
Expand Down Expand Up @@ -1319,7 +1319,7 @@ exports[`t-out in components can render list of t-out 1`] = `

return function template(ctx, node, key = "") {
ctx = Object.create(ctx);
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['state'].items);;
const [k_block2, v_block2, l_block2, c_block2] = prepareList(ctx['this'].state.items);;
for (let i1 = 0; i1 < l_block2; i1++) {
ctx[\`item\`] = k_block2[i1];
const key1 = ctx['item'];
Expand All @@ -1340,8 +1340,8 @@ exports[`t-out in components can switch the contents of two t-out repeatedly 1`]
let { safeOutput } = helpers;

return function template(ctx, node, key = "") {
const b2 = safeOutput(ctx['state'].a);
const b3 = safeOutput(ctx['state'].b);
const b2 = safeOutput(ctx['this'].state.a);
const b3 = safeOutput(ctx['this'].state.b);
return multi([b2, b3]);
}
}"
Expand All @@ -1354,7 +1354,7 @@ exports[`t-out in components t-out and updating falsy values, 1`] = `
let { safeOutput } = helpers;

return function template(ctx, node, key = "") {
return safeOutput(ctx['state'].a);
return safeOutput(ctx['this'].state.a);
}
}"
`;
Expand All @@ -1368,7 +1368,7 @@ exports[`t-out in components update properly on state changes 1`] = `
let block1 = createBlock(\`<div><block-child-0/></div>\`);

return function template(ctx, node, key = "") {
const b2 = safeOutput(ctx['state'].value);
const b2 = safeOutput(ctx['this'].state.value);
return block1([], [b2]);
}
}"
Expand Down
Loading