[ADD] components: re-add a test for t-foreach directive

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(\`<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]);
+  }
+}"
+`;
+
+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(\`<div><block-child-0/></div>\`);
+  
+  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]);
+  }
+}"
+`;

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", () => {
       "<div><div><span>asdf</span></div><div><span>asdf</span></div></div>"
     );
   });
+
+  test("t-foreach with t-component, and update", async () => {
+    class Child extends Component {
+      static template = xml`
+          <span>
+            <t t-esc="state.val"/>
+            <t t-esc="props.val"/>
+          </span>`;
+      state = useState({ val: "A" });
+      setup() {
+        onMounted(() => {
+          this.state.val = "B";
+        });
+      }
+    }
+    class Parent extends Component {
+      static components = { Child };
+      static template = xml`
+          <div>
+            <t t-foreach="Array(2)" t-as="n" t-key="n_index">
+              <Child val="n_index"/>
+            </t>
+          </div>`;
+    }
+
+    await mount(Parent, fixture);
+    expect(fixture.innerHTML).toBe("<div><span>A0</span><span>A1</span></div>");
+
+    await nextTick(); // wait for changes triggered in mounted to be applied
+    expect(fixture.innerHTML).toBe("<div><span>B0</span><span>B1</span></div>");
+  });
 });