[FIX] tests: mount owl App in test mode and mount components in helper

This commit is a backport of original merged in PR #2045, it was
introduced as it diminishes drastically the sources of errors when
mounting OWL components.

Change the parameters of the owl `App` in the test. The `App` will now
be mounted in test mode. The main purpose is to enable props validation,
which ensure that the test is close to the reality, and avoid tests
failing for unclear reasons because a props was missing (d466315).

The Owl test mode is equivalent to dev mode, but without warning that
the app is unsuited for production. Documentation here :
https://github.com/odoo/owl/blob/master/doc/reference/app.md#dev-mode

Also added an helper `mountComponent` and modified the existing helper
`mountSpreadsheet`. The helpers now create and return the fixture in which
the component is mounted. They also register cleanup functions to remove
the fixture and destroy the app, so we don't have to do it manually.

closes #2045

Signed-off-by: Pierre Rousseau (pro) <[email protected]>
Part-of: #2252

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

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Context Menu context menu simple rendering 1`] = `
+exports[`Context Menu integration tests context menu simple rendering 1`] = `
 <div
   class="o-menu"
 >

tests/components/autocomplete_dropdown.test.ts

@@ -1,13 +1,10 @@
-import { App } from "@odoo/owl";
-import { Spreadsheet } from "../../src";
 import { args, functionRegistry } from "../../src/functions/index";
 import { Model } from "../../src/model";
 import { selectCell } from "../test_helpers/commands_helpers";
 import { clickCell } from "../test_helpers/dom_helper";
 import { getCellText } from "../test_helpers/getters_helpers";
 import {
   clearFunctions,
-  makeTestFixture,
   mountSpreadsheet,
   nextTick,
   restoreDefaultFunctions,
@@ -21,8 +18,6 @@ jest.mock("../../src/components/composer/content_editable_helper", () =>
 let model: Model;
 let composerEl: Element;
 let fixture: HTMLElement;
-let parent: Spreadsheet;
-let app: App;
 let cehMock: ContentEditableHelper;
 
 async function typeInComposerGrid(text: string, fromScratch: boolean = true) {
@@ -34,21 +29,14 @@ async function typeInComposerGrid(text: string, fromScratch: boolean = true) {
 }
 
 beforeEach(async () => {
-  fixture = makeTestFixture();
-  ({ app, parent } = await mountSpreadsheet(fixture));
-  model = parent.model;
+  ({ model, fixture } = await mountSpreadsheet());
 
   // start composition
   fixture.querySelector(".o-grid")!.dispatchEvent(new KeyboardEvent("keydown", { key: "Enter" }));
   await nextTick();
   composerEl = fixture.querySelector(".o-grid div.o-composer")!;
 });
 
-afterEach(() => {
-  fixture.remove();
-  app.destroy();
-});
-
 describe("Functions autocomplete", () => {
   beforeEach(() => {
     clearFunctions();

tests/components/autofill.test.ts

@@ -1,4 +1,4 @@
-import { App, Component, xml } from "@odoo/owl";
+import { Component, xml } from "@odoo/owl";
 import { Spreadsheet } from "../../src";
 import {
   DEFAULT_CELL_HEIGHT,
@@ -9,22 +9,14 @@ import {
 import { Model } from "../../src/model";
 import { setCellContent, setSelection, setViewportOffset } from "../test_helpers/commands_helpers";
 import { clickCell, triggerMouseEvent } from "../test_helpers/dom_helper";
-import { makeTestFixture, mountSpreadsheet, nextTick, spyDispatch } from "../test_helpers/helpers";
+import { mountSpreadsheet, nextTick, spyDispatch } from "../test_helpers/helpers";
 
 let fixture: HTMLElement;
 let model: Model;
 let parent: Spreadsheet;
-let app: App;
 
 beforeEach(async () => {
-  fixture = makeTestFixture();
-  ({ app, parent } = await mountSpreadsheet(fixture));
-  model = parent.model;
-});
-
-afterEach(() => {
-  fixture.remove();
-  app.destroy();
+  ({ parent, model, fixture } = await mountSpreadsheet());
 });
 
 describe("Autofill component", () => {