NextERP/owl
2
0
Fork 0
mirror of https://github.com/odoo/owl.git synced 2025-10-06 19:59:41 +07:00
Code Issues Packages Projects Releases Wiki Activity

[REF] tests: improve test helpers

Browse Source 
- remove snapshotApp
- remove addTemplates
- simplify helpers
- make sure snapshotted templates are snapshotted with the app config
This commit is contained in:
Géry Debongnie
2021-12-20 11:19:59 +01:00
committed by Samuel Degueldre
parent f19de73b0f
commit a727347d60
48 changed files with 4157 additions and 3279 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/template_set.ts
+10 -7
View File
@@ -81,13 +81,7 @@ export class TemplateSet {
if (rawTemplate === undefined) {
throw new Error(`Missing template: "${name}"`);
}
const templateFn = compile(rawTemplate, {
name,
dev: this.dev,
translateFn: this.translateFn,
translatableAttributes: this.translatableAttributes,
});
const templateFn = this._compileTemplate(name, rawTemplate);
// first add a function to lazily get the template, in case there is a
// recursive call to the template name
this.templates[name] = (context, parent) => this.templates[name](context, parent);
@@ -96,4 +90,13 @@ export class TemplateSet {
}
return this.templates[name];
}
_compileTemplate(name: string, template: string | Node) {
return compile(template, {
name,
dev: this.dev,
translateFn: this.translateFn,
translatableAttributes: this.translatableAttributes,
});
}
}
src/compiler/index.ts
-1
View File
@@ -22,7 +22,6 @@ export function compile(template: string | Node, options: CompileOptions = {}):
// code generation
const codeGenerator = new CodeGenerator(ast, { ...options, hasSafeContext });
const code = codeGenerator.generateCode();
// template function
return new Function("bdom, helpers", code) as TemplateFunction;
}
tests/__snapshots__/reactivity.test.ts.snap
+79 -79
View File
@@ -51,11 +51,14 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].a;
return block1([d1]);
let b2;
if (ctx['state'].flag) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2]);
}
}"
`;
@@ -65,23 +68,6 @@ exports[`Reactivity: useState destroyed component before being mounted is inacti
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].flag) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2]);
}
}"
`;
exports[`Reactivity: useState destroyed component is inactive 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -91,7 +77,7 @@ exports[`Reactivity: useState destroyed component is inactive 1`] = `
}"
`;
exports[`Reactivity: useState destroyed component is inactive 2`] = `
exports[`Reactivity: useState destroyed component is inactive 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -108,6 +94,20 @@ exports[`Reactivity: useState destroyed component is inactive 2`] = `
}"
`;
exports[`Reactivity: useState destroyed component is inactive 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].a;
return block1([d1]);
}
}"
`;
exports[`Reactivity: useState one components can subscribe twice to same context 1`] = `
"function anonymous(bdom, helpers
) {
@@ -128,11 +128,12 @@ exports[`Reactivity: useState parent and children subscribed to same context 1`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].a;
return block1([d1]);
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let d1 = ctx['contextObj'].b;
return block1([d1], [b2]);
}
}"
`;
@@ -142,12 +143,11 @@ exports[`Reactivity: useState parent and children subscribed to same context 2`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let d1 = ctx['contextObj'].b;
return block1([d1], [b2]);
let d1 = ctx['contextObj'].a;
return block1([d1]);
}
}"
`;
@@ -220,11 +220,12 @@ exports[`Reactivity: useState two components are updated in parallel 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].value;
return block1([d1]);
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
return block1([], [b2, b3]);
}
}"
`;
@@ -234,12 +235,11 @@ exports[`Reactivity: useState two components are updated in parallel 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
return block1([], [b2, b3]);
let d1 = ctx['contextObj'].value;
return block1([d1]);
}
}"
`;
@@ -249,20 +249,6 @@ exports[`Reactivity: useState two components can subscribe to same context 1`] =
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].value;
return block1([d1]);
}
}"
`;
exports[`Reactivity: useState two components can subscribe to same context 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -273,7 +259,7 @@ exports[`Reactivity: useState two components can subscribe to same context 2`] =
}"
`;
exports[`Reactivity: useState two independent components on different levels are updated in parallel 1`] = `
exports[`Reactivity: useState two components can subscribe to same context 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -287,21 +273,7 @@ exports[`Reactivity: useState two independent components on different levels are
}"
`;
exports[`Reactivity: useState two independent components on different levels are updated in parallel 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`Reactivity: useState two independent components on different levels are updated in parallel 3`] = `
exports[`Reactivity: useState two independent components on different levels are updated in parallel 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -316,6 +288,34 @@ exports[`Reactivity: useState two independent components on different levels are
}"
`;
exports[`Reactivity: useState two independent components on different levels are updated in parallel 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['contextObj'].value;
return block1([d1]);
}
}"
`;
exports[`Reactivity: useState two independent components on different levels are updated in parallel 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`Reactivity: useState useContext=useState hook is reactive, for one component 1`] = `
"function anonymous(bdom, helpers
) {
@@ -332,20 +332,6 @@ exports[`Reactivity: useState useContext=useState hook is reactive, for one comp
exports[`Reactivity: useState useless atoms should be deleted 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].quantity;
return block1([d1]);
}
}"
`;
exports[`Reactivity: useState useless atoms should be deleted 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
@@ -369,6 +355,20 @@ exports[`Reactivity: useState useless atoms should be deleted 2`] = `
}"
`;
exports[`Reactivity: useState useless atoms should be deleted 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].quantity;
return block1([d1]);
}
}"
`;
exports[`Reactivity: useState very simple use, with initial value 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/error_handling.test.ts.snap
-14
View File
@@ -1,14 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`error handling cannot add twice the same template 1`] = `
"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();
}
}"
`;
tests/compiler/__snapshots__/event_handling.test.ts.snap
+34 -34
View File
@@ -154,20 +154,6 @@ exports[`t-on handler is bound to proper owner, part 2 1`] = `
exports[`t-on handler is bound to proper owner, part 3 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button block-handler-0=\\"click\\">Click</button>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['add'], ctx];
return block1([d1]);
}
}"
`;
exports[`t-on handler is bound to proper owner, part 3 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
@@ -179,7 +165,7 @@ exports[`t-on handler is bound to proper owner, part 3 2`] = `
}"
`;
exports[`t-on handler is bound to proper owner, part 4 1`] = `
exports[`t-on handler is bound to proper owner, part 3 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -193,7 +179,7 @@ exports[`t-on handler is bound to proper owner, part 4 1`] = `
}"
`;
exports[`t-on handler is bound to proper owner, part 4 2`] = `
exports[`t-on handler is bound to proper owner, part 4 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -217,6 +203,20 @@ exports[`t-on handler is bound to proper owner, part 4 2`] = `
}"
`;
exports[`t-on handler is bound to proper owner, part 4 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button block-handler-0=\\"click\\">Click</button>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['add'], ctx];
return block1([d1]);
}
}"
`;
exports[`t-on receive event in first argument 1`] = `
"function anonymous(bdom, helpers
) {
@@ -470,6 +470,22 @@ exports[`t-on t-on with inline statement, part 3 1`] = `
exports[`t-on t-on with t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`sub\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
exports[`t-on t-on with t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -482,7 +498,7 @@ exports[`t-on t-on with t-call 1`] = `
}"
`;
exports[`t-on t-on with t-call 2`] = `
exports[`t-on t-on, with arguments and t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -498,7 +514,7 @@ exports[`t-on t-on with t-call 2`] = `
}"
`;
exports[`t-on t-on, with arguments and t-call 1`] = `
exports[`t-on t-on, with arguments and t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -512,19 +528,3 @@ exports[`t-on t-on, with arguments and t-call 1`] = `
}
}"
`;
exports[`t-on t-on, with arguments and t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`sub\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
tests/compiler/__snapshots__/misc.test.ts.snap
+47 -47
View File
@@ -80,53 +80,6 @@ exports[`misc complex template 1`] = `
exports[`misc global 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<año block-attribute-0=\\"falló\\"><block-child-0/></año>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = 'agüero';
let b2 = ctx[zero];
return block1([d1], [b2]);
}
}"
`;
exports[`misc global 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { withDefault } = helpers;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = withDefault(ctx['foo'], \`foo default\`);
return block1([d1]);
}
}"
`;
exports[`misc global 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { safeOutput, withDefault } = helpers;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = text(\`toto default\`);
let b2 = withDefault(safeOutput(ctx['toto']), b3);
return block1([], [b2]);
}
}"
`;
exports[`misc global 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, zero, withKey } = helpers;
@@ -177,6 +130,53 @@ exports[`misc global 4`] = `
}"
`;
exports[`misc global 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { withDefault } = helpers;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = withDefault(ctx['foo'], \`foo default\`);
return block1([d1]);
}
}"
`;
exports[`misc global 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<año block-attribute-0=\\"falló\\"><block-child-0/></año>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = 'agüero';
let b2 = ctx[zero];
return block1([d1], [b2]);
}
}"
`;
exports[`misc global 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { safeOutput, withDefault } = helpers;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = text(\`toto default\`);
let b2 = withDefault(safeOutput(ctx['toto']), b3);
return block1([], [b2]);
}
}"
`;
exports[`misc other complex template 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/t_call.test.ts.snap
+222 -222
View File
@@ -2,19 +2,6 @@
exports[`t-call (template calling) basic caller 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>ok</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-call (template calling) basic caller 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
@@ -29,7 +16,7 @@ exports[`t-call (template calling) basic caller 2`] = `
}"
`;
exports[`t-call (template calling) basic caller, no parent node 1`] = `
exports[`t-call (template calling) basic caller 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -42,7 +29,7 @@ exports[`t-call (template calling) basic caller, no parent node 1`] = `
}"
`;
exports[`t-call (template calling) basic caller, no parent node 2`] = `
exports[`t-call (template calling) basic caller, no parent node 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -55,22 +42,20 @@ exports[`t-call (template calling) basic caller, no parent node 2`] = `
}"
`;
exports[`t-call (template calling) call with several sub nodes on same line 1`] = `
exports[`t-call (template calling) basic caller, no parent node 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<span>ok</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
return block1([], [b2]);
return block1();
}
}"
`;
exports[`t-call (template calling) call with several sub nodes on same line 2`] = `
exports[`t-call (template calling) call with several sub nodes on same line 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -95,13 +80,13 @@ exports[`t-call (template calling) call with several sub nodes on same line 2`]
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
exports[`t-call (template calling) call with several sub nodes on same line 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><span>cascade 2</span><block-child-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
@@ -110,30 +95,32 @@ exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
exports[`t-call (template calling) cascading t-call t-out='0' 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`finalTemplate\`);
const callTemplate_2 = getTemplate(\`subTemplate\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block3 = createBlock(\`<span>cascade 1</span>\`);
let block3 = createBlock(\`<span>hey</span>\`);
let block5 = createBlock(\`<span>yay</span>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b3 = block3();
let b4 = ctx[zero];
let b2 = multi([b3, b4]);
let b4 = text(\` \`);
let b5 = block5();
let b2 = multi([b3, b4, b5]);
ctx[zero] = b2;
let b5 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b5]);
let b6 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b6]);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
exports[`t-call (template calling) cascading t-call t-out='0' 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -156,90 +143,45 @@ exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0' 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`subTemplate\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block3 = createBlock(\`<span>hey</span>\`);
let block5 = createBlock(\`<span>yay</span>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b3 = block3();
let b4 = text(\` \`);
let b5 = block5();
let b2 = multi([b3, b4, b5]);
ctx[zero] = b2;
let b6 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b6]);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block2 = createBlock(\`<span>cascade 2</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = block2();
let b3 = ctx[zero];
return multi([b2, b3]);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 2`] = `
exports[`t-call (template calling) cascading t-call t-out='0' 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`finalTemplate\`);
let block2 = createBlock(\`<span>cascade 1</span>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block3 = createBlock(\`<span>cascade 1</span>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b2 = block2();
let b3 = ctx[zero];
let b1 = multi([b2, b3]);
ctx[zero] = b1;
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
let b3 = block3();
let b4 = ctx[zero];
let b2 = multi([b3, b4]);
ctx[zero] = b2;
let b5 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b5]);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 3`] = `
exports[`t-call (template calling) cascading t-call t-out='0' 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`subSubTemplate\`);
let { zero } = helpers;
let block2 = createBlock(\`<span>cascade 0</span>\`);
let block1 = createBlock(\`<div><span>cascade 2</span><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b2 = block2();
let b3 = ctx[zero];
let b1 = multi([b2, b3]);
ctx[zero] = b1;
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
let b2 = ctx[zero];
return block1([], [b2]);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 4`] = `
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -262,36 +204,66 @@ exports[`t-call (template calling) cascading t-call t-out='0', without external
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`subSubTemplate\`);
let block2 = createBlock(\`<span>cascade 0</span>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b2 = block2();
let b3 = ctx[zero];
let b1 = multi([b2, b3]);
ctx[zero] = b1;
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`finalTemplate\`);
let block2 = createBlock(\`<span>cascade 1</span>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1;
let b2 = block2();
let b3 = ctx[zero];
let b1 = multi([b2, b3]);
ctx[zero] = b1;
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`t-call (template calling) cascading t-call t-out='0', without external divs 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block2 = createBlock(\`<span>cascade 2</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = block2();
let b3 = ctx[zero];
return multi([b2, b3]);
}
}"
`;
exports[`t-call (template calling) dynamic t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<foo><block-text-0/></foo>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['val'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) dynamic t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<bar><block-text-0/></bar>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['val'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) dynamic t-call 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { call } = helpers;
@@ -306,18 +278,35 @@ exports[`t-call (template calling) dynamic t-call 3`] = `
}"
`;
exports[`t-call (template calling) inherit context 1`] = `
exports[`t-call (template calling) dynamic t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<foo><block-text-0/></foo>\`);
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
let d1 = ctx['val'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) inherit context 2`] = `
exports[`t-call (template calling) dynamic t-call 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<bar><block-text-0/></bar>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['val'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) inherit context 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -336,6 +325,17 @@ exports[`t-call (template calling) inherit context 2`] = `
}"
`;
exports[`t-call (template calling) inherit context 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
}
}"
`;
exports[`t-call (template calling) recursive template, part 1 1`] = `
"function anonymous(bdom, helpers
) {
@@ -525,17 +525,6 @@ exports[`t-call (template calling) recursive template, part 4: with t-set recurs
exports[`t-call (template calling) scoped parameters 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(\`ok\`);
}
}"
`;
exports[`t-call (template calling) scoped parameters 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
@@ -557,18 +546,18 @@ exports[`t-call (template calling) scoped parameters 2`] = `
}"
`;
exports[`t-call (template calling) scoped parameters, part 2 1`] = `
exports[`t-call (template calling) scoped parameters 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
return text(\`ok\`);
}
}"
`;
exports[`t-call (template calling) scoped parameters, part 2 2`] = `
exports[`t-call (template calling) scoped parameters, part 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -592,6 +581,17 @@ exports[`t-call (template calling) scoped parameters, part 2 2`] = `
}"
`;
exports[`t-call (template calling) scoped parameters, part 2 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
}
}"
`;
exports[`t-call (template calling) t-call allowed on a non t node 1`] = `
"function anonymous(bdom, helpers
) {
@@ -623,21 +623,6 @@ exports[`t-call (template calling) t-call allowed on a non t node 2`] = `
exports[`t-call (template calling) t-call with body content as root of a template 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<foo><block-child-0/></foo>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
return block1([], [b2]);
}
}"
`;
exports[`t-call (template calling) t-call with body content as root of a template 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
@@ -655,6 +640,21 @@ exports[`t-call (template calling) t-call with body content as root of a templat
}"
`;
exports[`t-call (template calling) t-call with body content as root of a template 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<foo><block-child-0/></foo>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
return block1([], [b2]);
}
}"
`;
exports[`t-call (template calling) t-call with t-if 1`] = `
"function anonymous(bdom, helpers
) {
@@ -772,6 +772,25 @@ exports[`t-call (template calling) t-call with t-set inside and outside 2`] = `
exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`main\`);
let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
setContextValue(ctx, \\"w\\", 'fromwrapper');
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
@@ -804,7 +823,7 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 1`] =
}"
`;
exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] = `
exports[`t-call (template calling) t-call with t-set inside and outside. 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -820,54 +839,8 @@ exports[`t-call (template calling) t-call with t-set inside and outside. 2 2`] =
}"
`;
exports[`t-call (template calling) t-call with t-set inside and outside. 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`main\`);
let block1 = createBlock(\`<p><block-child-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
setContextValue(ctx, \\"w\\", 'fromwrapper');
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
exports[`t-call (template calling) t-call, conditional and t-set in t-call body 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>callee1</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-call (template calling) t-call, conditional and t-set in t-call body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>callee2 <block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['v'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) t-call, conditional and t-set in t-call body 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
@@ -895,6 +868,33 @@ exports[`t-call (template calling) t-call, conditional and t-set in t-call body
}"
`;
exports[`t-call (template calling) t-call, conditional and t-set in t-call body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>callee1</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-call (template calling) t-call, conditional and t-set in t-call body 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>callee2 <block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['v'];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) t-esc inside t-call, with t-set outside 1`] = `
"function anonymous(bdom, helpers
) {
@@ -930,19 +930,6 @@ exports[`t-call (template calling) t-esc inside t-call, with t-set outside 2`] =
exports[`t-call (template calling) with unused body 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>ok</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-call (template calling) with unused body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
@@ -958,7 +945,7 @@ exports[`t-call (template calling) with unused body 2`] = `
}"
`;
exports[`t-call (template calling) with unused setbody 1`] = `
exports[`t-call (template calling) with unused body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -971,7 +958,7 @@ exports[`t-call (template calling) with unused setbody 1`] = `
}"
`;
exports[`t-call (template calling) with unused setbody 2`] = `
exports[`t-call (template calling) with unused setbody 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -989,22 +976,20 @@ exports[`t-call (template calling) with unused setbody 2`] = `
}"
`;
exports[`t-call (template calling) with used body 1`] = `
exports[`t-call (template calling) with unused setbody 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<h1><block-text-0/></h1>\`);
let block1 = createBlock(\`<div>ok</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx[zero];
return block1([d1]);
return block1();
}
}"
`;
exports[`t-call (template calling) with used body 2`] = `
exports[`t-call (template calling) with used body 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -1021,18 +1006,22 @@ exports[`t-call (template calling) with used body 2`] = `
}"
`;
exports[`t-call (template calling) with used setbody 1`] = `
exports[`t-call (template calling) with used body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<h1><block-text-0/></h1>\`);
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
let d1 = ctx[zero];
return block1([d1]);
}
}"
`;
exports[`t-call (template calling) with used setbody 2`] = `
exports[`t-call (template calling) with used setbody 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -1052,3 +1041,14 @@ exports[`t-call (template calling) with used setbody 2`] = `
}
}"
`;
exports[`t-call (template calling) with used setbody 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['foo']);
}
}"
`;
tests/compiler/__snapshots__/t_esc.test.ts.snap
+15 -15
View File
@@ -146,21 +146,6 @@ exports[`t-esc t-esc work with spread operator 1`] = `
exports[`t-esc t-esc=0 is escaped 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx[zero];
return block1([d1]);
}
}"
`;
exports[`t-esc t-esc=0 is escaped 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
@@ -180,6 +165,21 @@ exports[`t-esc t-esc=0 is escaped 2`] = `
}"
`;
exports[`t-esc t-esc=0 is escaped 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx[zero];
return block1([d1]);
}
}"
`;
exports[`t-esc variable 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/t_foreach.test.ts.snap
+24 -24
View File
@@ -213,24 +213,6 @@ exports[`t-foreach simple iteration with two nodes inside 1`] = `
exports[`t-foreach t-call with body in t-foreach in t-foreach 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2 = text(\` [\`);
let b3 = text(ctx['a']);
let b4 = text(\`] [\`);
let b5 = text(ctx['b']);
let b6 = text(\`] [\`);
let b7 = text(ctx['c']);
let b8 = text(\`] \`);
return multi([b2, b3, b4, b5, b6, b7, b8]);
}
}"
`;
exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, isBoundary, withDefault, setContextValue, getTemplate, withKey } = helpers;
@@ -282,16 +264,12 @@ exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
}"
`;
exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
exports[`t-foreach t-call with body in t-foreach in t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
setContextValue(ctx, \\"c\\", 'x'+'_'+ctx['a']+'_'+ctx['b']);
let b2 = text(\` [\`);
let b3 = text(ctx['a']);
let b4 = text(\`] [\`);
@@ -304,7 +282,7 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
}"
`;
exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
exports[`t-foreach t-call without body in t-foreach in t-foreach 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -351,6 +329,28 @@ exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
}"
`;
exports[`t-foreach t-call without body in t-foreach in t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
setContextValue(ctx, \\"c\\", 'x'+'_'+ctx['a']+'_'+ctx['b']);
let b2 = text(\` [\`);
let b3 = text(ctx['a']);
let b4 = text(\`] [\`);
let b5 = text(ctx['b']);
let b6 = text(\`] [\`);
let b7 = text(ctx['c']);
let b8 = text(\`] \`);
return multi([b2, b3, b4, b5, b6, b7, b8]);
}
}"
`;
exports[`t-foreach t-foreach in t-foreach 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/t_out.test.ts.snap
+31 -31
View File
@@ -29,22 +29,6 @@ exports[`t-out literal, no outside html element 1`] = `
exports[`t-out multiple calls to t-out 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><block-child-0/><div>Greeter</div><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
let b3 = ctx[zero];
return block1([], [b2, b3]);
}
}"
`;
exports[`t-out multiple calls to t-out 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
@@ -64,6 +48,22 @@ exports[`t-out multiple calls to t-out 2`] = `
}"
`;
exports[`t-out multiple calls to t-out 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><block-child-0/><div>Greeter</div><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
let b3 = ctx[zero];
return block1([], [b2, b3]);
}
}"
`;
exports[`t-out not escaping 1`] = `
"function anonymous(bdom, helpers
) {
@@ -81,21 +81,6 @@ exports[`t-out not escaping 1`] = `
exports[`t-out t-out 0 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
return block1([], [b2]);
}
}"
`;
exports[`t-out t-out 0 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, zero, getTemplate } = helpers;
@@ -115,6 +100,21 @@ exports[`t-out t-out 0 2`] = `
}"
`;
exports[`t-out t-out 0 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { zero } = helpers;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = ctx[zero];
return block1([], [b2]);
}
}"
`;
exports[`t-out t-out and another sibling node 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/t_set.test.ts.snap
+21 -21
View File
@@ -185,25 +185,6 @@ exports[`t-set t-set body is evaluated immediately 1`] = `
exports[`t-set t-set can't alter from within callee 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set t-set can't alter from within callee 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, getTemplate } = helpers;
@@ -223,7 +204,7 @@ exports[`t-set t-set can't alter from within callee 2`] = `
}"
`;
exports[`t-set t-set can't alter in t-call body 1`] = `
exports[`t-set t-set can't alter from within callee 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -242,7 +223,7 @@ exports[`t-set t-set can't alter in t-call body 1`] = `
}"
`;
exports[`t-set t-set can't alter in t-call body 2`] = `
exports[`t-set t-set can't alter in t-call body 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -267,6 +248,25 @@ exports[`t-set t-set can't alter in t-call body 2`] = `
}"
`;
exports[`t-set t-set can't alter in t-call body 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set t-set does not modify render context existing key values 1`] = `
"function anonymous(bdom, helpers
) {
tests/compiler/__snapshots__/template_set.test.ts.snap
+26 -20
View File
@@ -30,14 +30,14 @@ exports[`loading templates can load a few templates from a xml string 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`items\`);
let block2 = createBlock(\`<li>ok</li>\`);
let block3 = createBlock(\`<li>foo</li>\`);
let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = block2();
let b3 = block3();
return multi([b2, b3]);
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
@@ -47,16 +47,35 @@ exports[`loading templates can load a few templates from a xml string 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<ul/>\`);
let block2 = createBlock(\`<li>ok</li>\`);
let block3 = createBlock(\`<li>foo</li>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = block2();
let b3 = block3();
return multi([b2, b3]);
}
}"
`;
exports[`loading templates can load a few templates from an XMLDocument 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`items\`);
let block1 = createBlock(\`<ul><block-child-0/></ul>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
exports[`loading templates can load a few templates from an XMLDocument 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -70,16 +89,3 @@ exports[`loading templates can load a few templates from an XMLDocument 1`] = `
}
}"
`;
exports[`loading templates can load a few templates from an XMLDocument 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<ul/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
tests/compiler/attributes.test.ts
+3 -5
View File
@@ -1,4 +1,3 @@
import { xml } from "../../src";
import { mount, patch } from "../../src/blockdom";
import { makeTestFixture, renderToBdom, renderToString, snapshotEverything } from "../helpers";
@@ -348,9 +347,8 @@ describe("special cases for some specific html attributes/properties", () => {
});
test("various boolean html attributes", () => {
// the unique assertion here is the code snapshot automatically done by
// renderToString
xml`
// will cause the template to be snapshotted
renderToString(`
<div>
<input type="checkbox" checked="checked"/>
<input checked="checked"/>
@@ -360,7 +358,7 @@ describe("special cases for some specific html attributes/properties", () => {
<input readonly="readonly"/>
<button disabled="disabled"/>
</div>
`;
`);
});
test("input with t-att-value", () => {
tests/compiler/misc.test.ts
+9 -4
View File
@@ -1,5 +1,10 @@
import { xml } from "../../src";
import { renderToString, snapshotEverything, TestContext, trim } from "../helpers";
import {
renderToString,
snapshotEverything,
snapshotTemplate,
TestContext,
trim,
} from "../helpers";
snapshotEverything();
@@ -116,7 +121,7 @@ describe("misc", () => {
});
test("other complex template", () => {
xml`
snapshotTemplate(`
<div>
<header>
<nav class="navbar navbar-expand-md navbar-light bg-light">
@@ -257,6 +262,6 @@ describe("misc", () => {
</div>
</div>
</div>
</div>`;
</div>`);
});
});
tests/compiler/t_debug_log.test.ts
+5 -5
View File
@@ -1,4 +1,4 @@
import { renderToString, snapshotTemplateCode } from "../helpers";
import { renderToString, snapshotTemplate } from "../helpers";
// -----------------------------------------------------------------------------
// debugging
@@ -9,7 +9,7 @@ describe("debugging", () => {
const consoleLog = console.log;
console.log = jest.fn();
const template = `<div t-debug=""><t t-if="true"><span t-debug="">hey</span></t></div>`;
snapshotTemplateCode(template);
snapshotTemplate(template);
expect(console.log).toHaveBeenCalledTimes(1);
console.log = consoleLog;
});
@@ -18,9 +18,9 @@ describe("debugging", () => {
const consoleLog = console.log;
console.log = jest.fn();
let template = `<p t-debug="">coucou</p>`;
snapshotTemplateCode(template);
snapshotTemplate(template);
template = `<div><t t-call="sub"/></div>`;
snapshotTemplateCode(template);
snapshotTemplate(template);
expect(console.log).toHaveBeenCalledTimes(1);
console.log = consoleLog;
});
@@ -33,7 +33,7 @@ describe("debugging", () => {
<t t-set="foo" t-value="42"/>
<t t-log="foo + 3"/>
</div>`;
snapshotTemplateCode(template);
snapshotTemplate(template);
renderToString(template);
expect(console.log).toHaveBeenCalledWith(45);
console.log = consoleLog;
tests/compiler/translation.test.ts
+14 -40
View File
@@ -1,9 +1,11 @@
import { App, Component } from "../../src";
import { makeTestFixture, snapshotApp } from "../helpers";
import { Component, mount } from "../../src";
import { makeTestFixture, snapshotEverything } from "../helpers";
import { xml } from "../../src/tags";
let fixture: HTMLElement;
snapshotEverything();
beforeEach(() => {
fixture = makeTestFixture();
});
@@ -14,16 +16,10 @@ describe("translation support", () => {
static template = xml`<div>word</div>`;
}
const app = new App(SomeComponent);
app.configure({
await mount(SomeComponent, fixture, {
translateFn: (expr: string) => (expr === "word" ? "mot" : expr),
});
const comp = await app.mount(fixture);
const el = comp.el as HTMLElement;
expect(el.outerHTML).toBe("<div>mot</div>");
snapshotApp(app);
expect(fixture.innerHTML).toBe("<div>mot</div>");
});
test("does not translate node content if disabled", async () => {
@@ -36,16 +32,11 @@ describe("translation support", () => {
`;
}
const app = new App(SomeComponent);
app.configure({
await mount(SomeComponent, fixture, {
translateFn: (expr: string) => (expr === "word" ? "mot" : expr),
});
const comp = await app.mount(fixture);
const el = comp.el as HTMLElement;
expect(el.outerHTML).toBe("<div><span>mot</span><span>word</span></div>");
snapshotApp(app);
expect(fixture.innerHTML).toBe("<div><span>mot</span><span>word</span></div>");
});
test("some attributes are translated", async () => {
@@ -61,18 +52,12 @@ describe("translation support", () => {
`;
}
const app = new App(SomeComponent);
app.configure({
await mount(SomeComponent, fixture, {
translateFn: (expr: string) => (expr === "word" ? "mot" : expr),
});
const comp = await app.mount(fixture);
const el = comp.el as HTMLElement;
expect(el.outerHTML).toBe(
expect(fixture.innerHTML).toBe(
'<div><p label="mot">mot</p><p title="mot">mot</p><p placeholder="mot">mot</p><p alt="mot">mot</p><p something="word">mot</p></div>'
);
snapshotApp(app);
});
test("can set translatable attributes", async () => {
@@ -82,16 +67,11 @@ describe("translation support", () => {
`;
}
const app = new App(SomeComponent);
app.configure({
await mount(SomeComponent, fixture, {
translateFn: (expr: string) => (expr === "word" ? "mot" : expr),
translatableAttributes: ["potato"],
});
const comp = await app.mount(fixture);
const el = comp.el as HTMLElement;
expect(el.outerHTML).toBe('<div tomato="word" potato="mot" title="word">text</div>');
snapshotApp(app);
expect(fixture.innerHTML).toBe('<div tomato="word" potato="mot" title="word">text</div>');
});
test("translation is done on the trimmed text, with extra spaces readded after", async () => {
@@ -103,14 +83,8 @@ describe("translation support", () => {
const translateFn = jest.fn((expr: string) => (expr === "word" ? "mot" : expr));
const app = new App(SomeComponent);
app.configure({ translateFn });
const comp = await app.mount(fixture);
const el = comp.el as HTMLElement;
expect(el.outerHTML).toBe("<div> mot </div>");
await mount(SomeComponent, fixture, { translateFn });
expect(fixture.innerHTML).toBe("<div> mot </div>");
expect(translateFn).toHaveBeenCalledWith("word");
snapshotApp(app);
});
});
tests/compiler/validation.test.ts
+2 -2
View File
@@ -1,5 +1,5 @@
import { TemplateSet } from "../../src/app/template_set";
import { renderToString, TestContext, compile } from "../helpers";
import { renderToString, snapshotTemplate, TestContext } from "../helpers";
// -----------------------------------------------------------------------------
// basic validation
@@ -21,7 +21,7 @@ describe("basic validation", () => {
test("invalid xml", () => {
const template = "<div>";
expect(() => compile(template)).toThrow("Invalid XML in template");
expect(() => snapshotTemplate(template)).toThrow("Invalid XML in template");
});
test("missing template in template set", () => {
tests/components/__snapshots__/basics.test.ts.snap
+208 -247
View File
@@ -22,10 +22,8 @@ exports[`basics a class component inside a class component, no external dom 1`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -35,18 +33,7 @@ exports[`basics a class component inside a class component, no external dom 2`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics a component cannot be mounted in a detached node 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -59,10 +46,11 @@ exports[`basics a component inside a component 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
@@ -72,11 +60,10 @@ exports[`basics a component inside a component 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
return block1();
}
}"
`;
@@ -102,20 +89,6 @@ exports[`basics can handle empty props 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`basics can handle empty props 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -125,8 +98,35 @@ exports[`basics can handle empty props 2`] = `
}"
`;
exports[`basics can handle empty props 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`basics can inject values in tagged templates 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__73\`);
return function template(ctx, node, key = \\"\\") {
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`basics can inject values in tagged templates 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -139,19 +139,6 @@ exports[`basics can inject values in tagged templates 1`] = `
}"
`;
exports[`basics can inject values in tagged templates 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
return function template(ctx, node, key = \\"\\") {
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`basics can mount a component with just some text 1`] = `
"function anonymous(bdom, helpers
) {
@@ -217,26 +204,13 @@ exports[`basics can mount a simple component with props 1`] = `
}"
`;
exports[`basics cannot mount on a documentFragment 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>content</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics child can be updated 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['props'].value);
return component(\`Child\`, {value: ctx['state'].counter}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -247,7 +221,7 @@ exports[`basics child can be updated 2`] = `
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {value: ctx['state'].counter}, key + \`__1\`, node, ctx);
return text(ctx['props'].value);
}
}"
`;
@@ -271,11 +245,8 @@ exports[`basics class parent, class child component with props 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].value;
return block1([d1]);
return component(\`Child\`, {value: 42}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -285,8 +256,11 @@ exports[`basics class parent, class child component with props 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {value: 42}, key + \`__1\`, node, ctx);
let d1 = ctx['props'].value;
return block1([d1]);
}
}"
`;
@@ -350,10 +324,8 @@ exports[`basics higher order components parent and child 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>a</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {child: ctx['state'].child}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -363,19 +335,6 @@ exports[`basics higher order components parent and child 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>b</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics higher order components parent and child 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['props'].child==='a') {
@@ -388,23 +347,12 @@ exports[`basics higher order components parent and child 3`] = `
}"
`;
exports[`basics higher order components parent and child 4`] = `
exports[`basics higher order components parent and child 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {child: ctx['state'].child}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics list of two sub components inside other nodes 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>asdf</span>\`);
let block1 = createBlock(\`<div>a</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -412,7 +360,20 @@ exports[`basics list of two sub components inside other nodes 1`] = `
}"
`;
exports[`basics list of two sub components inside other nodes 2`] = `
exports[`basics higher order components parent and child 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>b</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics list of two sub components inside other nodes 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -437,15 +398,26 @@ exports[`basics list of two sub components inside other nodes 2`] = `
}"
`;
exports[`basics list of two sub components inside other nodes 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>asdf</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics parent, child and grandchild 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -466,8 +438,10 @@ exports[`basics parent, child and grandchild 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey</div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1();
}
}"
`;
@@ -490,19 +464,6 @@ exports[`basics reconciliation alg is not confused in some specific situation 1`
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics reconciliation alg is not confused in some specific situation 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -514,11 +475,35 @@ exports[`basics reconciliation alg is not confused in some specific situation 2`
}"
`;
exports[`basics reconciliation alg is not confused in some specific situation 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics rerendering a widget with a sub widget 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Counter\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics rerendering a widget with a sub widget 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/><button block-handler-1=\\"click\\">Inc</button></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -530,36 +515,11 @@ exports[`basics rerendering a widget with a sub widget 1`] = `
}"
`;
exports[`basics rerendering a widget with a sub widget 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Counter\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics same t-keys in two different places 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].blip;
return block1([d1]);
}
}"
`;
exports[`basics same t-keys in two different places 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><div><block-child-0/></div><div><block-child-1/></div></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -572,6 +532,20 @@ exports[`basics same t-keys in two different places 2`] = `
}"
`;
exports[`basics same t-keys in two different places 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].blip;
return block1([d1]);
}
}"
`;
exports[`basics simple component with a dynamic text 1`] = `
"function anonymous(bdom, helpers
) {
@@ -618,19 +592,6 @@ exports[`basics sub components between t-ifs 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics sub components between t-ifs 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/><span><block-child-2/></span><block-child-3/></div>\`);
let block2 = createBlock(\`<h1>hey</h1>\`);
let block3 = createBlock(\`<h2>noo</h2>\`);
@@ -652,12 +613,12 @@ exports[`basics sub components between t-ifs 2`] = `
}"
`;
exports[`basics t-elif works with t-component 1`] = `
exports[`basics sub components between t-ifs 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>hey</span>\`);
let block1 = createBlock(\`<span>child</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -665,7 +626,7 @@ exports[`basics t-elif works with t-component 1`] = `
}"
`;
exports[`basics t-elif works with t-component 2`] = `
exports[`basics t-elif works with t-component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -685,7 +646,7 @@ exports[`basics t-elif works with t-component 2`] = `
}"
`;
exports[`basics t-else with empty string works with t-component 1`] = `
exports[`basics t-elif works with t-component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -698,22 +659,35 @@ exports[`basics t-else with empty string works with t-component 1`] = `
}"
`;
exports[`basics t-else with empty string works with t-component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block2 = createBlock(\`<div>somediv</div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['state'].flag) {
b2 = block2();
} else {
b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2, b3]);
}
}"
`;
exports[`basics t-else with empty string works with t-component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block2 = createBlock(\`<div>somediv</div>\`);
let block1 = createBlock(\`<span>hey</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['state'].flag) {
b2 = block2();
} else {
b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2, b3]);
return block1();
}
}"
`;
@@ -723,19 +697,6 @@ exports[`basics t-else works with t-component 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>hey</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics t-else works with t-component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block2 = createBlock(\`<div>somediv</div>\`);
@@ -751,7 +712,7 @@ exports[`basics t-else works with t-component 2`] = `
}"
`;
exports[`basics t-if works with t-component 1`] = `
exports[`basics t-else works with t-component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -764,7 +725,7 @@ exports[`basics t-if works with t-component 1`] = `
}"
`;
exports[`basics t-if works with t-component 2`] = `
exports[`basics t-if works with t-component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -781,12 +742,12 @@ exports[`basics t-if works with t-component 2`] = `
}"
`;
exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
exports[`basics t-if works with t-component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child</span>\`);
let block1 = createBlock(\`<span>hey</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -794,7 +755,7 @@ exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
}"
`;
exports[`basics t-key on a component with t-if, and a sibling component 2`] = `
exports[`basics t-key on a component with t-if, and a sibling component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -813,12 +774,12 @@ exports[`basics t-key on a component with t-if, and a sibling component 2`] = `
}"
`;
exports[`basics text after a conditional component 1`] = `
exports[`basics t-key on a component with t-if, and a sibling component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<p>simple vnode</p>\`);
let block1 = createBlock(\`<span>child</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -826,7 +787,7 @@ exports[`basics text after a conditional component 1`] = `
}"
`;
exports[`basics text after a conditional component 2`] = `
exports[`basics text after a conditional component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -844,15 +805,26 @@ exports[`basics text after a conditional component 2`] = `
}"
`;
exports[`basics text after a conditional component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<p>simple vnode</p>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics three level of components with collapsing root nodes 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>2</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -873,18 +845,7 @@ exports[`basics three level of components with collapsing root nodes 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics throws if mounting on target=null 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>simple vnode</span>\`);
let block1 = createBlock(\`<div>2</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -897,10 +858,10 @@ exports[`basics two child components 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
return multi([b2, b3]);
}
}"
`;
@@ -910,10 +871,10 @@ exports[`basics two child components 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`Child\`, {}, key + \`__2\`, node, ctx);
return multi([b2, b3]);
return block1();
}
}"
`;
@@ -923,12 +884,12 @@ exports[`basics update props of component without concrete own node 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div class=\\"widget-subkey\\"><block-text-0/>__<block-text-1/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].key;
let d2 = ctx['props'].subKey;
return block1([d1, d2]);
const tKey_1 = ctx['childProps'].key;
let b2 = toggler(tKey_1, component(\`Child\`, ctx['childProps'], tKey_1 + key + \`__2\`, node, ctx));
return block1([], [b2]);
}
}"
`;
@@ -950,12 +911,12 @@ exports[`basics update props of component without concrete own node 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<div class=\\"widget-subkey\\"><block-text-0/>__<block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['childProps'].key;
let b2 = toggler(tKey_1, component(\`Child\`, ctx['childProps'], tKey_1 + key + \`__2\`, node, ctx));
return block1([], [b2]);
let d1 = ctx['props'].key;
let d2 = ctx['props'].subKey;
return block1([d1, d2]);
}
}"
`;
@@ -984,6 +945,17 @@ exports[`basics updating widget immediately 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {flag: ctx['state'].flag}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics updating widget immediately 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>abc<block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -996,32 +968,8 @@ exports[`basics updating widget immediately 1`] = `
}"
`;
exports[`basics updating widget immediately 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {flag: ctx['state'].flag}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics widget after a t-foreach 1`] = `
"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[`basics widget after a t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
@@ -1045,12 +993,12 @@ exports[`basics widget after a t-foreach 2`] = `
}"
`;
exports[`basics zero or one child components 1`] = `
exports[`basics widget after a t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -1058,7 +1006,7 @@ exports[`basics zero or one child components 1`] = `
}"
`;
exports[`basics zero or one child components 2`] = `
exports[`basics zero or one child components 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -1073,6 +1021,19 @@ exports[`basics zero or one child components 2`] = `
}"
`;
exports[`basics zero or one child components 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`mount targets can mount a component (with default position='last-child') 1`] = `
"function anonymous(bdom, helpers
) {
@@ -1117,10 +1078,11 @@ exports[`support svg components add proper namespace to svg 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<g block-ns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/></g>\`);
let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`GComp\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
@@ -1130,11 +1092,10 @@ exports[`support svg components add proper namespace to svg 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);
let block1 = createBlock(\`<g block-ns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/></g>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`GComp\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
return block1();
}
}"
`;
tests/components/__snapshots__/concurrency.test.ts.snap
+332 -332
View File
File diff suppressed because it is too large Load Diff
tests/components/__snapshots__/error_handling.test.ts.snap
+263 -263
View File
@@ -16,20 +16,6 @@ exports[`basics no component catching error lead to full app destruction 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].flag&&ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
exports[`basics no component catching error lead to full app destruction 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -39,21 +25,21 @@ exports[`basics no component catching error lead to full app destruction 2`] = `
}"
`;
exports[`basics simple catchError 1`] = `
exports[`basics no component catching error lead to full app destruction 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['a'].b.c;
let d1 = ctx['props'].flag&&ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
exports[`basics simple catchError 2`] = `
exports[`basics simple catchError 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -72,16 +58,34 @@ exports[`basics simple catchError 2`] = `
}"
`;
exports[`basics simple catchError 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['a'].b.c;
return block1([d1]);
}
}"
`;
exports[`can catch errors can catch an error in a component render function 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {flag: ctx['state'].flag}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].flag&&ctx['state'].this.will.crash;
return block1([d1]);
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
@@ -111,15 +115,11 @@ exports[`can catch errors can catch an error in a component render function 3`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {flag: ctx['state'].flag}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
let d1 = ctx['props'].flag&&ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
@@ -129,10 +129,15 @@ exports[`can catch errors can catch an error in the constructor call of a compon
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
return block1();
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
@@ -162,29 +167,23 @@ exports[`can catch errors can catch an error in the constructor call of a compon
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>classic</div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
let b3 = component(\`ClassicCompoent\`, {}, key + \`__2\`, node, ctx);
let b4 = component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
return multi([b3, b4]);
}
return function template(ctx, node, key = \\"\\") {
return block1();
let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return block1([], [b5]);
}
}"
`;
exports[`can catch errors can catch an error in the constructor call of a component render function 2 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors can catch an error in the constructor call of a component render function 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
@@ -203,22 +202,28 @@ exports[`can catch errors can catch an error in the constructor call of a compon
}"
`;
exports[`can catch errors can catch an error in the constructor call of a component render function 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>classic</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors can catch an error in the constructor call of a component render function 2 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
let b3 = component(\`ClassicCompoent\`, {}, key + \`__2\`, node, ctx);
let b4 = component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
return multi([b3, b4]);
}
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
let b5 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return block1([], [b5]);
return block1();
}
}"
`;
@@ -228,6 +233,19 @@ exports[`can catch errors can catch an error in the constructor call of a compon
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -241,20 +259,6 @@ exports[`can catch errors can catch an error in the constructor call of a compon
}"
`;
exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
exports[`can catch errors can catch an error in the initial call of a component render function (parent mounted) 2`] = `
"function anonymous(bdom, helpers
) {
@@ -280,15 +284,11 @@ exports[`can catch errors can catch an error in the initial call of a component
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
let d1 = ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
@@ -298,11 +298,18 @@ exports[`can catch errors can catch an error in the initial call of a component
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].this.will.crash;
return block1([d1]);
let b3;
if (ctx['state'].flag) {
b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
}
return block1([], [b3]);
}
}"
`;
@@ -332,18 +339,11 @@ exports[`can catch errors can catch an error in the initial call of a component
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div>hey<block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3;
if (ctx['state'].flag) {
b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
}
return block1([], [b3]);
let d1 = ctx['state'].this.will.crash;
return block1([d1]);
}
}"
`;
@@ -353,10 +353,8 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`B\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -366,6 +364,20 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`C\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`can catch errors can catch an error in the mounted call (in child of child) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -380,36 +392,11 @@ exports[`can catch errors can catch an error in the mounted call (in child of ch
}"
`;
exports[`can catch errors can catch an error in the mounted call (in child of child) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`C\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`can catch errors can catch an error in the mounted call (in child of child) 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`B\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`can catch errors can catch an error in the mounted call (in root component) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -418,7 +405,7 @@ exports[`can catch errors can catch an error in the mounted call (in root compon
}"
`;
exports[`can catch errors can catch an error in the mounted call (in root component) 2`] = `
exports[`can catch errors can catch an error in the mounted call (in root component) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -437,7 +424,7 @@ exports[`can catch errors can catch an error in the mounted call (in root compon
}"
`;
exports[`can catch errors can catch an error in the mounted call 1`] = `
exports[`can catch errors can catch an error in the mounted call (in root component) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -450,6 +437,24 @@ exports[`can catch errors can catch an error in the mounted call 1`] = `
}"
`;
exports[`can catch errors can catch an error in the mounted call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
exports[`can catch errors can catch an error in the mounted call 2`] = `
"function anonymous(bdom, helpers
) {
@@ -475,15 +480,10 @@ exports[`can catch errors can catch an error in the mounted call 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
return block1();
}
}"
`;
@@ -493,11 +493,16 @@ exports[`can catch errors can catch an error in the willPatch call 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<div><span><block-text-0/></span><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {message: ctx['state'].message}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].message;
return block1([d1]);
let d1 = ctx['state'].message;
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([d1], [b3]);
}
}"
`;
@@ -527,16 +532,11 @@ exports[`can catch errors can catch an error in the willPatch call 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><span><block-text-0/></span><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {message: ctx['state'].message}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].message;
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([d1], [b3]);
let d1 = ctx['props'].message;
return block1([d1]);
}
}"
`;
@@ -546,10 +546,15 @@ exports[`can catch errors can catch an error in the willStart call 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
return block1();
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
@@ -579,37 +584,6 @@ exports[`can catch errors can catch an error in the willStart call 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>classic</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -618,27 +592,7 @@ exports[`can catch errors can catch an error origination from a child's willStar
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['state'].error) {
b2 = text(\`Error handled\`);
} else {
b3 = callSlot(ctx, node, key, 'default', false, {});
}
return block1([], [b2, b3]);
}
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 4`] = `
exports[`can catch errors can catch an error origination from a child's willStart function 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -658,16 +612,67 @@ exports[`can catch errors can catch an error origination from a child's willStar
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['state'].error) {
b2 = text(\`Error handled\`);
} else {
b3 = callSlot(ctx, node, key, 'default', false, {});
}
return block1([], [b2, b3]);
}
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>classic</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors can catch an error origination from a child's willStart function 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`can catch errors catchError in catchError 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['a'].b.c;
return block1([d1]);
let b2,b3;
if (ctx['error']) {
b2 = text(\`Error\`);
} else {
b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2, b3]);
}
}"
`;
@@ -691,16 +696,11 @@ exports[`can catch errors catchError in catchError 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['error']) {
b2 = text(\`Error\`);
} else {
b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2, b3]);
let d1 = ctx['a'].b.c;
return block1([d1]);
}
}"
`;
@@ -710,16 +710,33 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>Some text</div>\`);
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
function slot2(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`OK\`, {}, key + \`__1\`, node, ctx);
let b4 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return block1([], [b2, b4]);
}
}"
`;
exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(\`OK\`);
}
}"
`;
exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
@@ -738,32 +755,15 @@ exports[`can catch errors error in mounted on a component with a sibling (proper
}"
`;
exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(\`OK\`);
}
}"
`;
exports[`can catch errors error in mounted on a component with a sibling (properly mounted) 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
function slot2(ctx, node, key = \\"\\") {
return component(\`ErrorComponent\`, {}, key + \`__3\`, node, ctx);
}
let block1 = createBlock(\`<div>Some text</div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`OK\`, {}, key + \`__1\`, node, ctx);
let b4 = component(\`ErrorBoundary\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return block1([], [b2, b4]);
return block1();
}
}"
`;
@@ -773,16 +773,8 @@ exports[`can catch errors onError in class inheritance is called if rethrown 1`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (!ctx['state'].error) {
b2 = text(this.will.crash);
} else {
b3 = text(ctx['state'].error);
}
return block1([], [b2, b3]);
return component(\`Concrete\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -792,13 +784,32 @@ exports[`can catch errors onError in class inheritance is called if rethrown 2`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (!ctx['state'].error) {
b2 = text(this.will.crash);
} else {
b3 = text(ctx['state'].error);
}
return block1([], [b2, b3]);
}
}"
`;
exports[`can catch errors onError in class inheritance is not called if no rethrown 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Concrete\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`can catch errors onError in class inheritance is not called if no rethrown 1`] = `
exports[`can catch errors onError in class inheritance is not called if no rethrown 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -817,36 +828,11 @@ exports[`can catch errors onError in class inheritance is not called if no rethr
}"
`;
exports[`can catch errors onError in class inheritance is not called if no rethrown 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Concrete\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`errors and promises a rendering error in a sub component will reject the mount promise 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = this.will.crash;
return block1([d1]);
}
}"
`;
exports[`errors and promises a rendering error in a sub component will reject the mount promise 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -856,6 +842,20 @@ exports[`errors and promises a rendering error in a sub component will reject th
}"
`;
exports[`errors and promises a rendering error in a sub component will reject the mount promise 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = this.will.crash;
return block1([d1]);
}
}"
`;
exports[`errors and promises a rendering error will reject the mount promise 1`] = `
"function anonymous(bdom, helpers
) {
@@ -875,10 +875,12 @@ exports[`errors and promises a rendering error will reject the render promise (w
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span/>\`);
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let d1 = ctx['x'].y;
return block1([d1], [b2]);
}
}"
`;
@@ -888,12 +890,10 @@ exports[`errors and promises a rendering error will reject the render promise (w
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
let block1 = createBlock(\`<span/>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
let d1 = ctx['x'].y;
return block1([d1], [b2]);
return block1();
}
}"
`;
tests/components/__snapshots__/event_handling.test.ts.snap
+13 -13
View File
@@ -5,19 +5,6 @@ exports[`event handling handler receive the event as argument 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`event handling handler receive the event as argument 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span block-handler-0=\\"click\\"><block-child-0/><block-text-1/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -29,6 +16,19 @@ exports[`event handling handler receive the event as argument 2`] = `
}"
`;
exports[`event handling handler receive the event as argument 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>simple vnode</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`event handling objects from scope are properly captured by t-on 1`] = `
"function anonymous(bdom, helpers
) {
tests/components/__snapshots__/higher_order_component.test.ts.snap
+56 -56
View File
@@ -5,6 +5,17 @@ exports[`basics basic use 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {p: 1}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics basic use 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child<block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -14,48 +25,11 @@ exports[`basics basic use 1`] = `
}"
`;
exports[`basics basic use 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {p: 1}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics can select a sub widget 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>CHILD 1</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics can select a sub widget 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>CHILD 2</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics can select a sub widget 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['env'].options.flag) {
@@ -69,7 +43,7 @@ exports[`basics can select a sub widget 3`] = `
}"
`;
exports[`basics can select a sub widget, part 2 1`] = `
exports[`basics can select a sub widget 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -82,7 +56,7 @@ exports[`basics can select a sub widget, part 2 1`] = `
}"
`;
exports[`basics can select a sub widget, part 2 2`] = `
exports[`basics can select a sub widget 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -95,7 +69,7 @@ exports[`basics can select a sub widget, part 2 2`] = `
}"
`;
exports[`basics can select a sub widget, part 2 3`] = `
exports[`basics can select a sub widget, part 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -113,11 +87,48 @@ exports[`basics can select a sub widget, part 2 3`] = `
}"
`;
exports[`basics can select a sub widget, part 2 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>CHILD 1</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics can select a sub widget, part 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>CHILD 2</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`basics sub widget is interactive 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {p: 1}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics sub widget is interactive 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><button block-handler-0=\\"click\\">click</button>child<block-text-1/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -128,26 +139,16 @@ exports[`basics sub widget is interactive 1`] = `
}"
`;
exports[`basics sub widget is interactive 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {p: 1}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics top level sub widget with a parent 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>Hello</span>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`ComponentB\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
@@ -168,11 +169,10 @@ exports[`basics top level sub widget with a parent 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<span>Hello</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`ComponentB\`, {}, key + \`__1\`, node, ctx);
return block1([], [b2]);
return block1();
}
}"
`;
tests/components/__snapshots__/hooks.test.ts.snap
+27 -27
View File
@@ -42,11 +42,8 @@ exports[`hooks can use onWillStart, onWillUpdateProps 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].value;
return block1([d1]);
return component(\`MyComponent\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -56,8 +53,11 @@ exports[`hooks can use onWillStart, onWillUpdateProps 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`MyComponent\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
let d1 = ctx['props'].value;
return block1([d1]);
}
}"
`;
@@ -108,11 +108,10 @@ exports[`hooks parent and child env 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['env'].val;
return block1([d1]);
let b2 = text(ctx['env'].val);
let b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return multi([b2, b3]);
}
}"
`;
@@ -122,10 +121,11 @@ exports[`hooks parent and child env 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = text(ctx['env'].val);
let b3 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
return multi([b2, b3]);
let d1 = ctx['env'].val;
return block1([d1]);
}
}"
`;
@@ -163,12 +163,8 @@ exports[`hooks use sub env supports arbitrary descriptor 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/> <block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['env'].someVal;
let d2 = ctx['env'].someVal2;
return block1([d1, d2]);
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -178,8 +174,12 @@ exports[`hooks use sub env supports arbitrary descriptor 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/> <block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
let d1 = ctx['env'].someVal;
let d2 = ctx['env'].someVal2;
return block1([d1, d2]);
}
}"
`;
@@ -229,11 +229,12 @@ exports[`hooks useExternalListener 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].value;
return block1([d1]);
let b2;
if (ctx['state'].flag) {
b2 = component(\`MyComponent\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
}
}"
`;
@@ -243,12 +244,11 @@ exports[`hooks useExternalListener 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].flag) {
b2 = component(\`MyComponent\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
let d1 = ctx['props'].value;
return block1([d1]);
}
}"
`;
tests/components/__snapshots__/lifecycle.test.ts.snap
+176 -200
View File
@@ -18,10 +18,12 @@ exports[`lifecycle hooks component semantics 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>B</div>\`);
let block1 = createBlock(\`<div>A<block-child-0/><block-child-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2 = component(\`B\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`C\`, {}, key + \`__2\`, node, ctx);
return block1([], [b2, b3]);
}
}"
`;
@@ -31,7 +33,7 @@ exports[`lifecycle hooks component semantics 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>D</div>\`);
let block1 = createBlock(\`<div>B</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -44,32 +46,6 @@ exports[`lifecycle hooks component semantics 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>E</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks component semantics 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>F</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks component semantics 5`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>C<block-child-0/><block-child-1/><block-child-2/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -85,17 +61,41 @@ exports[`lifecycle hooks component semantics 5`] = `
}"
`;
exports[`lifecycle hooks component semantics 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>D</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks component semantics 5`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>E</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks component semantics 6`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>A<block-child-0/><block-child-1/></div>\`);
let block1 = createBlock(\`<div>F</div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`B\`, {}, key + \`__1\`, node, ctx);
let b3 = component(\`C\`, {}, key + \`__2\`, node, ctx);
return block1([], [b2, b3]);
return block1();
}
}"
`;
@@ -105,20 +105,6 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].n;
return block1([d1]);
}
}"
`;
exports[`lifecycle hooks components are unmounted and destroyed if no longer in DOM, even after updateprops 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block2 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -132,20 +118,21 @@ exports[`lifecycle hooks components are unmounted and destroyed if no longer in
}"
`;
exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 1`] = `
exports[`lifecycle hooks components are unmounted and destroyed if no longer in DOM, even after updateprops 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let d1 = ctx['props'].n;
return block1([d1]);
}
}"
`;
exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 2`] = `
exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -160,7 +147,7 @@ exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM
}"
`;
exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 1`] = `
exports[`lifecycle hooks components are unmounted destroyed if no longer in DOM 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -173,7 +160,7 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
}"
`;
exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 2`] = `
exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -187,7 +174,7 @@ exports[`lifecycle hooks hooks are called in proper order in widget creation/des
}"
`;
exports[`lifecycle hooks lifecycle semantics 1`] = `
exports[`lifecycle hooks hooks are called in proper order in widget creation/destruction 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -200,7 +187,7 @@ exports[`lifecycle hooks lifecycle semantics 1`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics 2`] = `
exports[`lifecycle hooks lifecycle semantics 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -214,7 +201,7 @@ exports[`lifecycle hooks lifecycle semantics 2`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
exports[`lifecycle hooks lifecycle semantics 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -227,6 +214,21 @@ exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].hasChild) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
}
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 2 2`] = `
"function anonymous(bdom, helpers
) {
@@ -243,21 +245,6 @@ exports[`lifecycle hooks lifecycle semantics, part 2 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].hasChild) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
}
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
@@ -266,18 +253,7 @@ exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 3 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`GrandChild\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 3 3`] = `
exports[`lifecycle hooks lifecycle semantics, part 3 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -297,10 +273,12 @@ exports[`lifecycle hooks lifecycle semantics, part 4 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let b2;
if (ctx['state'].hasChild) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
}
}"
`;
@@ -321,12 +299,10 @@ exports[`lifecycle hooks lifecycle semantics, part 4 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].hasChild) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return multi([b2]);
return block1();
}
}"
`;
@@ -336,19 +312,6 @@ exports[`lifecycle hooks lifecycle semantics, part 5 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].hasChild) {
@@ -359,7 +322,7 @@ exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
exports[`lifecycle hooks lifecycle semantics, part 5 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -372,7 +335,7 @@ exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 6 2`] = `
exports[`lifecycle hooks lifecycle semantics, part 6 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -383,6 +346,19 @@ exports[`lifecycle hooks lifecycle semantics, part 6 2`] = `
}"
`;
exports[`lifecycle hooks lifecycle semantics, part 6 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[`lifecycle hooks mounted hook is called if mounted in DOM 1`] = `
"function anonymous(bdom, helpers
) {
@@ -401,19 +377,6 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>child</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks mounted hook is called on every mount, not just the first one 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].hasChild) {
@@ -424,12 +387,12 @@ exports[`lifecycle hooks mounted hook is called on every mount, not just the fir
}"
`;
exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 1`] = `
exports[`lifecycle hooks mounted hook is called on every mount, not just the first one 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
let block1 = createBlock(\`<div>child</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
@@ -437,7 +400,7 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
}"
`;
exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 2`] = `
exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -451,7 +414,7 @@ exports[`lifecycle hooks mounted hook is called on subcomponents, in proper orde
}"
`;
exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 1`] = `
exports[`lifecycle hooks mounted hook is called on subcomponents, in proper order 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -464,6 +427,23 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
}"
`;
exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].flag) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2]);
}
}"
`;
exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper order 2`] = `
"function anonymous(bdom, helpers
) {
@@ -483,14 +463,10 @@ exports[`lifecycle hooks mounted hook is called on subsubcomponents, in proper o
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].flag) {
b2 = component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
return block1([], [b2]);
return block1();
}
}"
`;
@@ -500,6 +476,17 @@ exports[`lifecycle hooks onWillRender 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`lifecycle hooks onWillRender 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button block-handler-0=\\"click\\"><block-text-1/></button>\`);
return function template(ctx, node, key = \\"\\") {
@@ -510,35 +497,11 @@ exports[`lifecycle hooks onWillRender 1`] = `
}"
`;
exports[`lifecycle hooks onWillRender 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`lifecycle hooks patched hook is called after updateProps 1`] = `
"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[`lifecycle hooks patched hook is called after updateProps 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -548,6 +511,19 @@ exports[`lifecycle hooks patched hook is called after updateProps 2`] = `
}"
`;
exports[`lifecycle hooks patched hook is called after updateProps 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[`lifecycle hooks patched hook is called after updating State 1`] = `
"function anonymous(bdom, helpers
) {
@@ -609,19 +585,6 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly called 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2;
if (ctx['state'].flag) {
@@ -632,16 +595,29 @@ exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly calle
}"
`;
exports[`lifecycle hooks sub widget (inside sub node): hooks are correctly called 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[`lifecycle hooks willPatch, patched hook are called on subsubcomponents, in proper order 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].n;
return block1([d1]);
let b2 = component(\`Child\`, {n: ctx['state'].n}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
@@ -665,11 +641,11 @@ exports[`lifecycle hooks willPatch, patched hook are called on subsubcomponents,
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {n: ctx['state'].n}, key + \`__1\`, node, ctx);
return block1([], [b2]);
let d1 = ctx['props'].n;
return block1([d1]);
}
}"
`;
@@ -679,10 +655,8 @@ exports[`lifecycle hooks willStart hook is called on sub component 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -692,8 +666,10 @@ exports[`lifecycle hooks willStart hook is called on sub component 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
return block1();
}
}"
`;
@@ -729,19 +705,6 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is mounted in some other position 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/><block-child-1/></div>\`);
let block3 = createBlock(\`<div/>\`);
@@ -757,11 +720,35 @@ exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is
}"
`;
exports[`lifecycle hooks willStart, mounted on subwidget rendered after main is mounted in some other position 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[`lifecycle hooks willUpdateProps hook is called 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {n: ctx['state'].n}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`lifecycle hooks willUpdateProps hook is called 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -770,14 +757,3 @@ exports[`lifecycle hooks willUpdateProps hook is called 1`] = `
}
}"
`;
exports[`lifecycle hooks willUpdateProps hook is called 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {n: ctx['state'].n}, key + \`__1\`, node, ctx);
}
}"
`;
tests/components/__snapshots__/props.test.ts.snap
+95 -95
View File
@@ -5,20 +5,6 @@ exports[`basics accept ES6-like syntax for props (with getters) 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].greetings;
return block1([d1]);
}
}"
`;
exports[`basics accept ES6-like syntax for props (with getters) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -28,21 +14,21 @@ exports[`basics accept ES6-like syntax for props (with getters) 2`] = `
}"
`;
exports[`basics arrow functions as prop correctly capture their scope 1`] = `
exports[`basics accept ES6-like syntax for props (with getters) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button block-handler-0=\\"click\\"/>\`);
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['props'].onClick, ctx];
let d1 = ctx['props'].greetings;
return block1([d1]);
}
}"
`;
exports[`basics arrow functions as prop correctly capture their scope 2`] = `
exports[`basics arrow functions as prop correctly capture their scope 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -63,60 +49,7 @@ exports[`basics arrow functions as prop correctly capture their scope 2`] = `
}"
`;
exports[`basics explicit object prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].someval;
return block1([d1]);
}
}"
`;
exports[`basics explicit object prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {value: ctx['state'].val}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`basics prop names can contain - 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props']['prop-name'];
return block1([d1]);
}
}"
`;
exports[`basics prop names can contain - 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {'prop-name': 7}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics support prop names that aren't valid bare object property names 1`] = `
exports[`basics arrow functions as prop correctly capture their scope 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -130,7 +63,60 @@ exports[`basics support prop names that aren't valid bare object property names
}"
`;
exports[`basics support prop names that aren't valid bare object property names 2`] = `
exports[`basics explicit object prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {value: ctx['state'].val}, key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`basics explicit object prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].someval;
return block1([d1]);
}
}"
`;
exports[`basics prop names can contain - 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {'prop-name': 7}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`basics prop names can contain - 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props']['prop-name'];
return block1([d1]);
}
}"
`;
exports[`basics support prop names that aren't valid bare object property names 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -141,23 +127,21 @@ exports[`basics support prop names that aren't valid bare object property names
}"
`;
exports[`basics t-set with a body expression can be passed in props, and then t-out 1`] = `
exports[`basics support prop names that aren't valid bare object property names 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { safeOutput } = helpers;
let block1 = createBlock(\`<span><block-text-0/><block-child-0/></span>\`);
let block1 = createBlock(\`<button block-handler-0=\\"click\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
let b2 = safeOutput(ctx['props'].val);
return block1([d1], [b2]);
let d1 = [ctx['props'].onClick, ctx];
return block1([d1]);
}
}"
`;
exports[`basics t-set with a body expression can be passed in props, and then t-out 2`] = `
exports[`basics t-set with a body expression can be passed in props, and then t-out 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -177,21 +161,23 @@ exports[`basics t-set with a body expression can be passed in props, and then t-
}"
`;
exports[`basics t-set with a body expression can be used as textual prop 1`] = `
exports[`basics t-set with a body expression can be passed in props, and then t-out 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { safeOutput } = helpers;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
let block1 = createBlock(\`<span><block-text-0/><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
let b2 = safeOutput(ctx['props'].val);
return block1([d1], [b2]);
}
}"
`;
exports[`basics t-set with a body expression can be used as textual prop 2`] = `
exports[`basics t-set with a body expression can be used as textual prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -209,7 +195,7 @@ exports[`basics t-set with a body expression can be used as textual prop 2`] = `
}"
`;
exports[`basics t-set works 1`] = `
exports[`basics t-set with a body expression can be used as textual prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -223,7 +209,7 @@ exports[`basics t-set works 1`] = `
}"
`;
exports[`basics t-set works 2`] = `
exports[`basics t-set works 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -241,18 +227,21 @@ exports[`basics t-set works 2`] = `
}"
`;
exports[`basics template string in prop 1`] = `
exports[`basics t-set works 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
return text(\`\`);
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`basics template string in prop 2`] = `
exports[`basics template string in prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -263,18 +252,18 @@ exports[`basics template string in prop 2`] = `
}"
`;
exports[`bound functions is referentially equal after update 1`] = `
exports[`basics template string in prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['props'].val);
return text(\`\`);
}
}"
`;
exports[`bound functions is referentially equal after update 2`] = `
exports[`bound functions is referentially equal after update 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -286,18 +275,18 @@ exports[`bound functions is referentially equal after update 2`] = `
}"
`;
exports[`can bind function prop with bind suffix 1`] = `
exports[`bound functions is referentially equal after update 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(\`child\`);
return text(ctx['props'].val);
}
}"
`;
exports[`can bind function prop with bind suffix 2`] = `
exports[`can bind function prop with bind suffix 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -308,3 +297,14 @@ exports[`can bind function prop with bind suffix 2`] = `
}
}"
`;
exports[`can bind function prop with bind suffix 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(\`child\`);
}
}"
`;
tests/components/__snapshots__/props_validation.test.ts.snap
+1022 -15
View File
File diff suppressed because it is too large Load Diff
tests/components/__snapshots__/reactivity.test.ts.snap
+15 -15
View File
@@ -47,21 +47,6 @@ exports[`reactivity in lifecycle state changes in willUnmount do not trigger rer
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
let d2 = ctx['state'].n;
return block1([d1, d2]);
}
}"
`;
exports[`reactivity in lifecycle state changes in willUnmount do not trigger rerender 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -73,3 +58,18 @@ exports[`reactivity in lifecycle state changes in willUnmount do not trigger rer
}
}"
`;
exports[`reactivity in lifecycle state changes in willUnmount do not trigger rerender 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
let d2 = ctx['state'].n;
return block1([d1, d2]);
}
}"
`;
tests/components/__snapshots__/refs.test.ts.snap
+15 -15
View File
@@ -17,21 +17,6 @@ exports[`refs basic use 1`] = `
exports[`refs refs are properly bound in slots 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2]);
}
}"
`;
exports[`refs refs are properly bound in slots 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { capture } = helpers;
@@ -54,3 +39,18 @@ exports[`refs refs are properly bound in slots 2`] = `
}
}"
`;
exports[`refs refs are properly bound in slots 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { callSlot } = helpers;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callSlot(ctx, node, key, 'footer', false, {});
return block1([], [b2]);
}
}"
`;
tests/components/__snapshots__/slots.test.ts.snap
+638 -638
View File
File diff suppressed because it is too large Load Diff
tests/components/__snapshots__/style_class.test.ts.snap
+113 -113
View File
@@ -5,6 +5,17 @@ exports[`style and class handling can set class on multi root component 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'fromparent'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling can set class on multi root component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block2 = createBlock(\`<div>a</div>\`);
let block3 = createBlock(\`<span block-attribute-0=\\"class\\">b</span>\`);
@@ -17,18 +28,18 @@ exports[`style and class handling can set class on multi root component 1`] = `
}"
`;
exports[`style and class handling can set class on multi root component 2`] = `
exports[`style and class handling can set class on sub component, as prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'fromparent'}, key + \`__1\`, node, ctx);
return component(\`Child\`, {class: 'some-class'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling can set class on sub component, as prop 1`] = `
exports[`style and class handling can set class on sub component, as prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -42,27 +53,13 @@ exports[`style and class handling can set class on sub component, as prop 1`] =
}"
`;
exports[`style and class handling can set class on sub component, as prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'some-class'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling can set class on sub sub component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">childchild</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
return component(\`Child\`, {class: 'fromparent'}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -83,8 +80,11 @@ exports[`style and class handling can set class on sub sub component 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">childchild</div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'fromparent'}, key + \`__1\`, node, ctx);
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
@@ -94,11 +94,8 @@ exports[`style and class handling can set more than one class on sub component 1
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">child</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
return component(\`Child\`, {class: 'a b'}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -108,8 +105,11 @@ exports[`style and class handling can set more than one class on sub component 2
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">child</div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'a b'}, key + \`__1\`, node, ctx);
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
@@ -146,11 +146,8 @@ exports[`style and class handling class on sub component, which is switched to a
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">a</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
return component(\`Child\`, {class: 'someclass',child: ctx['state'].child}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -160,20 +157,6 @@ exports[`style and class handling class on sub component, which is switched to a
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span block-attribute-0=\\"class\\">b</span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
exports[`style and class handling class on sub component, which is switched to another 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let b2,b3;
if (ctx['props'].child==='a') {
@@ -186,23 +169,12 @@ exports[`style and class handling class on sub component, which is switched to a
}"
`;
exports[`style and class handling class on sub component, which is switched to another 4`] = `
exports[`style and class handling class on sub component, which is switched to another 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'someclass',child: ctx['state'].child}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling class with extra whitespaces (variation) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
let block1 = createBlock(\`<div block-attribute-0=\\"class\\">a</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
@@ -211,7 +183,21 @@ exports[`style and class handling class with extra whitespaces (variation) 1`] =
}"
`;
exports[`style and class handling class with extra whitespaces (variation) 2`] = `
exports[`style and class handling class on sub component, which is switched to another 4`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span block-attribute-0=\\"class\\">b</span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
exports[`style and class handling class with extra whitespaces (variation) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -225,7 +211,7 @@ exports[`style and class handling class with extra whitespaces (variation) 2`] =
}"
`;
exports[`style and class handling class with extra whitespaces 1`] = `
exports[`style and class handling class with extra whitespaces (variation) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -239,7 +225,7 @@ exports[`style and class handling class with extra whitespaces 1`] = `
}"
`;
exports[`style and class handling class with extra whitespaces 2`] = `
exports[`style and class handling class with extra whitespaces 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -250,16 +236,27 @@ exports[`style and class handling class with extra whitespaces 2`] = `
}"
`;
exports[`style and class handling class with extra whitespaces 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
exports[`style and class handling component class and parent class combine together 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div class=\\"child\\" block-attribute-0=\\"class\\">child</div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
return component(\`Child\`, {class: 'from parent'}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -269,8 +266,11 @@ exports[`style and class handling component class and parent class combine toget
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div class=\\"child\\" block-attribute-0=\\"class\\">child</div>\`);
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'from parent'}, key + \`__1\`, node, ctx);
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
@@ -307,20 +307,6 @@ exports[`style and class handling empty class attribute is not added on widget r
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span block-attribute-0=\\"class\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
exports[`style and class handling empty class attribute is not added on widget root el 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -330,11 +316,36 @@ exports[`style and class handling empty class attribute is not added on widget r
}"
`;
exports[`style and class handling empty class attribute is not added on widget root el 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span block-attribute-0=\\"class\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].class;
return block1([d1]);
}
}"
`;
exports[`style and class handling error in subcomponent with class 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'a'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling error in subcomponent with class 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"class\\"><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -345,18 +356,18 @@ exports[`style and class handling error in subcomponent with class 1`] = `
}"
`;
exports[`style and class handling error in subcomponent with class 2`] = `
exports[`style and class handling no class is set is child ignores it 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'a'}, key + \`__1\`, node, ctx);
return component(\`Child\`, {class: 'hey'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling no class is set is child ignores it 1`] = `
exports[`style and class handling no class is set is child ignores it 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -369,18 +380,18 @@ exports[`style and class handling no class is set is child ignores it 1`] = `
}"
`;
exports[`style and class handling no class is set is child ignores it 2`] = `
exports[`style and class handling no class is set is parent does not give it as prop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {class: 'hey'}, key + \`__1\`, node, ctx);
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling no class is set is parent does not give it as prop 1`] = `
exports[`style and class handling no class is set is parent does not give it as prop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -394,18 +405,18 @@ exports[`style and class handling no class is set is parent does not give it as
}"
`;
exports[`style and class handling no class is set is parent does not give it as prop 2`] = `
exports[`style and class handling style is properly added on widget root el 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
return component(\`Child\`, {style: 'font-weight: bold;'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling style is properly added on widget root el 1`] = `
exports[`style and class handling style is properly added on widget root el 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -419,36 +430,11 @@ exports[`style and class handling style is properly added on widget root el 1`]
}"
`;
exports[`style and class handling style is properly added on widget root el 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {style: 'font-weight: bold;'}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`style and class handling t-att-class is properly added/removed on widget root el (v2) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span class=\\"c\\" block-attribute-0=\\"class\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = {d:ctx['state'].d,...ctx['props'].class};
return block1([d1]);
}
}"
`;
exports[`style and class handling t-att-class is properly added/removed on widget root el (v2) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -458,7 +444,7 @@ exports[`style and class handling t-att-class is properly added/removed on widge
}"
`;
exports[`style and class handling t-att-class is properly added/removed on widget root el (v3) 1`] = `
exports[`style and class handling t-att-class is properly added/removed on widget root el (v2) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -472,7 +458,7 @@ exports[`style and class handling t-att-class is properly added/removed on widge
}"
`;
exports[`style and class handling t-att-class is properly added/removed on widget root el (v3) 2`] = `
exports[`style and class handling t-att-class is properly added/removed on widget root el (v3) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -482,3 +468,17 @@ exports[`style and class handling t-att-class is properly added/removed on widge
}
}"
`;
exports[`style and class handling t-att-class is properly added/removed on widget root el (v3) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span class=\\"c\\" block-attribute-0=\\"class\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = {d:ctx['state'].d,...ctx['props'].class};
return block1([d1]);
}
}"
`;
tests/components/__snapshots__/t_call.test.ts.snap
+75 -75
View File
@@ -43,6 +43,23 @@ exports[`t-call dynamic t-call 3`] = `
exports[`t-call handlers are properly bound through a dynamic t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { call } = helpers;
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
const template2 = ('__template__8');
let b2 = call(this, template2, ctx, node, key + \`__1\`);
let d1 = ctx['counter'];
return block1([d1], [b2]);
}
}"
`;
exports[`t-call handlers are properly bound through a dynamic t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -55,24 +72,24 @@ exports[`t-call handlers are properly bound through a dynamic t-call 1`] = `
}"
`;
exports[`t-call handlers are properly bound through a dynamic t-call 2`] = `
exports[`t-call handlers are properly bound through a t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { call } = helpers;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__6\`);
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
const template2 = ('__template__9');
let b2 = call(this, template2, ctx, node, key + \`__1\`);
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
let d1 = ctx['counter'];
return block1([d1], [b2]);
}
}"
`;
exports[`t-call handlers are properly bound through a t-call 1`] = `
exports[`t-call handlers are properly bound through a t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -86,24 +103,23 @@ exports[`t-call handlers are properly bound through a t-call 1`] = `
}"
`;
exports[`t-call handlers are properly bound through a t-call 2`] = `
exports[`t-call handlers with arguments are properly bound through a t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
const callTemplate_2 = getTemplate(\`__template__19\`);
let block1 = createBlock(\`<div><block-child-0/><block-text-0/></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
let d1 = ctx['counter'];
return block1([d1], [b2]);
return block1([], [b2]);
}
}"
`;
exports[`t-call handlers with arguments are properly bound through a t-call 1`] = `
exports[`t-call handlers with arguments are properly bound through a t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -118,12 +134,12 @@ exports[`t-call handlers with arguments are properly bound through a t-call 1`]
}"
`;
exports[`t-call handlers with arguments are properly bound through a t-call 2`] = `
exports[`t-call parent is set within t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
const callTemplate_2 = getTemplate(\`__template__10\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
@@ -134,26 +150,13 @@ exports[`t-call handlers with arguments are properly bound through a t-call 2`]
}"
`;
exports[`t-call parent is set within t-call 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`t-call parent is set within t-call 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>lucas</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
return component(\`Child\`, {}, key + \`__1\`, node, ctx);
}
}"
`;
@@ -162,20 +165,30 @@ exports[`t-call parent is set within t-call 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
let block1 = createBlock(\`<span>lucas</span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
return block1();
}
}"
`;
exports[`t-call parent is set within t-call with no parentNode 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__16\`);
return function template(ctx, node, key = \\"\\") {
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`t-call parent is set within t-call with no parentNode 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -185,7 +198,7 @@ exports[`t-call parent is set within t-call with no parentNode 1`] = `
}"
`;
exports[`t-call parent is set within t-call with no parentNode 2`] = `
exports[`t-call parent is set within t-call with no parentNode 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -198,35 +211,8 @@ exports[`t-call parent is set within t-call with no parentNode 2`] = `
}"
`;
exports[`t-call parent is set within t-call with no parentNode 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
return function template(ctx, node, key = \\"\\") {
return callTemplate_2.call(this, ctx, node, key + \`__1\`);
}
}"
`;
exports[`t-call sub components in two t-calls 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`t-call sub components in two t-calls 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
@@ -248,7 +234,7 @@ exports[`t-call sub components in two t-calls 2`] = `
}"
`;
exports[`t-call sub components in two t-calls 3`] = `
exports[`t-call sub components in two t-calls 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -259,18 +245,7 @@ exports[`t-call sub components in two t-calls 3`] = `
}"
`;
exports[`t-call t-call in t-foreach and children component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {val: ctx['val']}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`t-call t-call in t-foreach and children component 2`] = `
exports[`t-call sub components in two t-calls 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -284,12 +259,12 @@ exports[`t-call t-call in t-foreach and children component 2`] = `
}"
`;
exports[`t-call t-call in t-foreach and children component 3`] = `
exports[`t-call t-call in t-foreach and children component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, getTemplate, withKey } = helpers;
const callTemplate_2 = getTemplate(\`__template__9\`);
const callTemplate_2 = getTemplate(\`__template__13\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
@@ -310,3 +285,28 @@ exports[`t-call t-call in t-foreach and children component 3`] = `
}
}"
`;
exports[`t-call t-call in t-foreach and children component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return component(\`Child\`, {val: ctx['val']}, key + \`__1\`, node, ctx);
}
}"
`;
exports[`t-call t-call in t-foreach and children component 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
tests/components/__snapshots__/t_component.test.ts.snap
+90 -103
View File
@@ -5,32 +5,6 @@ exports[`t-component can switch between dynamic components without the need for
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child a</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can switch between dynamic components without the need for a t-key 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child b</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can switch between dynamic components without the need for a t-key 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -41,7 +15,7 @@ exports[`t-component can switch between dynamic components without the need for
}"
`;
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 1`] = `
exports[`t-component can switch between dynamic components without the need for a t-key 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -54,46 +28,7 @@ exports[`t-component can use dynamic components (the class) if given (with diffe
}"
`;
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>child b</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['state'].child;
let Comp3 = ctx['myComponent'];
return toggler(tKey_1, toggler(Comp3, component(Comp3, {}, tKey_1 + key + \`__2\`, node, ctx)));
}
}"
`;
exports[`t-component can use dynamic components (the class) if given 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child a</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can use dynamic components (the class) if given 2`] = `
exports[`t-component can switch between dynamic components without the need for a t-key 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -106,7 +41,7 @@ exports[`t-component can use dynamic components (the class) if given 2`] = `
}"
`;
exports[`t-component can use dynamic components (the class) if given 3`] = `
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -119,11 +54,91 @@ exports[`t-component can use dynamic components (the class) if given 3`] = `
}"
`;
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child a</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can use dynamic components (the class) if given (with different root tagname) 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div>child b</div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can use dynamic components (the class) if given 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['state'].child;
let Comp3 = ctx['myComponent'];
return toggler(tKey_1, toggler(Comp3, component(Comp3, {}, tKey_1 + key + \`__2\`, node, ctx)));
}
}"
`;
exports[`t-component can use dynamic components (the class) if given 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child a</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component can use dynamic components (the class) if given 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>child b</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component modifying a sub widget 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let Comp2 = ctx['Counter'];
let b2 = toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
return block1([], [b2]);
}
}"
`;
exports[`t-component modifying a sub widget 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/><button block-handler-1=\\"click\\">Inc</button></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -135,22 +150,19 @@ exports[`t-component modifying a sub widget 1`] = `
}"
`;
exports[`t-component modifying a sub widget 2`] = `
exports[`t-component switching dynamic component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let Comp2 = ctx['Counter'];
let b2 = toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
return block1([], [b2]);
let Comp2 = ctx['Child'];
return toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
}
}"
`;
exports[`t-component switching dynamic component 1`] = `
exports[`t-component switching dynamic component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -163,7 +175,7 @@ exports[`t-component switching dynamic component 1`] = `
}"
`;
exports[`t-component switching dynamic component 2`] = `
exports[`t-component switching dynamic component 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -174,7 +186,7 @@ exports[`t-component switching dynamic component 2`] = `
}"
`;
exports[`t-component switching dynamic component 3`] = `
exports[`t-component t-component works in simple case 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -186,20 +198,7 @@ exports[`t-component switching dynamic component 3`] = `
}"
`;
exports[`t-component t-component not on a <t> node 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>1</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`t-component t-component works in simple case 1`] = `
exports[`t-component t-component works in simple case 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -211,15 +210,3 @@ exports[`t-component t-component works in simple case 1`] = `
}
}"
`;
exports[`t-component t-component works in simple case 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
let Comp2 = ctx['Child'];
return toggler(Comp2, component(Comp2, {}, key + \`__1\`, node, ctx));
}
}"
`;
tests/components/__snapshots__/t_foreach.test.ts.snap
+56 -75
View File
@@ -2,20 +2,6 @@
exports[`list of components components in a node in a t-foreach 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].item;
return block1([d1]);
}
}"
`;
exports[`list of components components in a node in a t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
@@ -38,6 +24,20 @@ exports[`list of components components in a node in a t-foreach 2`] = `
}"
`;
exports[`list of components components in a node in a t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].item;
return block1([d1]);
}
}"
`;
exports[`list of components crash on duplicate key in dev mode 1`] = `
"function anonymous(bdom, helpers
) {
@@ -73,40 +73,8 @@ exports[`list of components crash on duplicate key in dev mode 2`] = `
}"
`;
exports[`list of components crash on duplicate key in dev mode 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
const [k_block1, v_block1, l_block1, c_block1] = prepareList([1,2]);
for (let i1 = 0; i1 < l_block1; i1++) {
ctx[\`item\`] = v_block1[i1];
let key1 = 'child';
c_block1[i1] = withKey(component(\`Child\`, {}, key + \`__1__\${key1}\`, node, ctx), key1);
}
return list(c_block1);
}
}"
`;
exports[`list of components list of sub components inside other nodes 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span>asdf</span>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`list of components list of sub components inside other nodes 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
@@ -129,21 +97,20 @@ exports[`list of components list of sub components inside other nodes 2`] = `
}"
`;
exports[`list of components reconciliation alg works for t-foreach in t-foreach 1`] = `
exports[`list of components list of sub components inside other nodes 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<span>asdf</span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].blip;
return block1([d1]);
return block1();
}
}"
`;
exports[`list of components reconciliation alg works for t-foreach in t-foreach 2`] = `
exports[`list of components reconciliation alg works for t-foreach in t-foreach 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -175,7 +142,7 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach
}"
`;
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 1`] = `
exports[`list of components reconciliation alg works for t-foreach in t-foreach 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -183,13 +150,13 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach,
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].row+'_'+ctx['props'].col;
let d1 = ctx['props'].blip;
return block1([d1]);
}
}"
`;
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 2`] = `
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -223,21 +190,21 @@ exports[`list of components reconciliation alg works for t-foreach in t-foreach,
}"
`;
exports[`list of components simple list 1`] = `
exports[`list of components reconciliation alg works for t-foreach in t-foreach, 2 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].value;
let d1 = ctx['props'].row+'_'+ctx['props'].col;
return block1([d1]);
}
}"
`;
exports[`list of components simple list 2`] = `
exports[`list of components simple list 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -256,21 +223,21 @@ exports[`list of components simple list 2`] = `
}"
`;
exports[`list of components sub components rendered in a loop 1`] = `
exports[`list of components simple list 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<p><block-text-0/></p>\`);
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].n;
let d1 = ctx['props'].value;
return block1([d1]);
}
}"
`;
exports[`list of components sub components rendered in a loop 2`] = `
exports[`list of components sub components rendered in a loop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -292,7 +259,7 @@ exports[`list of components sub components rendered in a loop 2`] = `
}"
`;
exports[`list of components sub components with some state rendered in a loop 1`] = `
exports[`list of components sub components rendered in a loop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -300,13 +267,13 @@ exports[`list of components sub components with some state rendered in a loop 1`
let block1 = createBlock(\`<p><block-text-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].n;
let d1 = ctx['props'].n;
return block1([d1]);
}
}"
`;
exports[`list of components sub components with some state rendered in a loop 2`] = `
exports[`list of components sub components with some state rendered in a loop 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -328,21 +295,21 @@ exports[`list of components sub components with some state rendered in a loop 2`
}"
`;
exports[`list of components switch component position 1`] = `
exports[`list of components sub components with some state rendered in a loop 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
let block1 = createBlock(\`<p><block-text-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].key;
let d1 = ctx['state'].n;
return block1([d1]);
}
}"
`;
exports[`list of components switch component position 2`] = `
exports[`list of components switch component position 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -364,22 +331,21 @@ exports[`list of components switch component position 2`] = `
}"
`;
exports[`list of components t-foreach with t-component, and update 1`] = `
exports[`list of components switch component position 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].val;
let d2 = ctx['props'].val;
return block1([d1, d2]);
let d1 = ctx['props'].key;
return block1([d1]);
}
}"
`;
exports[`list of components t-foreach with t-component, and update 2`] = `
exports[`list of components t-foreach with t-component, and update 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -401,3 +367,18 @@ exports[`list of components t-foreach with t-component, and update 2`] = `
}
}"
`;
exports[`list of components t-foreach with t-component, and update 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/><block-text-1/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['state'].val;
let d2 = ctx['props'].val;
return block1([d1, d2]);
}
}"
`;
tests/components/__snapshots__/t_key.test.ts.snap
+55 -55
View File
@@ -2,20 +2,6 @@
exports[`t-key t-foreach with t-key switch component position 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].key;
return block1([d1]);
}
}"
`;
exports[`t-key t-foreach with t-key switch component position 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { prepareList, withKey } = helpers;
@@ -37,7 +23,7 @@ exports[`t-key t-foreach with t-key switch component position 2`] = `
}"
`;
exports[`t-key t-key on Component 1`] = `
exports[`t-key t-foreach with t-key switch component position 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -51,17 +37,31 @@ exports[`t-key t-key on Component 1`] = `
}"
`;
exports[`t-key t-key on Component 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['key'];
let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
return block1([], [b2]);
}
}"
`;
exports[`t-key t-key on Component 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['key'];
let b2 = toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
return block1([], [b2]);
let d1 = ctx['props'].key;
return block1([d1]);
}
}"
`;
@@ -71,20 +71,6 @@ exports[`t-key t-key on Component as a function 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].key;
return block1([d1]);
}
}"
`;
exports[`t-key t-key on Component as a function 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
@@ -95,7 +81,7 @@ exports[`t-key t-key on Component as a function 2`] = `
}"
`;
exports[`t-key t-key on multiple Components 1`] = `
exports[`t-key t-key on Component as a function 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -109,7 +95,7 @@ exports[`t-key t-key on multiple Components 1`] = `
}"
`;
exports[`t-key t-key on multiple Components 2`] = `
exports[`t-key t-key on multiple Components 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -126,7 +112,7 @@ exports[`t-key t-key on multiple Components 2`] = `
}"
`;
exports[`t-key t-key on multiple Components with t-call 1 1`] = `
exports[`t-key t-key on multiple Components 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -140,19 +126,7 @@ exports[`t-key t-key on multiple Components with t-call 1 1`] = `
}"
`;
exports[`t-key t-key on multiple Components with t-call 1 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['key'];
return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
}
}"
`;
exports[`t-key t-key on multiple Components with t-call 1 3`] = `
exports[`t-key t-key on multiple Components with t-call 1 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -179,7 +153,19 @@ exports[`t-key t-key on multiple Components with t-call 1 3`] = `
}"
`;
exports[`t-key t-key on multiple Components with t-call 2 1`] = `
exports[`t-key t-key on multiple Components with t-call 1 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
const tKey_1 = ctx['key'];
return toggler(tKey_1, component(\`Child\`, {key: ctx['key']}, tKey_1 + key + \`__2\`, node, ctx));
}
}"
`;
exports[`t-key t-key on multiple Components with t-call 1 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -193,6 +179,22 @@ exports[`t-key t-key on multiple Components with t-call 2 1`] = `
}"
`;
exports[`t-key t-key on multiple Components with t-call 2 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`calledTemplate\`);
let block1 = createBlock(\`<span><block-child-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
}
}"
`;
exports[`t-key t-key on multiple Components with t-call 2 2`] = `
"function anonymous(bdom, helpers
) {
@@ -212,14 +214,12 @@ exports[`t-key t-key on multiple Components with t-call 2 3`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { getTemplate } = helpers;
const callTemplate_2 = getTemplate(\`calledTemplate\`);
let block1 = createBlock(\`<span><block-child-0/></span>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = callTemplate_2.call(this, ctx, node, key + \`__1\`);
return block1([], [b2]);
let d1 = ctx['props'].key;
return block1([d1]);
}
}"
`;
tests/components/__snapshots__/t_on.test.ts.snap
+14 -14
View File
@@ -126,20 +126,6 @@ exports[`t-on t-on on destroyed components 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-handler-0=\\"click\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['onClick'], ctx];
return block1([d1]);
}
}"
`;
exports[`t-on t-on on destroyed components 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -151,3 +137,17 @@ exports[`t-on t-on on destroyed components 2`] = `
}
}"
`;
exports[`t-on t-on on destroyed components 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-handler-0=\\"click\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['onClick'], ctx];
return block1([d1]);
}
}"
`;
tests/components/__snapshots__/t_props.test.ts.snap
+46 -46
View File
@@ -5,20 +5,6 @@ exports[`t-props basic use 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].a+ctx['props'].b;
return block1([d1]);
}
}"
`;
exports[`t-props basic use 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -28,11 +14,39 @@ exports[`t-props basic use 2`] = `
}"
`;
exports[`t-props basic use 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].a+ctx['props'].b;
return block1([d1]);
}
}"
`;
exports[`t-props t-props and other props 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Comp\`, Object.assign({}, ctx['state1'], {a: ctx['a']}), key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`t-props t-props and other props 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -43,39 +57,11 @@ exports[`t-props t-props and other props 1`] = `
}"
`;
exports[`t-props t-props and other props 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Comp\`, Object.assign({}, ctx['state1'], {a: ctx['a']}), key + \`__1\`, node, ctx);
return block1([], [b2]);
}
}"
`;
exports[`t-props t-props only 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].a;
return block1([d1]);
}
}"
`;
exports[`t-props t-props only 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -85,20 +71,21 @@ exports[`t-props t-props only 2`] = `
}"
`;
exports[`t-props t-props with props 1`] = `
exports[`t-props t-props only 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div/>\`);
let block1 = createBlock(\`<div><block-text-0/></div>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
let d1 = ctx['props'].a;
return block1([d1]);
}
}"
`;
exports[`t-props t-props with props 2`] = `
exports[`t-props t-props with props 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -111,3 +98,16 @@ exports[`t-props t-props with props 2`] = `
}
}"
`;
exports[`t-props t-props with props 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();
}
}"
`;
tests/components/__snapshots__/t_set.test.ts.snap
+38 -38
View File
@@ -2,25 +2,6 @@
exports[`t-set slot setted value (with t-set) not accessible with t-esc 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set slot setted value (with t-set) not accessible with t-esc 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue, capture } = helpers;
@@ -47,6 +28,25 @@ exports[`t-set slot setted value (with t-set) not accessible with t-esc 2`] = `
}"
`;
exports[`t-set slot setted value (with t-set) not accessible with t-esc 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set t-set can't alter component even if key in component 1`] = `
"function anonymous(bdom, helpers
) {
@@ -116,25 +116,6 @@ exports[`t-set t-set not altered by child comp 1`] = `
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set t-set not altered by child comp 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><p><block-text-0/></p><block-child-0/><p><block-text-1/></p></div>\`);
return function template(ctx, node, key = \\"\\") {
@@ -149,6 +130,25 @@ exports[`t-set t-set not altered by child comp 2`] = `
}"
`;
exports[`t-set t-set not altered by child comp 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let { isBoundary, withDefault, setContextValue } = helpers;
let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
return function template(ctx, node, key = \\"\\") {
ctx = Object.create(ctx);
ctx[isBoundary] = 1
let d1 = ctx['iter'];
setContextValue(ctx, \\"iter\\", 'called');
let d2 = ctx['iter'];
return block1([d1, d2]);
}
}"
`;
exports[`t-set t-set outside modified in t-if 1`] = `
"function anonymous(bdom, helpers
) {
tests/components/error_handling.test.ts
-1
View File
@@ -37,7 +37,6 @@ beforeEach(() => {
afterEach(() => {
console.error = originalconsoleError;
console.warn = originalconsoleWarn;
fixture = makeTestFixture();
});
describe("basics", () => {
tests/components/props_validation.test.ts
+55 -54
View File
@@ -1,11 +1,14 @@
import { makeTestFixture, nextTick, snapshotApp } from "../helpers";
import { Component, onError, xml } from "../../src";
import { App, DEV_MSG } from "../../src/app/app";
import { makeTestFixture, nextTick, snapshotEverything } from "../helpers";
import { Component, onError, xml, mount } from "../../src";
import { DEV_MSG } from "../../src/app/app";
import { validateProps } from "../../src/component/props_validation";
let fixture: HTMLElement;
snapshotEverything();
const info = console.info;
let originalconsoleWarn = console.warn;
let mockConsoleWarn: any;
beforeAll(() => {
console.info = (message: any) => {
@@ -22,15 +25,13 @@ afterAll(() => {
beforeEach(() => {
fixture = makeTestFixture();
mockConsoleWarn = jest.fn(() => {});
console.warn = mockConsoleWarn;
});
async function mountApp(Root: any, dev: boolean = true) {
const app = new App(Root);
app.configure({ dev });
await app.mount(fixture);
snapshotApp(app);
return app;
}
afterEach(() => {
console.warn = originalconsoleWarn;
});
//------------------------------------------------------------------------------
// Props validation
@@ -49,7 +50,7 @@ describe("props validation", () => {
let error: Error | undefined;
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -58,7 +59,7 @@ describe("props validation", () => {
error = undefined;
try {
await mountApp(Parent, false);
await mount(Parent, fixture, { dev: false });
} catch (e) {
error = e as Error;
}
@@ -77,7 +78,7 @@ describe("props validation", () => {
let error: Error;
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -112,7 +113,7 @@ describe("props validation", () => {
props = {};
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -121,14 +122,14 @@ describe("props validation", () => {
error = undefined;
props = { p: test.ok };
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
props = { p: test.ko };
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -162,7 +163,7 @@ describe("props validation", () => {
let error: Error | undefined;
props = {};
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -171,14 +172,14 @@ describe("props validation", () => {
error = undefined;
props = { p: test.ok };
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
props = { p: test.ko };
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -203,21 +204,21 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: "string" };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: true };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: 1 };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -241,21 +242,21 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: "key" };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = {};
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: 1 };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -279,21 +280,21 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: [] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: ["string"] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: [1] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -301,7 +302,7 @@ describe("props validation", () => {
error = undefined;
try {
props = { p: ["string", 1] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -323,28 +324,28 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: [] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: ["string"] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: [false, true, "string"] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: [true, 1] };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -370,14 +371,14 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: { id: 1, url: "url" } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: { id: 1, url: "url", extra: true } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -385,7 +386,7 @@ describe("props validation", () => {
expect(error!.message).toBe("Invalid prop 'p' in component SubComp (unknown prop 'extra')");
try {
props = { p: { id: "1", url: "url" } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -394,7 +395,7 @@ describe("props validation", () => {
error = undefined;
try {
props = { p: { id: 1 } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -426,21 +427,21 @@ describe("props validation", () => {
let props: { p?: any };
try {
props = { p: { id: 1, url: true } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: { id: 1, url: [12] } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
expect(error!).toBeUndefined();
try {
props = { p: { id: 1, url: [12, true] } };
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -550,7 +551,7 @@ describe("props validation", () => {
static components = { Child };
static template = xml`<div><Child message="1"/></div>`;
}
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><div>1</div></div>");
});
@@ -649,7 +650,7 @@ describe("props validation", () => {
}
let error: Error;
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -671,10 +672,10 @@ describe("props validation", () => {
onError((e) => (error = e));
}
}
const app = await mountApp(Parent);
const parent = await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><div>1</div></div>");
(app as any).root.component.state.p = undefined;
(app as any).root.component.render();
parent.state.p = undefined;
parent.render();
await nextTick();
expect(error!).toBeDefined();
expect(error!.message).toBe("Missing props 'p' (component 'SubComp')");
@@ -693,10 +694,10 @@ describe("props validation", () => {
state: any = { p: 1 };
}
const app = await mountApp(Parent);
const parent = await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><div>1</div></div>");
(app as any).root.component.state.p = undefined;
(app as any).root.component.render();
parent.state.p = undefined;
parent.render();
await nextTick();
expect(fixture.innerHTML).toBe("<div><div>4</div></div>");
});
@@ -715,7 +716,7 @@ describe("props validation", () => {
}
let error: Error;
try {
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
} catch (e) {
error = e as Error;
}
@@ -738,7 +739,7 @@ describe("default props", () => {
static template = xml`<div><SubComp /></div>`;
static components = { SubComp };
}
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><div>4</div></div>");
});
@@ -752,10 +753,10 @@ describe("default props", () => {
static components = { SubComp };
state: any = { p: 1 };
}
const app = await mountApp(Parent);
const parent = await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><div>1</div></div>");
(app as any).root.component.state.p = undefined;
(app as any).root.component.render();
parent.state.p = undefined;
parent.render();
await nextTick();
expect(fixture.innerHTML).toBe("<div><div>4</div></div>");
});
@@ -770,7 +771,7 @@ describe("default props", () => {
static template = xml`<div><SubComp/></div>`;
static components = { SubComp };
}
await mountApp(Parent);
await mount(Parent, fixture, { dev: true });
expect(fixture.innerHTML).toBe("<div><span>heyhey</span></div>");
});
});
tests/components/slots.test.ts
+24 -6
View File
@@ -1,11 +1,19 @@
import { App, Component, mount, onMounted, useState, xml } from "../../src/index";
import { addTemplate, children, makeTestFixture, nextTick, snapshotEverything } from "../helpers";
import { children, makeTestFixture, nextTick, snapshotEverything } from "../helpers";
snapshotEverything();
let originalconsoleWarn = console.warn;
let mockConsoleWarn: any;
let fixture: HTMLElement;
beforeEach(() => {
fixture = makeTestFixture();
mockConsoleWarn = jest.fn(() => {});
console.warn = mockConsoleWarn;
});
afterEach(() => {
console.warn = originalconsoleWarn;
});
describe("slots", () => {
@@ -88,6 +96,7 @@ describe("slots", () => {
error = e;
}
expect(error).not.toBeNull();
expect(mockConsoleWarn).toBeCalledTimes(1);
});
test("fun: two calls to the same slot", async () => {
@@ -642,8 +651,6 @@ describe("slots", () => {
static template = xml`Grand Child`;
}
addTemplate("sub", `<GrandChild/>`);
class Parent extends Component {
static template = xml`
<div>
@@ -655,7 +662,12 @@ describe("slots", () => {
}
// throw new Error("boom")
const parent = await mount(Parent, fixture);
const parent = await mount(Parent, fixture, {
templates: `
<templates>
<t t-name="sub"><GrandChild/></t>
</templates>`,
});
expect(fixture.innerHTML).toBe("<div>Grand Child</div>");
@@ -786,7 +798,6 @@ describe("slots", () => {
static template = xml`<div class="slotted"><t t-slot="default" /></div>`;
}
addTemplate("sometemplate", `<div class="slot"><Child/></div>`);
class UsingTcallInSlotted extends Component {
tcallTemplate = "sometemplate";
static template = xml`
@@ -798,7 +809,14 @@ describe("slots", () => {
static components = { Slotted, Child };
}
const parent = await mount(UsingTcallInSlotted, fixture);
const parent = await mount(UsingTcallInSlotted, fixture, {
templates: `
<templates>
<t t-name="sometemplate">
<div class="slot"><Child/></div>
</t>
</templates>`,
});
expect(parent).toBeInstanceOf(UsingTcallInSlotted);
expect(children(parent).length).toBe(1);
tests/components/style_class.test.ts
+9
View File
@@ -3,9 +3,17 @@ import { makeTestFixture, nextTick, snapshotEverything } from "../helpers";
snapshotEverything();
let fixture: HTMLElement;
let originalconsoleWarn = console.warn;
let mockConsoleWarn: any;
beforeEach(() => {
fixture = makeTestFixture();
mockConsoleWarn = jest.fn(() => {});
console.warn = mockConsoleWarn;
});
afterEach(() => {
console.warn = originalconsoleWarn;
});
describe("style and class handling", () => {
@@ -349,5 +357,6 @@ describe("style and class handling", () => {
/Cannot read properties of undefined \(reading 'crash'\)|Cannot read property 'crash' of undefined/g;
expect(error!.message).toMatch(regexp);
expect(fixture.innerHTML).toBe("");
expect(mockConsoleWarn).toBeCalledTimes(1);
});
});
tests/components/t_call.test.ts
+10 -12
View File
@@ -1,11 +1,5 @@
import { App, Component, mount, useState, xml } from "../../src/index";
import {
addTemplate,
isDirectChildOf,
makeTestFixture,
nextTick,
snapshotEverything,
} from "../helpers";
import { isDirectChildOf, makeTestFixture, nextTick, snapshotEverything } from "../helpers";
snapshotEverything();
@@ -17,20 +11,24 @@ beforeEach(() => {
describe("t-call", () => {
test("dynamic t-call", async () => {
class App extends Component {
class Root extends Component {
static template = xml`
<t t-call="{{current.template}}">
owl
</t>`;
current = useState({ template: "foo" });
}
addTemplate("foo", "<div>foo</div>");
addTemplate("bar", "bar");
const app = await mount(App, fixture);
const root = await mount(Root, fixture, {
templates: `
<templates>
<t t-name="foo"><div>foo</div></t>
<t t-name="bar">bar</t>
</templates>`,
});
expect(fixture.innerHTML).toBe("<div>foo</div>");
app.current.template = "bar";
root.current.template = "bar";
await nextTick();
expect(fixture.innerHTML).toBe("bar");
});
tests/components/t_foreach.test.ts
+13 -12
View File
@@ -1,18 +1,21 @@
import { App, Component, mount, onMounted, useState, xml } from "../../src/index";
import {
makeTestFixture,
nextTick,
snapshotApp,
snapshotEverything,
useLogLifecycle,
} from "../helpers";
import { Component, mount, onMounted, useState, xml } from "../../src/index";
import { makeTestFixture, nextTick, snapshotEverything, useLogLifecycle } from "../helpers";
snapshotEverything();
let originalconsoleWarn = console.warn;
let mockConsoleWarn: any;
let fixture: HTMLElement;
beforeEach(() => {
fixture = makeTestFixture();
mockConsoleWarn = jest.fn(() => {});
console.warn = mockConsoleWarn;
});
afterEach(() => {
console.warn = originalconsoleWarn;
});
describe("list of components", () => {
@@ -312,12 +315,10 @@ describe("list of components", () => {
`;
static components = { Child };
}
const app = new App(Parent);
app.configure({ dev: true });
await expect(async () => {
await app.mount(fixture);
await mount(Parent, fixture, { dev: true });
}).rejects.toThrowError("Got duplicate key in t-foreach: child");
snapshotApp(app);
console.info = consoleInfo;
expect(mockConsoleWarn).toBeCalledTimes(1);
});
});
tests/components/t_key.test.ts
+17 -10
View File
@@ -1,4 +1,4 @@
import { snapshotEverything, makeTestFixture, addTemplate, nextTick } from "../helpers";
import { snapshotEverything, makeTestFixture, nextTick } from "../helpers";
import { Component, mount, xml } from "../../src/index";
snapshotEverything();
@@ -115,8 +115,6 @@ describe("t-key", () => {
}
}
addTemplate("calledTemplate", `<Child t-key="key" key="key" />`);
class Parent extends Component {
static components = { Child };
static template = xml`<span>
@@ -128,7 +126,14 @@ describe("t-key", () => {
key2 = 2;
}
const parent = await mount(Parent, fixture);
const parent = await mount(Parent, fixture, {
templates: `
<templates>
<t t-name="calledTemplate">
<Child t-key="key" key="key" />
</t>
</templates>`,
});
expect((parent.el as HTMLElement).innerHTML).toBe("<div>1</div><div>2</div>");
parent.key1 = 2;
@@ -149,11 +154,6 @@ describe("t-key", () => {
}
}
addTemplate(
"calledTemplate",
`<Child t-key="key1" key="key1" /><Child t-key="key2" key="key2" />`
);
class Parent extends Component {
static components = { Child };
static template = xml`<span>
@@ -164,7 +164,14 @@ describe("t-key", () => {
key2 = 2;
}
const parent = await mount(Parent, fixture);
const parent = await mount(Parent, fixture, {
templates: `
<templates>
<t t-name="calledTemplate">
<Child t-key="key1" key="key1" /><Child t-key="key2" key="key2" />
</t>
</templates>`,
});
expect((parent.el as HTMLElement).innerHTML).toBe("<div>1</div><div>2</div>");
parent.key1 = 2;
tests/helpers.ts
+33 -75
View File
@@ -1,25 +1,23 @@
import { diff } from "jest-diff";
import {
App,
blockDom,
Component,
onWillDestroy,
onMounted,
onPatched,
onWillRender,
onRendered,
onWillDestroy,
onWillPatch,
onWillRender,
onWillStart,
onWillUnmount,
onWillUpdateProps,
status,
useComponent,
onRendered,
} from "../src";
import { BDom } from "../src/blockdom";
import { blockDom } from "../src";
import { compile as compileTemplate, Template } from "../src/compiler";
import { CodeGenOptions } from "../src/compiler/code_generator";
import { UTILS } from "../src/app/template_helpers";
import { globalTemplates, TemplateSet } from "../src/app/template_set";
import { xml } from "../src/tags";
import { BDom } from "../src/blockdom";
import { compile } from "../src/compiler";
const mount = blockDom.mount;
@@ -39,20 +37,6 @@ export function makeTestFixture() {
return fixture;
}
export function snapshotTemplateCode(template: string | Node, options?: CodeGenOptions) {
expect(compileTemplate(template, options).toString()).toMatchSnapshot();
}
export function snapshotApp(app: App) {
const Root = app.Root;
const template = app.rawTemplates[Root.template];
snapshotTemplateCode(template, {
translateFn: app.translateFn,
translatableAttributes: app.translatableAttributes,
dev: app.dev,
});
}
export async function nextTick(): Promise<void> {
await new Promise((resolve) => setTimeout(resolve));
await new Promise((resolve) => requestAnimationFrame(resolve));
@@ -74,36 +58,29 @@ export function makeDeferred(): Deferred {
return <Deferred>def;
}
/**
* Return the global template xml string corresponding to the given name
*/
// export function fromName(name: string): string {
// return globalTemplates[name];
// }
export function trim(str: string): string {
return str.replace(/\s/g, "");
}
export function addTemplate(name: string, template: string): string {
globalTemplates[name] = template;
return name;
}
// -----------------------------------------------------------------------------
// Helpers
// -----------------------------------------------------------------------------
export function compile(template: string): Template {
// register here the template globally so snapshotEverything
// can get it
globalTemplates[template] = template;
const templateFunction = compileTemplate(template);
return templateFunction(blockDom, UTILS);
let shouldSnapshot = false;
let snapshottedTemplates: Set<string> = new Set();
export function snapshotTemplate(template: string) {
const fn = compile(template);
expect(fn.toString()).toMatchSnapshot();
}
export function renderToBdom(template: string, context: any = {}, node: any = {}): BDom {
return compile(template)(context, node);
const fn = compile(template);
if (shouldSnapshot && !snapshottedTemplates.has(template)) {
snapshottedTemplates.add(template);
expect(fn.toString()).toMatchSnapshot();
}
return fn(blockDom, UTILS)(context, node);
}
export function renderToString(template: string, context: any = {}): string {
@@ -124,41 +101,24 @@ export class TestContext extends TemplateSet {
}
export function snapshotEverything() {
const consolewarn = console.warn;
const originalAddTemplate = TemplateSet.prototype.addTemplate;
TemplateSet.prototype.addTemplate = function (name: string, template: string, options) {
originalAddTemplate.call(this, name, template, options);
// register it so snapshotEverything can get it
globalTemplates[name] = template;
};
let globalSet: any;
beforeAll(() => {
globalSet = new Set(Object.keys(globalTemplates));
});
if (shouldSnapshot) {
// this function has already been called
return;
}
const globalTemplateNames = new Set(Object.keys(globalTemplates));
shouldSnapshot = true;
beforeEach(() => {
xml.nextId = 9;
snapshottedTemplates.clear();
});
afterEach(() => {
console.warn = () => {};
for (let k in globalTemplates) {
if (globalSet.has(k)) {
// ignore generic templates
continue;
}
try {
snapshotTemplateCode(globalTemplates[k]);
} catch (e) {
// ignore error
}
delete globalTemplates[k];
const originalCompileTemplate = TemplateSet.prototype._compileTemplate;
TemplateSet.prototype._compileTemplate = function (name: string, template: string | Node) {
const fn = originalCompileTemplate.call(this, "", template);
if (!globalTemplateNames.has(name)) {
expect(fn.toString()).toMatchSnapshot();
}
console.warn = consolewarn;
});
return fn;
};
}
const steps: string[] = [];
@@ -232,8 +192,6 @@ export async function editInput(input: HTMLInputElement | HTMLTextAreaElement, v
return nextTick();
}
import { diff } from "jest-diff";
afterEach(() => {
if (steps.length) {
steps.splice(0);
tests/misc/__snapshots__/memo.test.ts.snap
+8 -19
View File
@@ -5,17 +5,6 @@ exports[`Memo if no prop change, prevent renderings from above 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
return function template(ctx, node, key = \\"\\") {
return text(ctx['props'].value);
}
}"
`;
exports[`Memo if no prop change, prevent renderings from above 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
function slot1(ctx, node, key = \\"\\") {
let b6 = text(ctx['state'].a);
let b7 = text(ctx['state'].b);
@@ -38,8 +27,14 @@ exports[`Memo if no props, prevent renderings from above 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
function slot2(ctx, node, key = \\"\\") {
return component(\`Child\`, {value: ctx['state'].value}, key + \`__3\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
return text(ctx['props'].value);
let b2 = component(\`Child\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
let b4 = component(\`Memo\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return multi([b2, b4]);
}
}"
`;
@@ -49,14 +44,8 @@ exports[`Memo if no props, prevent renderings from above 2`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
function slot2(ctx, node, key = \\"\\") {
return component(\`Child\`, {value: ctx['state'].value}, key + \`__3\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let b2 = component(\`Child\`, {value: ctx['state'].value}, key + \`__1\`, node, ctx);
let b4 = component(\`Memo\`, {slots: {'default': {__render: slot2, __ctx: ctx}}}, key + \`__4\`, node, ctx);
return multi([b2, b4]);
return text(ctx['props'].value);
}
}"
`;
tests/misc/__snapshots__/portal.test.ts.snap
+88 -84
View File
@@ -5,11 +5,15 @@ exports[`Portal Portal composed with t-slot 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div block-handler-0=\\"custom\\"><span id=\\"childSpan\\">child2</span></div>\`);
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`Child2\`, {customHandler: ctx['_handled']}, key + \`__2\`, node, ctx);
}
return function template(ctx, node, key = \\"\\") {
let d1 = [ctx['onCustom'], ctx];
return block1([d1]);
let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
`;
@@ -35,15 +39,11 @@ exports[`Portal Portal composed with t-slot 3`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
return component(\`Child2\`, {customHandler: ctx['_handled']}, key + \`__2\`, node, ctx);
}
let block1 = createBlock(\`<div block-handler-0=\\"custom\\"><span id=\\"childSpan\\">child2</span></div>\`);
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`Child\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__3\`, node, ctx);
return block1([], [b3]);
let d1 = [ctx['onCustom'], ctx];
return block1([d1]);
}
}"
`;
@@ -72,20 +72,6 @@ exports[`Portal conditional use of Portal (with sub Component) 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<p><block-text-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal conditional use of Portal (with sub Component) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block2 = createBlock(\`<span>1</span>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -103,6 +89,20 @@ exports[`Portal conditional use of Portal (with sub Component) 2`] = `
}"
`;
exports[`Portal conditional use of Portal (with sub Component) 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<p><block-text-0/></p>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal conditional use of Portal 1`] = `
"function anonymous(bdom, helpers
) {
@@ -131,20 +131,6 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 1`]
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal lifecycle hooks of portal sub component are properly called 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -161,6 +147,20 @@ exports[`Portal lifecycle hooks of portal sub component are properly called 2`]
}"
`;
exports[`Portal lifecycle hooks of portal sub component are properly called 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal portal could have dynamically no content 1`] = `
"function anonymous(bdom, helpers
) {
@@ -190,20 +190,6 @@ exports[`Portal portal destroys on crash 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].error&&this.will.crash;
return block1([d1]);
}
}"
`;
exports[`Portal portal destroys on crash 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -217,7 +203,7 @@ exports[`Portal portal destroys on crash 2`] = `
}"
`;
exports[`Portal portal with child and props 1`] = `
exports[`Portal portal destroys on crash 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -225,13 +211,13 @@ exports[`Portal portal with child and props 1`] = `
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
let d1 = ctx['props'].error&&this.will.crash;
return block1([d1]);
}
}"
`;
exports[`Portal portal with child and props 2`] = `
exports[`Portal portal with child and props 1`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
@@ -249,6 +235,20 @@ exports[`Portal portal with child and props 2`] = `
}"
`;
exports[`Portal portal with child and props 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<span><block-text-0/></span>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal portal with dynamic body 1`] = `
"function anonymous(bdom, helpers
) {
@@ -362,19 +362,6 @@ exports[`Portal portal's parent's env is not polluted 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button>child</button>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`Portal portal's parent's env is not polluted 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -388,6 +375,19 @@ exports[`Portal portal's parent's env is not polluted 2`] = `
}"
`;
exports[`Portal portal's parent's env is not polluted 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<button>child</button>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`Portal with target in template (after portal) 1`] = `
"function anonymous(bdom, helpers
) {
@@ -439,7 +439,9 @@ exports[`Portal: Props validation target is mandatory 1`] = `
}
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`Portal\`, {slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
const props2 = {slots: {'default': {__render: slot1, __ctx: ctx}}}
helpers.validateProps(\`Portal\`, props2, ctx)
let b3 = component(\`Portal\`, props2, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
@@ -458,7 +460,9 @@ exports[`Portal: Props validation target is not list 1`] = `
}
return function template(ctx, node, key = \\"\\") {
let b3 = component(\`Portal\`, {target: ['body'],slots: {'default': {__render: slot1, __ctx: ctx}}}, key + \`__2\`, node, ctx);
const props2 = {target: ['body'],slots: {'default': {__render: slot1, __ctx: ctx}}}
helpers.validateProps(\`Portal\`, props2, ctx)
let b3 = component(\`Portal\`, props2, key + \`__3\`, node, ctx);
return block1([], [b3]);
}
}"
@@ -469,20 +473,6 @@ exports[`Portal: UI/UX focus is kept across re-renders 1`] = `
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<input id=\\"target-me\\" block-attribute-0=\\"placeholder\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
exports[`Portal: UI/UX focus is kept across re-renders 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<div><block-child-0/></div>\`);
function slot1(ctx, node, key = \\"\\") {
@@ -495,3 +485,17 @@ exports[`Portal: UI/UX focus is kept across re-renders 2`] = `
}
}"
`;
exports[`Portal: UI/UX focus is kept across re-renders 2`] = `
"function anonymous(bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
let block1 = createBlock(\`<input id=\\"target-me\\" block-attribute-0=\\"placeholder\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let d1 = ctx['props'].val;
return block1([d1]);
}
}"
`;
tests/misc/portal.test.ts
+11
View File
@@ -14,6 +14,8 @@ import { xml } from "../../src/tags";
import { makeTestFixture, nextTick, snapshotEverything } from "../helpers";
let fixture: HTMLElement;
let originalconsoleWarn = console.warn;
let mockConsoleWarn: any;
function addOutsideDiv(fixture: HTMLElement): HTMLElement {
let outside = document.createElement("div");
@@ -26,6 +28,12 @@ snapshotEverything();
beforeEach(() => {
fixture = makeTestFixture();
mockConsoleWarn = jest.fn(() => {});
console.warn = mockConsoleWarn;
});
afterEach(() => {
console.warn = originalconsoleWarn;
});
describe("Portal", () => {
@@ -171,6 +179,7 @@ describe("Portal", () => {
expect(error!).toBeDefined();
expect(error!.message).toBe("invalid portal target");
expect(fixture.innerHTML).toBe(`<div></div>`);
expect(mockConsoleWarn).toBeCalledTimes(1);
});
test("portal with child and props", async () => {
@@ -531,6 +540,7 @@ describe("Portal: Props validation", () => {
expect(error!).toBeDefined();
expect(error!.message).toBe(`Missing props 'target' (component 'Portal')`);
console.info = consoleInfo;
expect(mockConsoleWarn).toBeCalledTimes(1);
});
test("target is not list", async () => {
@@ -556,5 +566,6 @@ describe("Portal: Props validation", () => {
expect(error!).toBeDefined();
expect(error!.message).toBe(`Invalid Prop 'target' in component 'Portal'`);
console.info = consoleInfo;
expect(mockConsoleWarn).toBeCalledTimes(1);
});
});