diff --git a/tests/components/__snapshots__/t_foreach.test.ts.snap b/tests/components/__snapshots__/t_foreach.test.ts.snap index edff6eba..53856f75 100644 --- a/tests/components/__snapshots__/t_foreach.test.ts.snap +++ b/tests/components/__snapshots__/t_foreach.test.ts.snap @@ -280,3 +280,42 @@ exports[`list of components sub components with some state rendered in a loop 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 } = bdom; + let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, shallowEqual } = helpers; + + let block1 = createBlock(\`\`); + + return function template(ctx, node, key = \\"\\") { + let d1 = ctx['state'].val; + let d2 = ctx['props'].val; + return block1([d1, d2]); + } +}" +`; + +exports[`list of components t-foreach with t-component, and update 2`] = ` +"function anonymous(bdom, helpers +) { + let { text, createBlock, list, multi, html, toggler, component } = bdom; + let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, shallowEqual } = helpers; + + let block1 = createBlock(\`
\`); + + return function template(ctx, node, key = \\"\\") { + ctx = Object.create(ctx); + const [k2, v2, l2, c2] = prepareList(Array(2)); + for (let i1 = 0; i1 < l2; i1++) { + ctx[\`n\`] = v2[i1]; + ctx[\`n_index\`] = i1; + let key1 = ctx['n_index']; + c2[i1] = withKey(component(\`Child\`, {val: ctx['n_index']}, key + \`__1__\${key1}\`, node, ctx), key1); + } + let b2 = list(c2); + return block1([], [b2]); + } +}" +`; diff --git a/tests/components/t_foreach.test.ts b/tests/components/t_foreach.test.ts index 44166c5a..aa722108 100644 --- a/tests/components/t_foreach.test.ts +++ b/tests/components/t_foreach.test.ts @@ -1,4 +1,4 @@ -import { Component, mount, useState, xml } from "../../src/index"; +import { Component, mount, onMounted, useState, xml } from "../../src/index"; import { makeTestFixture, nextTick, snapshotEverything, useLogLifecycle } from "../helpers"; snapshotEverything(); @@ -229,4 +229,35 @@ describe("list of components", () => { "
asdf
asdf
" ); }); + + test("t-foreach with t-component, and update", async () => { + class Child extends Component { + static template = xml` + + + + `; + state = useState({ val: "A" }); + setup() { + onMounted(() => { + this.state.val = "B"; + }); + } + } + class Parent extends Component { + static components = { Child }; + static template = xml` +
+ + + +
`; + } + + await mount(Parent, fixture); + expect(fixture.innerHTML).toBe("
A0A1
"); + + await nextTick(); // wait for changes triggered in mounted to be applied + expect(fixture.innerHTML).toBe("
B0B1
"); + }); });