From c5f8f35747b4ca9633c664d6be74614c5ce22fcd Mon Sep 17 00:00:00 2001
From: Martin Geubelle <mge@odoo.com>
Date: Mon, 19 Jun 2017 15:17:05 +0200
Subject: [FIX] web: properly handle tab navigation in readonly

The tab navigation was only working in edit mode. Entering a readonly form
view with input fields was causing a traceback.

As the default browser behaviour has been overriden with custom navigation,
we need to specify which widget can be focused (e.g.: url, many2one, etc.).
---
 addons/web/static/src/js/fields/basic_fields.js | 51 ++++++++++++++++++++++---
 1 file changed, 46 insertions(+), 5 deletions(-)

(limited to 'addons/web/static/src/js/fields/basic_fields.js')

diff --git a/addons/web/static/src/js/fields/basic_fields.js b/addons/web/static/src/js/fields/basic_fields.js
index ef1832e00d6..79654cc3095 100644
--- a/addons/web/static/src/js/fields/basic_fields.js
+++ b/addons/web/static/src/js/fields/basic_fields.js
@@ -285,11 +285,15 @@ var InputField = DebouncedField.extend({
      */
     _onNavigationMove: function (ev) {
         this._super.apply(this, arguments);
-        var input = this.$input[0];
-        var selecting = (input.selectionEnd !== input.selectionStart);
-        if ((ev.data.direction === "left" && (selecting || input.selectionStart !== 0))
-         || (ev.data.direction === "right" && (selecting || input.selectionStart !== input.value.length))) {
-            ev.stopPropagation();
+
+        // the following code only makes sense in edit mode, with an input
+        if (this.mode === 'edit') {
+            var input = this.$input[0];
+            var selecting = (input.selectionEnd !== input.selectionStart);
+            if ((ev.data.direction === "left" && (selecting || input.selectionStart !== 0))
+             || (ev.data.direction === "right" && (selecting || input.selectionStart !== input.value.length))) {
+                ev.stopPropagation();
+            }
         }
     },
 });
@@ -814,6 +818,19 @@ var FieldEmail = InputField.extend({
         this.tagName = this.mode === 'readonly' ? 'a' : 'input';
     },
 
+    //--------------------------------------------------------------------------
+    // Public
+    //--------------------------------------------------------------------------
+
+    /**
+     * Returns the associated link.
+     *
+     * @override
+     */
+    getFocusableElement: function () {
+        return this.mode === 'readonly' && this.$el || $();
+    },
+
     //--------------------------------------------------------------------------
     // Private
     //--------------------------------------------------------------------------
@@ -849,6 +866,17 @@ var FieldPhone = FieldEmail.extend({
             this.tagName = 'span';
         }
     },
+    /**
+     * Returns the associated link only if there is one.
+     *
+     * @override
+     */
+    getFocusableElement: function () {
+        if (this._canCall()) {
+            return this._super.apply(this, arguments);
+        }
+        return $();
+    },
 
     //--------------------------------------------------------------------------
     // Private
@@ -902,6 +930,19 @@ var UrlWidget = InputField.extend({
         this.tagName = this.mode === 'readonly' ? 'a' : 'input';
     },
 
+    //--------------------------------------------------------------------------
+    // Public
+    //--------------------------------------------------------------------------
+
+    /**
+     * Returns the associated link.
+     *
+     * @override
+     */
+    getFocusableElement: function () {
+        return this.mode === 'readonly' && this.$el || $();
+    },
+
     //--------------------------------------------------------------------------
     // Private
     //--------------------------------------------------------------------------
-- 
cgit v1.2.3