[REF] *: update js test suite to use helpers

This rev. introduces robust helpers to use in the JS tests suite to
interact with DOM and components, and starts using them (almost)
everywhere.

All the helpers are exposed though testUtils.js.

There are 2 kinds of helpers:

1. Assertions
-------------
 * assert.containsNone, containsN, containsOnce check that the DOM
   (or a specific part of the DOM) contains a `selector`. It
   generates a correct error message automatically.
    ex: assert.strictEqual(form.$('.o_form_editable'), 1, "msg");
        -> assert.containsOnce(form, '.o_form_editable');
 * assert.isVisible, isNotVisible check that the DOM has an element
   visible or not. They also check that the element is actually in
   the DOM (before most tests didn't verify this).
 * assert.hasClass, doesNotHaveClass, hasAttrVAlue, check specific
   properties of a DOM element, and also validate that it is
   applied on a single existing DOM element (before most tests
   didn't verify this).
    ex: assert.notOk(form.$('button').hasClass('btn-primary'));
       -> assert.doesNotHaveClass(form.$('button'), 'btn-primary');

2. Utilities
------------
The goal of the utilities is to centralize the definition of many
standard components and interactions, ensuring that when we
refactor the JS framework, we do not need to change all the tests.

Existing mock utilities (addMockEnvironment, intercept, path,
patchDate, unpatch and fieldsViewGet) are moved to
'testUtils.mock.*'.
Existing DOM utilities are moved to 'testUtils.dom.*'.
New dom utilities are created for opendDatePicker, click,
clickFirst and clickLast. Helper `click` verifies that there is
exactly 1 element visible in the DOM you click on, `clickFirst`
and `clickLast` verify that there are more than one element on the
DOM.
 ex: form.$('button').click();
     -> testUtils.dom.click(form.$('button'));

New Form utilities: (testUtils.form.*)
 clickEdit, clickSave, clickCreate, clickDiscard, all clicks on
 the control panel buttons of the form.
 `reload` reloads the form data.

New modal, graph, kanban and pivot utils (testUtils.pivot.*,
testUtils.kanban.*, etc.).

New fields utils: (testUtils.fields.*)
 * editInput, editSelect: allow to change the value of a field,
   using a selector to identify it. They validate that the input
   exists and trigger the change event automatically.
 * editAndTrigger: allow to modify a field and trigger specific
   events after the value change
 * many2one (testUtils.fields.many2one.*)
   clickOpenDropdown, clickHighlightedItem, clickItem,
   searchAndClickItem: use a field name instead of a selector and
   do all the complex mechanism to open, filter and highlight
   many2one fields.

Joint work with aab, dam, ged, mge, svs and vsc.

1 files changed, 37 insertions, 33 deletions

diff --git a/addons/board/static/tests/dashboard_tests.js b/addons/board/static/tests/dashboard_tests.js
index 1e17ca71db1..1803875d33c 100644
--- a/addons/board/static/tests/dashboard_tests.js
+++ b/addons/board/static/tests/dashboard_tests.js
@@ -55,7 +55,7 @@ QUnit.test('dashboard basic rendering', function (assert) {
             '</form>',
     });
 
-    assert.notOk(form.renderer.$el.hasClass('o_dashboard'),
+    assert.doesNotHaveClass(form.renderer.$el, 'o_dashboard',
         "should not have the o_dashboard css class");
 
     form.destroy();
@@ -71,9 +71,9 @@ QUnit.test('dashboard basic rendering', function (assert) {
             '</form>',
     });
 
-    assert.ok(form.renderer.$el.hasClass('o_dashboard'),
+    assert.hasClass(form.renderer.$el,'o_dashboard',
         "with a dashboard, the renderer should have the proper css class");
-    assert.strictEqual(form.$('.o_dashboard .o_view_nocontent').length, 1,
+    assert.containsOnce(form, '.o_dashboard .o_view_nocontent',
         "should have a no content helper");
     assert.strictEqual(form.get('title'), "My Dashboard",
         "should have the correct title");
@@ -99,7 +99,7 @@ QUnit.test('display the no content helper', function (assert) {
         },
     });
 
-    assert.strictEqual(form.$('.o_dashboard .o_view_nocontent').length, 1,
+    assert.containsOnce(form, '.o_dashboard .o_view_nocontent',
         "should have a no content helper with action help");
     form.destroy();
 });
@@ -141,53 +141,53 @@ QUnit.test('basic functionality, with one sub action', function (assert) {
         },
     });
 
-    assert.strictEqual(form.$('.oe_dashboard_links').length, 1,
+    assert.containsOnce(form, '.oe_dashboard_links',
         "should have rendered a link div");
-    assert.strictEqual(form.$('table.oe_dashboard[data-layout="2-1"]').length, 1,
+    assert.containsOnce(form, 'table.oe_dashboard[data-layout="2-1"]',
         "should have rendered a table");
-    assert.strictEqual(form.$('td.o_list_record_selector').length, 0,
+    assert.containsNone(form, 'td.o_list_record_selector',
         "td should not have a list selector");
     assert.strictEqual(form.$('h2 span.oe_header_txt:contains(ABC)').length, 1,
         "should have rendered a header with action string");
-    assert.strictEqual(form.$('tr.o_data_row').length, 3,
+    assert.containsN(form, 'tr.o_data_row', 3,
         "should have rendered 3 data rows");
 
     assert.ok(form.$('.oe_content').is(':visible'), "content is visible");
 
-    form.$('.oe_fold').click();
+    testUtils.dom.click(form.$('.oe_fold'));
 
     assert.notOk(form.$('.oe_content').is(':visible'), "content is no longer visible");
 
-    form.$('.oe_fold').click();
+    testUtils.dom.click(form.$('.oe_fold'));
 
     assert.ok(form.$('.oe_content').is(':visible'), "content is visible again");
     assert.verifySteps(['load action', 'edit custom', 'edit custom']);
 
     assert.strictEqual($('.modal').length, 0, "should have no modal open");
 
-    form.$('button.oe_dashboard_link_change_layout').click();
+    testUtils.dom.click(form.$('button.oe_dashboard_link_change_layout'));
 
     assert.strictEqual($('.modal').length, 1, "should have opened a modal");
     assert.strictEqual($('.modal li[data-layout="2-1"] i.oe_dashboard_selected_layout').length, 1,
         "should mark currently selected layout");
 
-    $('.modal .oe_dashboard_layout_selector li[data-layout="1-1"]').click();
+    testUtils.dom.click($('.modal .oe_dashboard_layout_selector li[data-layout="1-1"]'));
 
     assert.strictEqual($('.modal').length, 0, "should have no modal open");
-    assert.strictEqual(form.$('table.oe_dashboard[data-layout="1-1"]').length, 1,
+    assert.containsOnce(form, 'table.oe_dashboard[data-layout="1-1"]',
         "should have rendered a table with correct layout");
 
 
-    assert.strictEqual(form.$('.oe_action').length, 1, "should have one displayed action");
-    form.$('span.oe_close').click();
+    assert.containsOnce(form, '.oe_action', "should have one displayed action");
+    testUtils.dom.click(form.$('span.oe_close'));
 
     assert.strictEqual($('.modal').length, 1, "should have opened a modal");
 
     // confirm the close operation
-    $('.modal button.btn-primary').click();
+    testUtils.dom.click($('.modal button.btn-primary'));
 
     assert.strictEqual($('.modal').length, 0, "should have no modal open");
-    assert.strictEqual(form.$('.oe_action').length, 0, "should have no displayed action");
+    assert.containsNone(form, '.oe_action', "should have no displayed action");
 
     assert.verifySteps(['load action', 'edit custom', 'edit custom', 'edit custom', 'edit custom']);
     form.destroy();
@@ -282,7 +282,7 @@ QUnit.test('can sort a sub list', function (assert) {
     assert.strictEqual($('tr.o_data_row').text(), 'yoplalalaabc',
         "should have correct initial data");
 
-    form.$('th.o_column_sortable:contains(Foo)').click();
+    testUtils.dom.click(form.$('th.o_column_sortable:contains(Foo)'));
 
     assert.strictEqual($('tr.o_data_row').text(), 'abclalalayop',
         "data should have been sorted");
@@ -328,7 +328,7 @@ QUnit.test('can open a record', function (assert) {
         },
     });
 
-    form.$('tr.o_data_row td:contains(yop)').click();
+    testUtils.dom.click(form.$('tr.o_data_row td:contains(yop)'));
     form.destroy();
 });
 
@@ -373,7 +373,7 @@ QUnit.test('can open record using action form view', function (assert) {
         },
     });
 
-    form.$('tr.o_data_row td:contains(yop)').click();
+    testUtils.dom.click(form.$('tr.o_data_row td:contains(yop)'));
     form.destroy();
 });
 
@@ -410,14 +410,14 @@ QUnit.test('can drag and drop a view', function (assert) {
         },
     });
 
-    assert.strictEqual(form.$('td.index_0 .oe_action').length, 1,
+    assert.containsOnce(form, 'td.index_0 .oe_action',
         "initial action is in column 0");
 
-    testUtils.dragAndDrop(form.$('.oe_dashboard_column.index_0 .oe_header'),
+    testUtils.dom.dragAndDrop(form.$('.oe_dashboard_column.index_0 .oe_header'),
         form.$('.oe_dashboard_column.index_1'));
-    assert.strictEqual(form.$('td.index_0 .oe_action').length, 0,
+    assert.containsNone(form, 'td.index_0 .oe_action',
         "initial action is not in column 0");
-    assert.strictEqual(form.$('td.index_1 .oe_action').length, 1,
+    assert.containsOnce(form, 'td.index_1 .oe_action',
         "initial action is in in column 1");
 
     form.destroy();
@@ -555,7 +555,7 @@ QUnit.test('clicking on a kanban\'s button should trigger the action', function
         }
     });
 
-    form.$('.o_kanban_test').find('button:first').click();
+    testUtils.dom.click(form.$('.o_kanban_test').find('button:first'));
 
     form.destroy();
 });
@@ -564,7 +564,7 @@ QUnit.test('subviews are aware of attach in or detach from the DOM', function (a
     assert.expect(2);
 
     // patch list renderer `on_attach_callback` for the test only
-    testUtils.patch(ListRenderer, {
+    testUtils.mock.patch(ListRenderer, {
         on_attach_callback: function () {
             assert.step('subview on_attach_callback');
         }
@@ -599,7 +599,7 @@ QUnit.test('subviews are aware of attach in or detach from the DOM', function (a
     assert.verifySteps(['subview on_attach_callback']);
 
     // restore on_attach_callback of ListRenderer
-    testUtils.unpatch(ListRenderer);
+    testUtils.mock.unpatch(ListRenderer);
 
     form.destroy();
 });
@@ -609,7 +609,7 @@ QUnit.test('dashboard intercepts custom events triggered by sub controllers', fu
 
     // we patch the ListController to force it to trigger the custom events that
     // we want the dashboard to intercept (to stop them or to tweak their data)
-    testUtils.patch(ListController, {
+    testUtils.mock.patch(ListController, {
         start: function () {
             this.trigger_up('update_filters');
             this.trigger_up('env_updated');
@@ -655,7 +655,7 @@ QUnit.test('dashboard intercepts custom events triggered by sub controllers', fu
         'env_updated', // triggered by the dashboard itself
     ]);
 
-    testUtils.unpatch(ListController);
+    testUtils.mock.unpatch(ListController);
     board.destroy();
 });
 
@@ -687,13 +687,15 @@ QUnit.test('save actions to dashboard', function (assert) {
         views: [[false, 'list']],
     });
 
-    assert.strictEqual(actionManager.$('.o_list_view').length, 1,
+    assert.containsOnce(actionManager, '.o_list_view',
         "should display the list view");
     assert.strictEqual($('.o_add_to_dashboard_link').length, 1,
         "should allow the 'Add to dashboard' feature");
 
     // add this action to dashboard
-    $('.o_add_to_dashboard_button').click();
+    testUtils.dom.click($('.o_search_options .o_dropdown button:contains(Favorites)'));
+    testUtils.dom.click($('.o_add_to_dashboard_link'));
+    testUtils.dom.click($('.o_add_to_dashboard_button'));
 
     actionManager.destroy();
 });
@@ -737,13 +739,15 @@ QUnit.test('save to dashboard actions with flag keepSearchView', function (asser
         views: [[false, 'graph']],
     }, options);
 
-    assert.strictEqual(actionManager.$('.o_graph').length, 1,
+    assert.containsOnce(actionManager, '.o_graph',
         "should display the graph view");
     assert.strictEqual($('.o_add_to_dashboard_link').length, 1,
         "should allow the 'Add to dashboard' feature (this is the same searchview)");
 
     // add this action to dashboard
-    $('.o_add_to_dashboard_button').click();
+    testUtils.dom.click($('.o_search_options .o_dropdown button:contains(Favorites)'));
+    testUtils.dom.click($('.o_add_to_dashboard_link'));
+    testUtils.dom.click($('.o_add_to_dashboard_button'));
 
     actionManager.destroy();
 });