[FIX] web: list width should not be calculated when invisible

Before this commit, the width of the headers in a list were frozen
only when the list was seen, but the calculation of the width might have
happened while it was invisible (thus giving the headers 0px).

Now, the freeze AND the calculation only occur when the list is visible
and can actually be evaluated.

Task 2061848

closes odoo/odoo#36175

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

2 files changed, 43 insertions, 1 deletions

diff --git a/addons/web/static/src/js/views/list/list_editable_renderer.js b/addons/web/static/src/js/views/list/list_editable_renderer.js
index 8e9bead963b..d9cc1115917 100644
--- a/addons/web/static/src/js/views/list/list_editable_renderer.js
+++ b/addons/web/static/src/js/views/list/list_editable_renderer.js
@@ -507,7 +507,9 @@ ListRenderer.include({
      */
     updateState: function (state, params) {
         this.columnWidths = false;
-        if (params.keepWidths) {
+        // There are some cases where a record is added to an invisible list
+        // e.g. set a quotation template with optionnal products
+        if (params.keepWidths && this.$el.is(':visible')) {
             this.columnWidths = this.$('thead th').toArray().map(function (th) {
                 return $(th).outerWidth();
             });
diff --git a/addons/web/static/tests/views/list_tests.js b/addons/web/static/tests/views/list_tests.js
index b9a57e50bb3..546af1638fa 100644
--- a/addons/web/static/tests/views/list_tests.js
+++ b/addons/web/static/tests/views/list_tests.js
@@ -1698,6 +1698,46 @@ QUnit.module('Views', {
         form.destroy();
     });
 
+    QUnit.test('editable list: updating list state while invisible', async function (assert) {
+        assert.expect(1);
+
+        this.data.foo.onchanges = {
+            bar: function (obj) {
+                obj.o2m = [[5], [0, null, { display_name: "Whatever" }]];
+            },
+        };
+        var form = await createView({
+            View: FormView,
+            model: 'foo',
+            data: this.data,
+            res_id: 1,
+            viewOptions: { mode: 'edit' },
+            arch: '<form>' +
+                    '<sheet>' +
+                        '<field name="bar"/>' +
+                        '<notebook>' +
+                            '<page string="Page 1"></page>' +
+                            '<page string="Page 2">' +
+                                '<field name="o2m">' +
+                                    '<tree editable="bottom">' +
+                                        '<field name="display_name"/>' +
+                                    '</tree>' +
+                                '</field>' +
+                            '</page>' +
+                        '</notebook>' +
+                    '</sheet>' +
+                '</form>',
+        });
+
+        await testUtils.dom.click(form.$('.o_field_boolean input'));
+        await testUtils.dom.click(form.$('.nav-item:last() .nav-link'));
+
+        assert.strictEqual(form.$('th')[0].style.width, "",
+            "Column header should be reset and remain unfrozen");
+
+        form.destroy();
+    });
+
     QUnit.test('editable list: unnamed columns cannot be resized', async function (assert) {
         assert.expect(2);