[IMP] qweb: t-props directive

We reimplement the directive "t-props" and add some tests for it.

tests/components/__snapshots__/t_props.test.ts.snap

@@ -0,0 +1,62 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`t-props t-props and other props 1`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component } = bdom;
+  let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, isBoundary, shallowEqual, setContextValue } = helpers;
+  
+  let block1 = createBlock(\`<div><block-text-0/><block-text-1/></div>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    let d1 = ctx['props'].a;
+    let d2 = ctx['props'].b;
+    return block1([d1, d2]);
+  }
+}"
+`;
+
+exports[`t-props t-props and other props 2`] = `
+"function anonymous(bdom, helpers
+) {
+  let { text, createBlock, list, multi, html, toggler, component } = bdom;
+  let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, isBoundary, shallowEqual, setContextValue } = helpers;
+  
+  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 } = bdom;
+  let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, isBoundary, shallowEqual, setContextValue } = helpers;
+  
+  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 } = bdom;
+  let { withDefault, getTemplate, prepareList, withKey, zero, call, callSlot, capture, isBoundary, shallowEqual, setContextValue } = helpers;
+  
+  let block1 = createBlock(\`<div><div><block-child-0/></div></div>\`);
+  
+  return function template(ctx, node, key = \\"\\") {
+    let b2 = component(\`Comp\`, ctx['state'], key + \`__1\`, node, ctx);
+    return block1([], [b2]);
+  }
+}"
+`;

tests/components/basics.test.ts

@@ -914,8 +914,9 @@ describe.skip("mount special cases", () => {
     //   expect(scheduler.tasks.length).toBe(0);
     //   expect(error).toBeDefined();
     //   expect(error.message).toBe("Cannot mount a destroyed component");
-    // });
-    // test("destroying a sub-component cleans itself from parent's vnode", async () => {
+  });
+
+  test("destroying a sub-component cleans itself from parent's vnode", async () => {
     //   class C1 extends Component {
     //     static template = xml`<div><div><t t-esc="props.a"/></div></div>`;
     //   }

tests/components/concurrency.test.ts

@@ -1,6 +1,11 @@
 import { App, Component, mount, onWillStart, onWillUpdateProps, useState } from "../../src";
 import { Fiber } from "../../src/component/fibers";
-import { onMounted, onPatched, onWillPatch, onWillUnmount } from "../../src/component/lifecycle_hooks";
+import {
+  onMounted,
+  onPatched,
+  onWillPatch,
+  onWillUnmount,
+} from "../../src/component/lifecycle_hooks";
 import { Scheduler } from "../../src/component/scheduler";
 import { status } from "../../src/component/status";
 import { xml } from "../../src/tags";

tests/components/t_props.test.ts

@@ -0,0 +1,54 @@
+import { Component, mount, useState, xml } from "../../src";
+import { makeTestFixture, nextTick, snapshotEverything } from "../helpers";
+
+snapshotEverything();
+
+let fixture: HTMLElement;
+
+beforeEach(() => {
+  fixture = makeTestFixture();
+});
+
+describe("t-props", () => {
+  test("t-props only", async () => {
+    class Comp extends Component {
+      static template = xml`<div><t t-esc="props.a"/></div>`;
+    }
+    class Parent extends Component {
+      static components = { Comp };
+      static template = xml`<div><div><Comp t-props="state"/></div></div>`;
+      state = useState({
+        a: "first",
+      });
+    }
+    const parent = await mount(Parent, fixture);
+    expect(fixture.textContent).toBe("first");
+    parent.state.a = "";
+    await nextTick();
+    expect(fixture.textContent).toBe("");
+    parent.state.a = "fixed";
+    await nextTick();
+    expect(fixture.textContent).toBe("fixed");
+  });
+
+  test("t-props and other props", async () => {
+    class Comp extends Component {
+      static template = xml`<div><t t-esc="props.a"/><t t-esc="props.b"/></div>`;
+    }
+    class Parent extends Component {
+      static components = { Comp };
+      static template = xml`<div><div><Comp t-props="state1" a="a"/></div></div>`;
+      state1 = useState({
+        a: "first",
+        b: "second",
+      });
+      a = "third";
+    }
+    const parent = await mount(Parent, fixture);
+    expect(fixture.textContent).toBe("thirdsecond");
+    delete parent.a;
+    parent.render();
+    await nextTick();
+    expect(fixture.textContent).toBe("second");
+  });
+});