From 5d41c38673a29b3d89b361738774520caa170e90 Mon Sep 17 00:00:00 2001
From: Pierre Paridans <app@odoo.com>
Date: Tue, 31 Aug 2021 09:22:28 +0000
Subject: [PATCH] [FIX] web: prevent mobile keyboard popping up on tablet
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Before this commit, when loading a view containing a searchbar on a
tablet, the device's keyboard is appearing once the searchbar's field is
autofocused.

Thanks to the backport of the mobile OS detection (see PR
odoo/odoo#75455 ), we are now able to properly target mobile OS
(independent of the screen's resolution) instead of only small screens.

closes odoo/odoo#75880

X-original-commit: b1a7296f060811153039ef73140e78ea702088a1
Signed-off-by: Adrien Dieudonné (adr) <adr@odoo.com>
Signed-off-by: Pierre Paridans <pparidans@users.noreply.github.com>
---
 .../static/src/legacy/js/core/custom_hooks.js |  2 +-
 addons/web/static/src/legacy/xml/base.xml     |  2 +-
 .../control_panel/control_panel_tests.js      | 43 +++++++++++++++++++
 3 files changed, 45 insertions(+), 2 deletions(-)

diff --git a/addons/web/static/src/legacy/js/core/custom_hooks.js b/addons/web/static/src/legacy/js/core/custom_hooks.js
index 8b5d9834d0a..1a9ff8b81fd 100644
--- a/addons/web/static/src/legacy/js/core/custom_hooks.js
+++ b/addons/web/static/src/legacy/js/core/custom_hooks.js
@@ -16,7 +16,7 @@ odoo.define('web.custom_hooks', function (require) {
     function useAutofocus(params = {}) {
         const comp = Component.current;
         // Prevent autofocus in mobile
-        if (comp.env.device.isMobile) {
+        if (comp.env.device.isMobileDevice) {
             return () => {};
         }
         const selector = params.selector || '[autofocus]';
diff --git a/addons/web/static/src/legacy/xml/base.xml b/addons/web/static/src/legacy/xml/base.xml
index f2e4e3228ba..ed071fc1583 100644
--- a/addons/web/static/src/legacy/xml/base.xml
+++ b/addons/web/static/src/legacy/xml/base.xml
@@ -592,7 +592,7 @@
         </div>
         <input type="text"
             class="o_searchview_input"
-            autofocus=""
+            t-att-autofocus="!env.device.isMobileDevice"
             accesskey="Q"
             placeholder="Search..."
             role="searchbox"
diff --git a/addons/web/static/tests/legacy/control_panel/control_panel_tests.js b/addons/web/static/tests/legacy/control_panel/control_panel_tests.js
index c9e89387505..187e0ccb3cb 100644
--- a/addons/web/static/tests/legacy/control_panel/control_panel_tests.js
+++ b/addons/web/static/tests/legacy/control_panel/control_panel_tests.js
@@ -252,5 +252,48 @@ odoo.define('web.control_panel_tests', function (require) {
 
             controlPanel.destroy();
         });
+
+        QUnit.test('search field should be autofocused', async function (assert) {
+            assert.expect(2);
+    
+            const controlPanel = await createControlPanel({
+                model: 'partner',
+                arch: '<search/>',
+                data: this.data,
+                env: {
+                    device: {
+                        isMobileDevice: false,
+                    },
+                },
+            });
+    
+            assert.containsOnce(controlPanel, '.o_searchview_input', "has a search field");
+            assert.containsOnce(controlPanel, '.o_searchview_input:focus-within',
+                "has autofocused search field");
+    
+            controlPanel.destroy();
+        });
+    
+        QUnit.test("search field's autofocus should be disabled on mobile device", async function (assert) {
+            assert.expect(2);
+    
+            const controlPanel = await createControlPanel({
+                model: 'partner',
+                arch: '<search/>',
+                data: this.data,
+                env: {
+                    device: {
+                        isMobileDevice: true,
+                    },
+                },
+            });
+    
+            assert.containsOnce(controlPanel, '.o_searchview_input', "has a search field");
+            assert.containsNone(controlPanel, '.o_searchview_input:focus-within',
+                "hasn't autofocused search field");
+    
+            controlPanel.destroy();
+        });
+
     });
 });