[REF] web: Control panel tests

Use of the new helpers in control panel (and subcomponents) tests and addition
of new tests.

Part of task 2196029

Co-authored-by: Mathieu Duckerts-Antoine <dam@odoo.com>

1 files changed, 163 insertions, 0 deletions

diff --git a/addons/web/static/tests/components/pager_tests.js b/addons/web/static/tests/components/pager_tests.js
new file mode 100644
index 00000000000..424bdde1eaa
--- /dev/null
+++ b/addons/web/static/tests/components/pager_tests.js
@@ -0,0 +1,163 @@
+odoo.define('web.pager_tests', function (require) {
+    "use strict";
+
+    const Pager = require('web.Pager');
+    const testUtils = require('web.test_utils');
+
+    const cpHelpers = testUtils.controlPanel;
+    const { createComponent } = testUtils;
+
+    QUnit.module('Components', {}, function () {
+
+        QUnit.module('Pager');
+
+        QUnit.test('basic interactions', async function (assert) {
+            assert.expect(2);
+
+            const pager = await createComponent(Pager, {
+                props: {
+                    currentMinimum: 1,
+                    limit: 4,
+                    size: 10,
+                },
+                intercepts: {
+                    'pager-changed': function (ev) {
+                        Object.assign(this.state, ev.detail);
+                    },
+                },
+            });
+
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "1-4",
+                "currentMinimum should be set to 1");
+
+            await cpHelpers.pagerNext(pager);
+
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "5-8",
+                "currentMinimum should now be 5");
+
+            pager.destroy();
+        });
+
+        QUnit.test('edit the pager', async function (assert) {
+            assert.expect(4);
+
+            const pager = await createComponent(Pager, {
+                props: {
+                    currentMinimum: 1,
+                    limit: 4,
+                    size: 10,
+                },
+                intercepts: {
+                    'pager-changed': function (ev) {
+                        Object.assign(this.state, ev.detail);
+                    },
+                },
+            });
+
+            await testUtils.dom.click(pager.el.querySelector('.o_pager_value'));
+
+            assert.containsOnce(pager, 'input',
+                "the pager should contain an input");
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "1-4",
+                "the input should have correct value");
+
+            // change the limit
+            await cpHelpers.setPagerValue(pager, "1-6");
+
+            assert.containsNone(pager, 'input',
+                "the pager should not contain an input anymore");
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "1-6",
+                "the limit should have been updated");
+
+            pager.destroy();
+        });
+
+        QUnit.test('pager value formatting', async function (assert) {
+            assert.expect(8);
+
+            const pager = await createComponent(Pager, {
+                props: {
+                    currentMinimum: 1,
+                    limit: 4,
+                    size: 10,
+                },
+                intercepts: {
+                    'pager-changed': function (ev) {
+                        Object.assign(this.state, ev.detail);
+                    },
+                },
+            });
+
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "1-4", "Initial value should be correct");
+
+            async function inputAndAssert(input, expected, reason) {
+                await cpHelpers.setPagerValue(pager, input);
+                assert.strictEqual(cpHelpers.getPagerValue(pager), expected,
+                    `Pager value should be "${expected}" when given "${input}": ${reason}`);
+            }
+
+            await inputAndAssert("4-4", "4", "values are squashed when minimum = maximum");
+            await inputAndAssert("1-11", "1-10", "maximum is floored to size when out of range");
+            await inputAndAssert("20-15", "10", "combination of the 2 assertions above");
+            await inputAndAssert("6-5", "10", "fallback to previous value when minimum > maximum");
+            await inputAndAssert("definitelyValidNumber", "10", "fallback to previous value if not a number");
+            await inputAndAssert(" 1 ,  2   ", "1-2", "value is normalized and accepts several separators");
+            await inputAndAssert("3  8", "3-8", "value accepts whitespace(s) as a separator");
+
+            pager.destroy();
+        });
+
+        QUnit.test('pager disabling', async function (assert) {
+            assert.expect(9);
+
+            const reloadPromise = testUtils.makeTestPromise();
+            const pager = await createComponent(Pager, {
+                props: {
+                    currentMinimum: 1,
+                    limit: 4,
+                    size: 10,
+                },
+                intercepts: {
+                    // The goal here is to test the reactivity of the pager; in a
+                    // typical views, we disable the pager after switching page
+                    // to avoid switching twice with the same action (double click).
+                    'pager-changed': async function (ev) {
+                        // 1. Simulate a (long) server action
+                        await reloadPromise;
+                        // 2. Update the view with loaded data
+                        Object.assign(this.state, ev.detail);
+                    },
+                },
+            });
+            const pagerButtons = pager.el.querySelectorAll('button');
+
+            // Click twice
+            await cpHelpers.pagerNext(pager);
+            await cpHelpers.pagerNext(pager);
+            // Try to edit the pager value
+            await testUtils.dom.click(pager.el.querySelector('.o_pager_value'));
+
+            assert.strictEqual(pagerButtons.length, 2, "the two buttons should be displayed");
+            assert.ok(pagerButtons[0].disabled, "'previous' is disabled");
+            assert.ok(pagerButtons[1].disabled, "'next' is disabled");
+            assert.strictEqual(pager.el.querySelector('.o_pager_value').tagName, 'SPAN',
+                "pager edition is prevented");
+
+            // Server action is done
+            reloadPromise.resolve();
+            await testUtils.nextTick();
+
+            assert.strictEqual(pagerButtons.length, 2, "the two buttons should be displayed");
+            assert.notOk(pagerButtons[0].disabled, "'previous' is enabled");
+            assert.notOk(pagerButtons[1].disabled, "'next' is enabled");
+            assert.strictEqual(cpHelpers.getPagerValue(pager), "5-8", "value has been updated");
+
+            await testUtils.dom.click(pager.el.querySelector('.o_pager_value'));
+
+            assert.strictEqual(pager.el.querySelector('.o_pager_value').tagName, 'INPUT',
+                "pager edition is re-enabled");
+
+            pager.destroy();
+        });
+    });
+});