use snapshot testing

web/static/src/ts/core/qweb_vdom.ts

@@ -721,7 +721,7 @@ const widgetDirective: Directive = {
     ctx.addLine(`let _${dummyID}_index = c${ctx.parentNode}.length;`);
     ctx.addLine(`c${ctx.parentNode}.push(_${dummyID});`);
     ctx.addLine(`let def${defID};`);
-    let templateID = ctx.inLoop ? `(-${widgetID} - i)` : String(widgetID);
+    let templateID = ctx.inLoop ? `String(-${widgetID} - i)` : String(widgetID);
     ctx.addLine(
       `let w${widgetID} = ${templateID} in context.__widget__.cmap ? context.__widget__.children[context.__widget__.cmap[${templateID}]] : false;`
     );

web/static/tests/widgets/__snapshots__/navbar.test.ts.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`can be rendered 1`] = `
+"<div class=\\"o_navbar\\">
+        <span class=\\"title\\">Odoo</span>
+        <ul>
+            
+        </ul>
+    </div>"
+`;
+
+exports[`can render one menu item 1`] = `
+"<div class=\\"o_navbar\\">
+        <span class=\\"title\\">Odoo</span>
+        <ul>
+            <li>
+                <a href=\\"\\">
+                    menu
+                </a>
+            </li>
+        </ul>
+    </div>"
+`;

web/static/tests/widgets/__snapshots__/notification.test.ts.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`can be rendered 1`] = `
+"<div class=\\"o_notification\\">
+        
+        <div class=\\"o_notification_title\\">title</div>
+        <div class=\\"o_notification_content\\">message</div>
+
+    </div>"
+`;

web/static/tests/widgets/navbar.test.ts

@@ -1,6 +1,6 @@
 import { Env } from "../../src/ts/env";
-import { makeTestEnv, makeTestFixture, normalize } from "../helpers";
 import { Navbar } from "../../src/ts/widgets/navbar";
+import { makeTestEnv, makeTestFixture } from "../helpers";
 
 //------------------------------------------------------------------------------
 // Setup and helpers
@@ -25,26 +25,12 @@ afterEach(() => {
 test("can be rendered", async () => {
   const navbar = new Navbar(env);
   await navbar.mount(fixture);
-  expect(normalize(fixture.innerHTML)).toBe(
+  expect(fixture.innerHTML).toMatchSnapshot();
-    normalize(`
-    <div class=\"o_navbar\">
-        <span class=\"title\">Odoo</span>
-        <ul></ul>
-    </div>`)
-  );
 });
 
 test("can render one menu item", async () => {
   env.menus.push({ title: "menu", actionID: 4 });
   const navbar = new Navbar(env);
   await navbar.mount(fixture);
-  expect(normalize(fixture.innerHTML)).toBe(
+  expect(fixture.innerHTML).toMatchSnapshot();
-    normalize(`
-    <div class=\"o_navbar\">
-        <span class=\"title\">Odoo</span>
-        <ul>
-            <li><ahref=\"\">menu</a></li>
-        </ul>
-    </div>`)
-  );
 });

web/static/tests/widgets/notification.test.ts

@@ -1,7 +1,7 @@
 import { Env } from "../../src/ts/env";
-import { makeTestEnv, makeTestFixture, normalize } from "../helpers";
-import { Notification } from "../../src/ts/widgets/notification";
 import { INotification } from "../../src/ts/services/notifications";
+import { Notification } from "../../src/ts/widgets/notification";
+import { makeTestEnv, makeTestFixture } from "../helpers";
 
 //------------------------------------------------------------------------------
 // Setup and helpers
@@ -38,13 +38,7 @@ test("can be rendered", async () => {
   const notif = makeNotification({ title: "title", message: "message" });
   const navbar = new Notification(env, notif);
   await navbar.mount(fixture);
-  expect(normalize(fixture.innerHTML)).toBe(
+  expect(fixture.innerHTML).toMatchSnapshot();
-    normalize(`
-      <div class=\"o_notification\">
-        <div class=\"o_notification_title\">title</div>
-        <div class=\"o_notification_content\">message</div>
-      </div>`)
-  );
 });
 
 test("can be closed by clicking on it (if sticky)", async () => {