add t-ref directive

tests/qweb_vdom.test.ts

@@ -69,7 +69,7 @@ describe("error handling", () => {
 
   test("template with text node and tag", () => {
     const qweb = new QWeb();
-    qweb.addTemplate("test", `<t t-debug="1">text<span>other node</span></t>`);
+    qweb.addTemplate("test", `<t>text<span>other node</span></t>`);
 
     expect(() => renderToString(qweb, "test")).toThrow(
       "A template should not have more than one root node"
@@ -652,3 +652,14 @@ describe("t-on", () => {
     expect(a).toBe(6);
   });
 });
+
+
+describe("t-ref", () => {
+  test("can get a ref on a node", () => {
+    const qweb = new QWeb();
+    qweb.addTemplate("test", `<div><span t-ref="myspan"/></div>`);
+    let refs: any = {};
+    renderToDOM(qweb, "test", { refs});
+    expect(refs.myspan.tagName).toBe('SPAN');
+  });
+});

tests/widget.test.ts

@@ -120,21 +120,34 @@ describe("destroy method", () => {
 });
 
 describe("composition", () => {
+
+  class WidgetB extends Widget {
+    template= `<div>world</div>`;
+  }
+
+  class WidgetA extends Widget {
+    name="a";
+    template= `<div>Hello<t t-widget="b"/></div>`;
+    widgets = {b: WidgetB}
+  }
+
   test("a widget with a sub widget", async () => {
 
-    class WidgetB extends Widget {
-      template= `<div>world</div>`;
-    }
-
-    class WidgetA extends Widget {
-      name="a";
-      template= `<div>Hello<t t-widget="b"/></div>`;
-      widgets = {b: WidgetB}
-    }
-
     const widget = makeWidget(WidgetA);
     const target = document.createElement("div");
     await widget.mount(target);
     expect(target.innerHTML).toBe("<div>Hello<div>world</div></div>");
   });
+
+  test("t-refs on widget are widgets", async () => {
+  class WidgetC extends Widget {
+    name="a";
+    template= `<div t-debug="1">Hello<t t-ref="mywidgetb" t-widget="b"/></div>`;
+    widgets = {b: WidgetB}
+  }
+    const widget = makeWidget(WidgetC);
+    const target = document.createElement("div");
+    await widget.mount(target);
+    expect(widget.refs.mywidgetb instanceof WidgetB).toBe(true);
+  });
 });