From 16bee6a86e5cd474d53b67a4b0e2d36db9c5fabb Mon Sep 17 00:00:00 2001
From: Paul Morelle <pmo@odoo.com>
Date: Wed, 18 Nov 2020 12:13:35 +0000
Subject: [PATCH] [FIX] mail: select first contact in new message box
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In previous versions of Odoo, in the New message box, typing a few
letters of the name of your recipient and pressing Enter would
automatically select the conversation with this contact.

Since 14.0, one has to select the first result with the Down key.
This commit restores the previous behavior by using the
[`autofocus`](https://api.jqueryui.com/autocomplete/#option-autoFocus)
option.

closes odoo/odoo#61967

X-original-commit: addd392a1b5f7e569c65a4503152ba0bdfe49eb3
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 .../autocomplete_input/autocomplete_input.js  |  1 +
 .../chat_window_manager_tests.js              | 42 +++++++++++++++++++
 2 files changed, 43 insertions(+)

diff --git a/addons/mail/static/src/components/autocomplete_input/autocomplete_input.js b/addons/mail/static/src/components/autocomplete_input/autocomplete_input.js
index e9bb5286ee2..c80bbafc4c7 100644
--- a/addons/mail/static/src/components/autocomplete_input/autocomplete_input.js
+++ b/addons/mail/static/src/components/autocomplete_input/autocomplete_input.js
@@ -11,6 +11,7 @@ class AutocompleteInput extends Component {
         }
 
         let args = {
+            autoFocus: true,
             select: (ev, ui) => this._onAutocompleteSelect(ev, ui),
             source: (req, res) => this._onAutocompleteSource(req, res),
             focus: ev => this._onAutocompleteFocus(ev),
diff --git a/addons/mail/static/src/components/chat_window_manager/chat_window_manager_tests.js b/addons/mail/static/src/components/chat_window_manager/chat_window_manager_tests.js
index d8c62e31a87..e76ff23fc38 100644
--- a/addons/mail/static/src/components/chat_window_manager/chat_window_manager_tests.js
+++ b/addons/mail/static/src/components/chat_window_manager/chat_window_manager_tests.js
@@ -380,6 +380,48 @@ QUnit.test('open chat from "new message" chat window should open chat in place o
     );
 });
 
+QUnit.test('new message autocomplete should automatically select first result', async function (assert) {
+    assert.expect(1);
+
+    this.data['res.partner'].records.push({ id: 131, name: "Partner 131" });
+    this.data['res.users'].records.push({ partner_id: 131 });
+    const imSearchDef = makeDeferred();
+    await this.start({
+        async mockRPC(route, args) {
+            const res = await this._super(...arguments);
+            if (args.method === 'im_search') {
+                imSearchDef.resolve();
+            }
+            return res;
+        },
+    });
+
+    // open "new message" chat window
+    await afterNextRender(() =>
+        document.querySelector(`.o_MessagingMenu_toggler`).click()
+    );
+    await afterNextRender(() =>
+        document.querySelector(`.o_MessagingMenu_newMessageButton`).click()
+    );
+
+    // search for a user in "new message" autocomplete
+    document.execCommand('insertText', false, "131");
+    document.querySelector(`.o_ChatWindow_newMessageFormInput`)
+        .dispatchEvent(new window.KeyboardEvent('keydown'));
+    document.querySelector(`.o_ChatWindow_newMessageFormInput`)
+        .dispatchEvent(new window.KeyboardEvent('keyup'));
+    // Wait for search RPC to be resolved. The following await lines are
+    // necessary because autocomplete is an external lib therefore it is not
+    // possible to use `afterNextRender`.
+    await imSearchDef;
+    await nextAnimationFrame();
+    assert.hasClass(
+        document.querySelector('.ui-autocomplete .ui-menu-item a'),
+        'ui-state-active',
+        "first autocomplete result should be automatically selected",
+    );
+});
+
 QUnit.test('chat window: basic rendering', async function (assert) {
     assert.expect(11);