[FIX] web: prevent kanban quick create from closing when modal is opened

The kanban quick create is meant to stay open if a click event is triggered
within a modal, which was working for most cases before this commit.

However, there are some specific tricky cases when the behavior is incorrect.
Issues were mainly observed when using the many2one widget inside a quick
create card.

When typing something into a many2one widget and then focusing out of it, the
widget has a built in feature that asks the user if he wants to create the
record (based on options and necessary create rights).
This implies to open a modal asking the user to create or discard his input.

When you combine a many2one widget IN a kanban quick create card, then type
something in the many2one and click outside of the quick create, it triggers
BOTH the focus out event of the many2one and the click event of the kanban
quick create that verifies if it should be closed.

This click event creates a race condition but the following behavior happens
most of the times:
- The many2one 'focusout' is triggered first, creating the modal to confirm
  record creation (see FieldMany2One#_onInputFocusout) ;
- The click event is registered second, triggering the quick create check to
  see if it should be discarded (see RecordQuickCreate#_onWindowClicked) ;
- The click is technically registered outside of the modal since the modal was
  not created yet. This behavior differs a bit between browsers:
  - On Firefox the click event correctly targets the actual element that was
    clicked (ex: another kanban card) ;
  - On Chrome it varies between the actual element (same as Firefox) and
    sometimes the raw 'body' element.
- The quick create card will then incorrectly consider the click as outside of
  any condition to keep itself open and will close and destroy itself ;
- Which in turn destroys the FieldMany2One and the record creation modal ;
- (If you look carefully on the screen you can see a slight flicker when that
  happens).

During all my testing, only one condition will stay consistent when focusing
out of the FieldMany2One by clicking somewhere else: the body element will
always have the "modal-open" class by the time the click event is triggered in
the RecordQuickCreate.

This is why relying on the condition that an element exists with the
"modal-open" class to avoid closing the quick create card provides reliable
results and seems to suit all necessary conditions and behaviors.

Task 2388450

closes odoo/odoo#62560

X-original-commit: 4930871701da2e2792e73ae3941f336046876f0e
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
Signed-off-by: awa-odoo <awa-odoo@users.noreply.github.com>

2 files changed, 52 insertions, 0 deletions

diff --git a/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js
index eae7c6b401b..ccd0da2008f 100644
--- a/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js
+++ b/addons/web/static/src/js/views/kanban/kanban_record_quick_create.js
@@ -276,6 +276,11 @@ var RecordQuickCreate = Widget.extend({
             return;
         }
 
+        // ignore clicks while a modal is just about to open
+        if ($(document.body).hasClass('modal-open')) {
+            return;
+        }
+
         // ignore clicks if target is no longer in dom (e.g., a click on the
         // 'delete' trash icon of a m2m tag)
         if (!document.contains(ev.target)) {
diff --git a/addons/web/static/tests/views/kanban_tests.js b/addons/web/static/tests/views/kanban_tests.js
index d483bdc8418..8112def29d8 100644
--- a/addons/web/static/tests/views/kanban_tests.js
+++ b/addons/web/static/tests/views/kanban_tests.js
@@ -1478,6 +1478,53 @@ QUnit.module('Views', {
         kanban.destroy();
     });
 
+    QUnit.test('quick create record: cancel when modal is opened', async function (assert) {
+        assert.expect(3);
+
+        const kanban = await createView({
+            View: KanbanView,
+            model: 'partner',
+            data: this.data,
+            arch: '<kanban on_create="quick_create" quick_create_view="some_view_ref">' +
+                    '<templates><t t-name="kanban-box">' +
+                    '<div><field name="foo"/></div>' +
+                    '</t></templates>' +
+                  '</kanban>',
+            archs: {
+                'partner,some_view_ref,form': '<form>' +
+                    '<field name="product_id"/>' +
+                '</form>',
+            },
+            groupBy: ['bar'],
+        });
+
+        // click to add an element
+        await testUtils.dom.click(kanban.$('.o_kanban_header .o_kanban_quick_add i').first());
+        assert.containsOnce(kanban, '.o_kanban_quick_create',
+            "should have open the quick create widget");
+
+        kanban.$('.o_kanban_quick_create input')
+            .val('test')
+            .trigger('keyup')
+            .trigger('focusout');
+        await nextTick();
+
+        // When focusing out of the many2one, a modal to add a 'product' will appear.
+        // The following assertions ensures that a click on the body element that has 'modal-open'
+        // will NOT close the quick create.
+        // This can happen when the user clicks out of the input because of a race condition between
+        // the focusout of the m2o and the global 'click' handler of the quick create.
+        // Check odoo/odoo#61981 for more details.
+        const $body = kanban.$el.closest('body');
+        assert.hasClass($body, 'modal-open',
+            "modal should be opening after m2o focusout");
+        await testUtils.dom.click($body);
+        assert.containsOnce(kanban, '.o_kanban_quick_create',
+            "quick create should stay open while modal is opening");
+
+        kanban.destroy();
+    });
+
     QUnit.test('quick create record: cancel when dirty', async function (assert) {
         assert.expect(7);