[REF] web: adapt code after jQuery update

Part of task 1896658

Co-authored-by: Aaron Bohy <aab@odoo.com>
Co-authored-by: Christophe Matthieu <chm@odoo.com>
Co-authored-by: Mathieu Duckerts-Antoine <dam@odoo.com>
Co-authored-by: David Monjoie <dmo@odoo.com>
Co-authored-by: Martin Geubelle <mge@odoo.com>
Co-authored-by: svs-odoo <svs@odoo.com>
Co-authored-by: Vincent Schippefilt <vsc@odoo.com>

4 files changed, 102 insertions, 91 deletions

diff --git a/addons/web/static/tests/widgets/data_export_tests.js b/addons/web/static/tests/widgets/data_export_tests.js
index 51c82ef1ded..d9453d70405 100644
--- a/addons/web/static/tests/widgets/data_export_tests.js
+++ b/addons/web/static/tests/widgets/data_export_tests.js
@@ -35,7 +35,7 @@ QUnit.module('widgets', {
     QUnit.module('Data Export');
 
 
-    QUnit.test('exporting all data in list view', function (assert) {
+    QUnit.test('exporting all data in list view', async function (assert) {
         assert.expect(6);
 
         var blockUI = framework.blockUI;
@@ -47,7 +47,7 @@ QUnit.module('widgets', {
             assert.step('unblock UI');
         };
 
-        var list = createView({
+        var list = await createView({
             View: ListView,
             model: 'partner',
             data: this.data,
@@ -57,13 +57,13 @@ QUnit.module('widgets', {
             },
             mockRPC: function (route) {
                 if (route === '/web/export/formats') {
-                    return $.when([
+                    return Promise.resolve([
                         {tag: 'csv', label: 'CSV'},
                         {tag: 'xls', label: 'Excel'},
                     ]);
                 }
                 if (route === '/web/export/get_fields') {
-                    return $.when([
+                    return Promise.resolve([
                         {
                             field_type: "one2many",
                             string: "Activities",
@@ -94,19 +94,19 @@ QUnit.module('widgets', {
             },
         });
 
-        testUtils.dom.click(list.$('thead th.o_list_record_selector input'));
-        testUtils.dom.click(list.sidebar.$('.o_dropdown_toggler_btn:contains(Action)'));
-        testUtils.dom.click(list.sidebar.$('a:contains(Export)'));
+        await testUtils.dom.click(list.$('thead th.o_list_record_selector input'));
+        await testUtils.dom.click(list.sidebar.$('.o_dropdown_toggler_btn:contains(Action)'));
+        await testUtils.dom.click(list.sidebar.$('a:contains(Export)'));
 
         assert.strictEqual($('.modal').length, 1, "a modal dialog should be open");
         assert.strictEqual($('span.o_tree_column:contains(Activities)').length, 1,
             "the Activities field should be in the list of exportable fields");
 
         // select the field Description, click on add, then export and close
-        testUtils.dom.click($('.modal span:contains(Description)'));
-        testUtils.dom.click($('.modal .o_add_field'));
-        testUtils.dom.click($('.modal span:contains(Export To File)'));
-        testUtils.dom.click($('.modal span:contains(Close)'));
+        await testUtils.dom.click($('.modal span:contains(Description)'));
+        await testUtils.dom.click($('.modal .o_add_field'));
+        await testUtils.dom.click($('.modal span:contains(Export To File)'));
+        await testUtils.dom.click($('.modal span:contains(Close)'));
 
         list.destroy();
         framework.blockUI = blockUI;
@@ -118,17 +118,17 @@ QUnit.module('widgets', {
         ]);
     });
 
-    QUnit.test('saving fields list when exporting data', function (assert) {
+    QUnit.test('saving fields list when exporting data', async function (assert) {
         assert.expect(5);
 
         var create = data.DataSet.prototype.create;
 
         data.DataSet.prototype.create = function (data, options) {
             assert.step('create');
-            return $.when([]);
+            return Promise.resolve([]);
         };
 
-        var list = createView({
+        var list = await createView({
             View: ListView,
             model: 'partner',
             data: this.data,
@@ -138,13 +138,13 @@ QUnit.module('widgets', {
             },
             mockRPC: function (route) {
                 if (route === '/web/export/formats') {
-                    return $.when([
+                    return Promise.resolve([
                         {tag: 'csv', label: 'CSV'},
                         {tag: 'xls', label: 'Excel'},
                     ]);
                 }
                 if (route === '/web/export/get_fields') {
-                    return $.when([
+                    return Promise.resolve([
                         {
                             field_type: "one2many",
                             string: "Activities",
@@ -162,29 +162,29 @@ QUnit.module('widgets', {
         });
 
         // Open the export modal
-        testUtils.dom.click(list.$('thead th.o_list_record_selector input'));
-        testUtils.dom.click(list.sidebar.$('.o_dropdown_toggler_btn:contains(Action)'));
-        testUtils.dom.click(list.sidebar.$('a:contains(Export)'));
+        await testUtils.dom.click(list.$('thead th.o_list_record_selector input'));
+        await testUtils.dom.click(list.sidebar.$('.o_dropdown_toggler_btn:contains(Action)'));
+        await testUtils.dom.click(list.sidebar.$('a:contains(Export)'));
         assert.strictEqual($('.modal').length, 1,
             "a modal dialog should be open");
 
         // Select 'Activities' in fields to export
         assert.strictEqual($('.modal select.o_fields_list option').length, 0,
             "the fields list should be empty");
-        testUtils.dom.click($('.modal .o_export_tree_item:contains(Activities)'));
-        testUtils.dom.click($('.modal button:contains(Add)'));
+        await testUtils.dom.click($('.modal .o_export_tree_item:contains(Activities)'));
+        await testUtils.dom.click($('.modal button:contains(Add)'));
         assert.strictEqual($('.modal select.o_fields_list option').length, 1,
             "there should be one item in the fields list");
 
         // Save fields list
-        testUtils.dom.click($('.modal a:contains(Save fields list)'));
-        testUtils.fields.editInput($('.modal .o_save_list > input'), 'fields list');
-        testUtils.dom.click($('.modal .o_save_list > button'));
+        await testUtils.dom.click($('.modal a:contains(Save fields list)'));
+        await testUtils.fields.editInput($('.modal .o_save_list > input'), 'fields list');
+        await testUtils.dom.click($('.modal .o_save_list > button'));
         assert.verifySteps(['create'],
             "create should have been called");
 
         // Close the modal and destroy list
-        testUtils.dom.click($('.modal button span:contains(Close)'));
+        await testUtils.dom.click($('.modal button span:contains(Close)'));
         list.destroy();
 
         // restore create function
diff --git a/addons/web/static/tests/widgets/domain_selector_tests.js b/addons/web/static/tests/widgets/domain_selector_tests.js
index 53f1d9cff26..305315b72c6 100644
--- a/addons/web/static/tests/widgets/domain_selector_tests.js
+++ b/addons/web/static/tests/widgets/domain_selector_tests.js
@@ -50,7 +50,7 @@ QUnit.module('DomainSelector', {
     },
 }, function () {
 
-    QUnit.test("creating a domain from scratch", function (assert) {
+    QUnit.test("creating a domain from scratch", async function (assert) {
         assert.expect(13);
 
         var $target = $("#qunit-fixture");
@@ -61,7 +61,7 @@ QUnit.module('DomainSelector', {
             debugMode: true,
         });
         testUtils.mock.addMockEnvironment(domainSelector, {data: this.data});
-        domainSelector.appendTo($target);
+        await domainSelector.appendTo($target);
 
         // As we gave an empty domain, there should be a visible button to add
         // the first domain part
@@ -71,13 +71,14 @@ QUnit.module('DomainSelector', {
 
         // Clicking on the button should add a visible field selector in the
         // widget so that the user can change the field chain
-        testUtils.dom.click($domainAddFirstNodeButton);
+        await testUtils.dom.click($domainAddFirstNodeButton);
         var $fieldSelector = domainSelector.$(".o_field_selector:visible");
         assert.strictEqual($fieldSelector.length, 1,
             "there should be a field selector");
 
         // Focusing the field selector input should open a field selector popover
         $fieldSelector.trigger('focusin');
+        await testUtils.nextTick();
         var $fieldSelectorPopover = $fieldSelector.find(".o_field_selector_popover:visible");
         assert.strictEqual($fieldSelectorPopover.length, 1,
             "field selector popover should be visible");
@@ -97,7 +98,7 @@ QUnit.module('DomainSelector', {
 
         // Clicking the "Bar" field should change the internal domain and this
         // should be displayed in the debug input
-        testUtils.dom.click($barLi);
+        await testUtils.dom.click($barLi);
         assert.strictEqual(
             domainSelector.$(".o_domain_debug_input").val(),
             '[["bar","=",True]]',
@@ -108,7 +109,7 @@ QUnit.module('DomainSelector', {
         // should add the default "['id', '=', 1]" domain
         var $plus = domainSelector.$(".fa-plus-circle");
         assert.strictEqual($plus.length, 1, "there should be a '+' button");
-        testUtils.dom.click($plus);
+        await testUtils.dom.click($plus);
         assert.strictEqual(
             domainSelector.$(".o_domain_debug_input").val(),
             '["&",["bar","=",True],["id","=",1]]',
@@ -119,7 +120,7 @@ QUnit.module('DomainSelector', {
         // domains and the "|" operator
         var $dots = domainSelector.$(".fa-ellipsis-h");
         assert.strictEqual($dots.length, 2, "there should be two '...' buttons");
-        testUtils.dom.click($dots.first());
+        await testUtils.dom.click($dots.first());
         assert.strictEqual(
             domainSelector.$(".o_domain_debug_input").val(),
             '["&","&",["bar","=",True],"|",["id","=",1],["id","=",1],["id","=",1]]',
@@ -130,6 +131,7 @@ QUnit.module('DomainSelector', {
         // field instead of "id" should rerender the widget and adapt the
         // widget suggestions
         domainSelector.$(".o_domain_debug_input").val('["&","&",["bar","=",True],"|",["foo","=","hello"],["id","=",1],["id","=",1]]').change();
+        await testUtils.nextTick();
         assert.strictEqual(domainSelector.$(".o_field_selector").eq(1).find("input.o_field_selector_debug").val(), "foo",
             "the second field selector should now contain the 'foo' value");
         assert.ok(domainSelector.$(".o_domain_leaf_operator_select").eq(1).html().indexOf("contains") >= 0,
@@ -140,8 +142,8 @@ QUnit.module('DomainSelector', {
         // "foo" fields, with the initial "&" operator
         var $minus = domainSelector.$(".o_domain_delete_node_button");
         assert.strictEqual($minus.length, 5, "there should be five 'x' buttons");
-        testUtils.dom.click($minus.last());
-        testUtils.dom.click(domainSelector.$(".o_domain_delete_node_button").last());
+        await testUtils.dom.click($minus.last());
+        await testUtils.dom.click(domainSelector.$(".o_domain_delete_node_button").last());
         assert.strictEqual(
             domainSelector.$(".o_domain_debug_input").val(),
             '["&",["bar","=",True],["foo","=","hello"]]',
@@ -150,7 +152,7 @@ QUnit.module('DomainSelector', {
         domainSelector.destroy();
     });
 
-    QUnit.test("building a domain with a datetime", function (assert) {
+    QUnit.test("building a domain with a datetime", async function (assert) {
         assert.expect(2);
 
         var $target = $("#qunit-fixture");
@@ -160,7 +162,7 @@ QUnit.module('DomainSelector', {
             readonly: false,
         });
         testUtils.mock.addMockEnvironment(domainSelector, {data: this.data});
-        domainSelector.appendTo($target);
+        await domainSelector.appendTo($target);
 
         // Check that there is a datepicker to choose the date
         var $datepicker = domainSelector.$(".o_datepicker:visible");
@@ -168,15 +170,15 @@ QUnit.module('DomainSelector', {
             "there should be a datepicker");
 
         var val = $datepicker.find('input').val();
-        testUtils.dom.openDatepicker($datepicker);
-        testUtils.dom.clickFirst($('.bootstrap-datetimepicker-widget :not(.today)[data-action="selectDay"]'));
+        await testUtils.dom.openDatepicker($datepicker);
+        await testUtils.dom.clickFirst($('.bootstrap-datetimepicker-widget :not(.today)[data-action="selectDay"]'));
         assert.notEqual(domainSelector.$(".o_datepicker:visible input").val(), val,
             "datepicker value should have changed");
 
         domainSelector.destroy();
     });
 
-    QUnit.test("building a domain with a m2o without following the relation", function (assert) {
+    QUnit.test("building a domain with a m2o without following the relation", async function (assert) {
         assert.expect(1);
 
         var $target = $("#qunit-fixture");
@@ -187,16 +189,17 @@ QUnit.module('DomainSelector', {
             readonly: false,
         });
         testUtils.mock.addMockEnvironment(domainSelector, {data: this.data});
-        domainSelector.appendTo($target);
+        await domainSelector.appendTo($target);
 
-        testUtils.fields.editAndTrigger(domainSelector.$('.o_domain_leaf_value_input'), 'pad', ['input', 'change']);
+        await testUtils.fields.editAndTrigger(domainSelector.$('.o_domain_leaf_value_input'),
+            'pad', ['input', 'change']);
         assert.strictEqual(domainSelector.$('.o_domain_debug_input').val(), '[["product_id","ilike","pad"]]',
             "string should have been allowed as m2o value");
 
         domainSelector.destroy();
     });
 
-    QUnit.test("editing a domain with `parent` key", function (assert) {
+    QUnit.test("editing a domain with `parent` key", async function (assert) {
         assert.expect(1);
 
         var $target = $("#qunit-fixture");
@@ -207,7 +210,7 @@ QUnit.module('DomainSelector', {
             readonly: false,
         });
         testUtils.mock.addMockEnvironment(domainSelector, {data: this.data});
-        domainSelector.appendTo($target);
+        await domainSelector.appendTo($target);
 
         assert.strictEqual(domainSelector.$el.text(), "This domain is not supported.",
             "an error message should be displayed because of the `parent` key");
@@ -215,7 +218,7 @@ QUnit.module('DomainSelector', {
         domainSelector.destroy();
     });
 
-    QUnit.test("creating a domain with a default option", function (assert) {
+    QUnit.test("creating a domain with a default option", async function (assert) {
         assert.expect(1);
 
         var $target = $("#qunit-fixture");
@@ -227,11 +230,11 @@ QUnit.module('DomainSelector', {
             default: [["foo","=","kikou"]],
         });
         testUtils.mock.addMockEnvironment(domainSelector, {data: this.data});
-        domainSelector.appendTo($target);
+        await domainSelector.appendTo($target);
 
         // Clicking on the button should add a visible field selector in the
         // widget so that the user can change the field chain
-        testUtils.dom.click(domainSelector.$(".o_domain_add_first_node_button:visible"));
+        await testUtils.dom.click(domainSelector.$(".o_domain_add_first_node_button:visible"));
 
         assert.strictEqual(
             domainSelector.$(".o_domain_debug_input").val(),
diff --git a/addons/web/static/tests/widgets/dropdown_menu_tests.js b/addons/web/static/tests/widgets/dropdown_menu_tests.js
index 709651c7cb1..c632d1b7307 100644
--- a/addons/web/static/tests/widgets/dropdown_menu_tests.js
+++ b/addons/web/static/tests/widgets/dropdown_menu_tests.js
@@ -9,8 +9,9 @@ function createDropdownMenu(items, params) {
     var target = params.debug ? document.body :  $('#qunit-fixture');
     var menu = new DropdownMenu(null, items);
     testUtils.mock.addMockEnvironment(menu, params);
-    menu.appendTo(target);
-    return menu;
+    return menu.appendTo(target).then(function() {
+        return menu;
+    });
 }
 
 QUnit.module('Web', {
@@ -35,10 +36,10 @@ QUnit.module('Web', {
 }, function () {
     QUnit.module('DropdownMenu');
 
-    QUnit.test('simple rendering', function (assert) {
+    QUnit.test('simple rendering', async function (assert) {
         assert.expect(4);
 
-        var dropdownMenu = createDropdownMenu(this.items);
+        var dropdownMenu = await createDropdownMenu(this.items);
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 4,
             'should have 4 elements counting the dividers');
         assert.strictEqual(dropdownMenu.$('.o_menu_item').first().text().trim(), 'Some Item',
@@ -51,11 +52,11 @@ QUnit.module('Web', {
         dropdownMenu.destroy();
     });
 
-    QUnit.test('click on an item without options should toggle it', function (assert) {
+    QUnit.test('click on an item without options should toggle it', async function (assert) {
         assert.expect(7);
 
         var self = this;
-        var dropdownMenu = createDropdownMenu(this.items, {
+        var dropdownMenu = await createDropdownMenu(this.items, {
             intercepts: {
                 menu_item_clicked: function (ev) {
                     assert.strictEqual(ev.data.id, 1);
@@ -64,34 +65,34 @@ QUnit.module('Web', {
                 },
             },
         });
-        testUtils.dom.click(dropdownMenu.$('button:first'));
+        await testUtils.dom.click(dropdownMenu.$('button:first'));
         assert.doesNotHaveClass(dropdownMenu.$('.o_menu_item:first > .dropdown-item').first(), 'selected');
-        testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
+        await testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
         assert.hasClass(dropdownMenu.$('.o_menu_item:first > .dropdown-item'), 'selected');
         assert.ok(dropdownMenu.$('.o_menu_item:first').is(':visible'),
             'item should still be visible');
-        testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
+        await testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
         assert.doesNotHaveClass(dropdownMenu.$('.o_menu_item:first > .dropdown-item').first(), 'selected');
         assert.ok(dropdownMenu.$('.o_menu_item:first').is(':visible'),
             'item should still be visible');
         dropdownMenu.destroy();
     });
 
-    QUnit.test('click on an item should not change url', function (assert) {
+    QUnit.test('click on an item should not change url', async function (assert) {
         assert.expect(0);
 
-        var dropdownMenu = createDropdownMenu(this.items);
-        testUtils.dom.click(dropdownMenu.$('.o_dropdown_toggler_btn'));
+        var dropdownMenu = await createDropdownMenu(this.items);
+        await testUtils.dom.click(dropdownMenu.$('.o_dropdown_toggler_btn'));
         dropdownMenu.$el.click(function () {
             // we do not want a click to get out and change the url, for example
             throw new Error('No click should get out of the dropdown menu');
         });
-        testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
+        await testUtils.dom.click(dropdownMenu.$('.o_menu_item a').first());
 
         dropdownMenu.destroy();
     });
 
-    QUnit.test('options rendering', function (assert) {
+    QUnit.test('options rendering', async function (assert) {
         assert.expect(3);
 
         this.items[0].hasOptions = true;
@@ -99,20 +100,20 @@ QUnit.module('Web', {
             {optionId: 1, description: "First Option", groupId: 1},
             {optionId: 2, description: "Second Option", groupId: 1}
         ];
-        var dropdownMenu = createDropdownMenu(this.items);
+        var dropdownMenu = await createDropdownMenu(this.items);
         testUtils.dom.click(dropdownMenu.$('button:first'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 4);
         // open options menu
-        testUtils.dom.click(dropdownMenu.$('span.fa-caret-right'));
+        await testUtils.dom.click(dropdownMenu.$('span.fa-caret-right'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 7);
         // close options menu
-        testUtils.dom.click(dropdownMenu.$('span.fa-caret-down'));
+        await testUtils.dom.click(dropdownMenu.$('span.fa-caret-down'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 4);
 
         dropdownMenu.destroy();
     });
 
-    QUnit.test('close menu closes also submenus', function (assert) {
+    QUnit.test('close menu closes also submenus', async function (assert) {
         assert.expect(2);
 
         this.items[0].hasOptions = true;
@@ -120,20 +121,20 @@ QUnit.module('Web', {
             {optionId: 1, description: "First Option"},
             {optionId: 2, description: "Second Option"}
         ];
-        var dropdownMenu = createDropdownMenu(this.items);
+        var dropdownMenu = await createDropdownMenu(this.items);
         // open dropdown menu
         testUtils.dom.click(dropdownMenu.$('button:first'));
         // open options menu
-        testUtils.dom.click(dropdownMenu.$('span.fa-caret-right'));
+        await testUtils.dom.click(dropdownMenu.$('span.fa-caret-right'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 7);
-        testUtils.dom.click(dropdownMenu.$('button:first'));
-        testUtils.dom.click(dropdownMenu.$('button:first'));
+        await testUtils.dom.click(dropdownMenu.$('button:first'));
+        await testUtils.dom.click(dropdownMenu.$('button:first'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .dropdown-item, .dropdown-item-text', 4);
 
         dropdownMenu.destroy();
     });
 
-    QUnit.test('click on an option should trigger the event "item_option_clicked" with appropriate data', function (assert) {
+    QUnit.test('click on an option should trigger the event "item_option_clicked" with appropriate data', async function (assert) {
         assert.expect(16);
 
         var self = this;
@@ -143,7 +144,7 @@ QUnit.module('Web', {
             {optionId: 1, description: "First Option"},
             {optionId: 2, description: "Second Option"}
         ];
-        var dropdownMenu = createDropdownMenu(this.items, {
+        var dropdownMenu = await createDropdownMenu(this.items, {
             intercepts: {
                 item_option_clicked: function (ev) {
                     eventNumber++;
@@ -166,22 +167,23 @@ QUnit.module('Web', {
                 },
             },
         });
+        await testUtils.nextTick();
         // open dropdown menu
-        testUtils.dom.click(dropdownMenu.$('button:first'));
+        await testUtils.dom.click(dropdownMenu.$('button:first'));
         assert.containsN(dropdownMenu, '.dropdown-divider, .o_menu_item', 4);
-        testUtils.dom.clickFirst(dropdownMenu.$('.o_menu_item'));
+        await testUtils.dom.clickFirst(dropdownMenu.$('.o_menu_item'));
         // click on first option
-        testUtils.dom.click(dropdownMenu.$('.o_item_option > .dropdown-item').eq(0));
+        await testUtils.dom.click(dropdownMenu.$('.o_item_option > .dropdown-item').eq(0));
         assert.hasClass(dropdownMenu.$('.o_menu_item > .dropdown-item').first(), 'selected');
         assert.hasClass(dropdownMenu.$('.o_item_option> .dropdown-item').eq(0),'selected');
         assert.doesNotHaveClass(dropdownMenu.$('.o_item_option > .dropdown-item').eq(1), 'selected');
         // click on second option
-        testUtils.dom.click($('.o_item_option > .dropdown-item').eq(1));
+        await testUtils.dom.click($('.o_item_option > .dropdown-item').eq(1));
         assert.hasClass(dropdownMenu.$('.o_menu_item > .dropdown-item').first(), 'selected');
         assert.doesNotHaveClass(dropdownMenu.$('.o_item_option > .dropdown-item').eq(0), 'selected');
         assert.hasClass(dropdownMenu.$('.o_item_option > .dropdown-item').eq(1), 'selected');
         // click again on second option
-        testUtils.dom.click($('.o_item_option > .dropdown-item').eq(1));
+        await testUtils.dom.click($('.o_item_option > .dropdown-item').eq(1));
         assert.doesNotHaveClass(dropdownMenu.$('.o_menu_item > .dropdown-item').first(), 'selected');
         assert.doesNotHaveClass(dropdownMenu.$('.o_item_option > .dropdown-item').eq(0), 'selected');
         assert.doesNotHaveClass(dropdownMenu.$('.o_item_option > .dropdown-item').eq(1), 'selected');
diff --git a/addons/web/static/tests/widgets/model_field_selector_tests.js b/addons/web/static/tests/widgets/model_field_selector_tests.js
index 2510912e678..76c18b91f5b 100644
--- a/addons/web/static/tests/widgets/model_field_selector_tests.js
+++ b/addons/web/static/tests/widgets/model_field_selector_tests.js
@@ -49,7 +49,7 @@ QUnit.module('ModelFieldSelector', {
     },
 }, function () {
 
-    QUnit.test("creating a field chain from scratch", function (assert) {
+    QUnit.test("creating a field chain from scratch", async function (assert) {
         assert.expect(14);
 
         var $target = $("#qunit-fixture");
@@ -60,7 +60,7 @@ QUnit.module('ModelFieldSelector', {
             debugMode: true,
         });
         testUtils.mock.addMockEnvironment(fieldSelector, {data: this.data});
-        fieldSelector.appendTo($target);
+        await fieldSelector.appendTo($target);
         var $value = fieldSelector.$("> .o_field_selector_value");
 
         // Focusing the field selector input should open a field selector popover
@@ -84,7 +84,7 @@ QUnit.module('ModelFieldSelector', {
 
         // Clicking the "Bar" field should close the popover and set the field
         // chain to "bar" as it is a basic field
-        testUtils.dom.click($barLi);
+        await testUtils.dom.click($barLi);
         assert.notOk($fieldSelectorPopover.is("visible"),
             "field selector popover should be closed now");
         assert.strictEqual(getValueFromDOM($value), "Bar",
@@ -100,6 +100,7 @@ QUnit.module('ModelFieldSelector', {
 
         // Focusing the input again should open the same popover
         fieldSelector.$el.trigger('focusin');
+        await testUtils.nextTick();
         assert.ok($fieldSelectorPopover.is(":visible"),
             "field selector popover should be visible");
 
@@ -118,7 +119,7 @@ QUnit.module('ModelFieldSelector', {
 
         // Clicking on the "Product" field should update the popover to show
         // the product fields (so only "Product Name" should be there)
-        testUtils.dom.click($productLi);
+        await testUtils.dom.click($productLi);
         $lis = $fieldSelectorPopover.find("li");
         assert.strictEqual($lis.length, 1,
             "there should be only one field proposition for 'product' model");
@@ -127,7 +128,7 @@ QUnit.module('ModelFieldSelector', {
 
         // Clicking on "Product Name" should close the popover and set the chain
         // to "product_id.name"
-        testUtils.dom.click($lis.first());
+        await testUtils.dom.click($lis.first());
         assert.notOk($fieldSelectorPopover.is("visible"),
             "field selector popover should be closed now");
         assert.strictEqual(getValueFromDOM($value), "Product -> Product Name",
@@ -135,10 +136,12 @@ QUnit.module('ModelFieldSelector', {
 
         // Remove the current selection and recreate it again
         fieldSelector.$el.trigger('focusin');
-        testUtils.dom.click(fieldSelector.$('.o_field_selector_prev_page'));
-        testUtils.dom.click(fieldSelector.$('.o_field_selector_close'));
+        await testUtils.nextTick();
+        await testUtils.dom.click(fieldSelector.$('.o_field_selector_prev_page'));
+        await testUtils.dom.click(fieldSelector.$('.o_field_selector_close'));
 
         fieldSelector.$el.trigger('focusin');
+        await testUtils.nextTick();
         $fieldSelectorPopover = fieldSelector.$(".o_field_selector_popover:visible");
         $lis = $fieldSelectorPopover.find("li");
         $productLi = $();
@@ -151,9 +154,9 @@ QUnit.module('ModelFieldSelector', {
         assert.strictEqual($productLi.length, 1,
             "field selector popover should contain the 'Product' field");
 
-        testUtils.dom.click($productLi);
+        await testUtils.dom.click($productLi);
         $lis = $fieldSelectorPopover.find("li");
-        testUtils.dom.click($lis.first());
+        await testUtils.dom.click($lis.first());
         assert.notOk($fieldSelectorPopover.is("visible"),
             "field selector popover should be closed now");
         assert.strictEqual(getValueFromDOM($value), "Product -> Product Name",
@@ -168,7 +171,7 @@ QUnit.module('ModelFieldSelector', {
         }
     });
 
-    QUnit.test("use the filter option", function (assert) {
+    QUnit.test("use the filter option", async function (assert) {
         assert.expect(2);
 
         var $target = $("#qunit-fixture");
@@ -181,9 +184,10 @@ QUnit.module('ModelFieldSelector', {
             },
         });
         testUtils.mock.addMockEnvironment(fieldSelector, {data: this.data});
-        fieldSelector.appendTo($target);
+        await fieldSelector.appendTo($target);
 
         fieldSelector.$el.trigger('focusin');
+        await testUtils.nextTick();
         var $fieldSelectorPopover = fieldSelector.$(".o_field_selector_popover:visible");
         var $lis = $fieldSelectorPopover.find("li");
         assert.strictEqual($lis.length, 1, "there should only be one element");
@@ -192,7 +196,7 @@ QUnit.module('ModelFieldSelector', {
         fieldSelector.destroy();
     });
 
-    QUnit.test("default `showSearchInput` option", function (assert) {
+    QUnit.test("default `showSearchInput` option", async function (assert) {
         assert.expect(6);
 
         var $target = $("#qunit-fixture");
@@ -202,9 +206,10 @@ QUnit.module('ModelFieldSelector', {
             readonly: false,
         });
         testUtils.mock.addMockEnvironment(fieldSelector, {data: this.data});
-        fieldSelector.appendTo($target);
+        await fieldSelector.appendTo($target);
 
         fieldSelector.$el.trigger('focusin');
+        await testUtils.nextTick();
         var $fieldSelectorPopover = fieldSelector.$(".o_field_selector_popover:visible");
         var $searchInput = $fieldSelectorPopover.find(".o_field_selector_search input");
         assert.strictEqual($searchInput.length, 1, "there should be a search input");
@@ -212,17 +217,17 @@ QUnit.module('ModelFieldSelector', {
         // without search
         assert.strictEqual($fieldSelectorPopover.find("li").length, 3, "there should be three available fields");
         assert.strictEqual($fieldSelectorPopover.find("li").text().trim().replace(/\s+/g, ' '), "Bar Foo Product", "the available field should be correct");
-        $searchInput.val('xx').trigger('keyup');
+        await testUtils.fields.editAndTrigger($searchInput, 'xx', 'keyup');
 
         assert.strictEqual($fieldSelectorPopover.find("li").length, 0, "there shouldn't be any element");
-        $searchInput.val('Pro').trigger('keyup');
+        await testUtils.fields.editAndTrigger($searchInput, 'Pro', 'keyup');
         assert.strictEqual($fieldSelectorPopover.find("li").length, 1, "there should only be one element");
         assert.strictEqual($fieldSelectorPopover.find("li").text().trim().replace(/\s+/g, ' '), "Product", "the available field should be the Product");
 
         fieldSelector.destroy();
     });
 
-    QUnit.test("false `showSearchInput` option", function (assert) {
+    QUnit.test("false `showSearchInput` option", async function (assert) {
         assert.expect(1);
 
         var $target = $("#qunit-fixture");
@@ -233,9 +238,10 @@ QUnit.module('ModelFieldSelector', {
             showSearchInput: false,
         });
         testUtils.mock.addMockEnvironment(fieldSelector, { data: this.data });
-        fieldSelector.appendTo($target);
+        await fieldSelector.appendTo($target);
 
         fieldSelector.$el.trigger('focusin');
+        await testUtils.nextTick();
         var $fieldSelectorPopover = fieldSelector.$(".o_field_selector_popover:visible");
         var $searchInput = $fieldSelectorPopover.find(".o_field_selector_search input");
         assert.strictEqual($searchInput.length, 0, "there should be no search input");