fix issue with actioncontainer, add tests

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

@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`can be rendered with a non empty stack 1`] = `"<div class=\\"o_content\\"><div>some client action</div></div>"`;
+
+exports[`can be rendered with an empty stack 1`] = `"<div class=\\"o_content\\"></div>"`;
+
+exports[`content is updated properly when new props are given 1`] = `"<div class=\\"o_content\\"><div>some client action</div></div>"`;

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

@@ -108,3 +108,69 @@ exports[`if url has action_id, will render action and navigate to proper menu_id
     </div>
   </div>"
 `;
+
+exports[`start with no action => clicks on client action => discuss is rendered 1`] = `
+"<div class=\\"o_web_client\\">
+    <div class=\\"o_navbar\\">
+    <a aria-label=\\"Applications\\" class=\\"o_title fa fa-th\\" href=\\"#\\" title=\\"Applications\\" accesskey=\\"h\\"></a>
+    
+      <a class=\\"o_menu_brand\\" href=\\"\\" role=\\"button\\">
+        Discuss
+      </a>
+      <ul class=\\"o_menu_sections\\">
+        <li>
+          
+            <a href=\\"#\\" role=\\"button\\" class=\\"dropdown-toggle o-no-caret\\" data-toggle=\\"dropdown\\">
+              <span>
+                Integrations
+              </span>
+            </a>
+            <div class=\\"dropdown-menu\\" role=\\"menu\\">
+              
+                <a href=\\"\\" data-toggle=\\"collapse\\" data-target=\\"#someid\\" role=\\"menuitem\\" class=\\"dropdown-item\\">
+                  <span>
+                    Github Repositories
+                  </span>
+                </a>
+              
+            </div>
+          
+        </li>
+        
+      </ul>
+    
+  </div>
+    
+      <div class=\\"o_content\\"><div class=\\"o_discuss\\">
+    <span>DISCUSS!!</span>
+    <button>Reset first counter</button>
+    <button>Reset counter 2 in 3s</button>
+    <button>Toggle  Clock/counters</button>
+    <button>Toggle Color</button>
+    <button>Rerender this widget</button>
+    <input>
+    
+      <div>
+      <button>-</button>
+      <span style=\\"font-weight:bold\\">Value: 4</span>
+      <button>+</button>
+    </div>
+      <div>
+      <button>-</button>
+      <span style=\\"font-weight:bold\\">Value: 400</span>
+      <button>+</button>
+    </div>
+    
+    <div>
+      <span>Current Color: </span>
+      red
+    </div>
+    <button>Add notif</button>
+    <button>Add sticky notif</button>
+  </div></div>
+    
+    <div class=\\"o_notification_container\\">
+      
+    </div>
+  </div>"
+`;

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

@@ -0,0 +1,69 @@
+import { ActionStack } from "../../src/ts/services/action_manager";
+import { ActionContainer, Props } from "../../src/ts/widgets/action_container";
+import { Widget } from "../../src/ts/widgets/widget";
+import * as helpers from "../helpers";
+
+//------------------------------------------------------------------------------
+// Setup and helpers
+//------------------------------------------------------------------------------
+
+let fixture: HTMLElement;
+let env: ReturnType<typeof helpers.makeTestEnv>;
+let props: Props;
+let templates: string;
+
+beforeAll(async () => {
+  templates = await helpers.loadTemplates();
+});
+
+beforeEach(() => {
+  fixture = helpers.makeTestFixture();
+  env = helpers.makeTestEnv();
+  env.qweb.loadTemplates(templates);
+  props = { stack: [] };
+});
+
+afterEach(() => {
+  fixture.remove();
+});
+
+class ClientAction extends Widget<{}, {}> {
+  inlineTemplate = "<div>some client action</div>";
+}
+
+const demoStack: ActionStack = [
+  {
+    id: 33,
+    context: {},
+    title: "some title",
+    target: "new",
+    type: "client",
+    name: "hey",
+    Widget: ClientAction
+  }
+];
+
+//------------------------------------------------------------------------------
+// Tests
+//------------------------------------------------------------------------------
+
+test("can be rendered with an empty stack", async () => {
+  const container = new ActionContainer(env, props);
+  await container.mount(fixture);
+  expect(fixture.innerHTML).toMatchSnapshot();
+});
+
+test("can be rendered with a non empty stack", async () => {
+  props.stack = demoStack;
+  const container = new ActionContainer(env, props);
+  await container.mount(fixture);
+  expect(fixture.innerHTML).toMatchSnapshot();
+});
+
+test("content is updated properly when new props are given", async () => {
+  const container = new ActionContainer(env, props);
+  await container.mount(fixture);
+  await container.updateProps({ stack: demoStack });
+  await helpers.nextTick();
+  expect(fixture.innerHTML).toMatchSnapshot();
+});

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

@@ -30,16 +30,29 @@ afterEach(() => {
 //------------------------------------------------------------------------------
 
 test("can be rendered (in home menu)", async () => {
-  const navbar = new Root(env, props);
-  await navbar.mount(fixture);
+  const root = new Root(env, props);
+  await root.mount(fixture);
   expect(fixture.innerHTML).toMatchSnapshot();
 });
 
 test("if url has action_id, will render action and navigate to proper menu_id", async () => {
   env.router.setQuery({ action_id: "595" });
-  const navbar = new Root(env, props);
-  await navbar.mount(fixture);
+  const root = new Root(env, props);
+  await root.mount(fixture);
   expect(fixture.innerHTML).toMatchSnapshot();
   // we check here that the url was changed to set app id as menu_id
   expect(env.router.currentQuery).toEqual({ action_id: "595", menu_id: "409" });
 });
+
+test("start with no action => clicks on client action => discuss is rendered", async () => {
+  const root = new Root(env, props);
+  await root.mount(fixture);
+
+  expect(env.router.currentQuery).toEqual({});
+
+  // discuss menu item
+  await (<any>document.querySelector('[data-menu="96"]')).click();
+  await helpers.nextTick();
+  expect(fixture.innerHTML).toMatchSnapshot();
+  expect(env.router.currentQuery).toEqual({ action_id: "131", menu_id: "96" });
+});