[FIX] web: allow dropdown selection in m2o

Before this commit, many2one fields were not (fully) usable in a list view: if
the user wrote some text, then when a dropdown with various choices
opened, pressed the 'down' key (to select a choice), the down keypress
caused a navigation move to the next line, which cancelled the
selection.

In this commit, we make the assumption that if the many2one dropdown is
opened, then navigation moves are not what the user wants.

2 files changed, 40 insertions, 5 deletions

diff --git a/addons/web/static/src/js/fields/relational_fields.js b/addons/web/static/src/js/fields/relational_fields.js
index 749efb4ce82..d7b4368036d 100644
--- a/addons/web/static/src/js/fields/relational_fields.js
+++ b/addons/web/static/src/js/fields/relational_fields.js
@@ -533,14 +533,17 @@ var FieldMany2One = AbstractField.extend({
      * start/end of the input element. Stops any navigation move event if the
      * user is selecting text.
      *
-     * TODO this is a duplicate of InputField._onNavigationMove, maybe this
-     * should be done in a mixin or, better, the m2o field should be an
-     * InputField (but this requires some refactoring).
-     *
      * @private
      * @param {OdooEvent} ev
      */
-    _onNavigationMove: basicFields.InputField.prototype._onNavigationMove,
+    _onNavigationMove: function (ev) {
+        // TODO Maybe this should be done in a mixin or, better, the m2o field
+        // should be an InputField (but this requires some refactoring).
+        basicFields.InputField.prototype._onNavigationMove.apply(this, arguments);
+        if (this.mode === 'edit' && $(this.$input.autocomplete('widget')).is(':visible')) {
+            ev.stopPropagation();
+        }
+    },
     /**
      * @private
      * @param {OdooEvent} event
diff --git a/addons/web/static/tests/fields/relational_fields_tests.js b/addons/web/static/tests/fields/relational_fields_tests.js
index 9a326348d2c..3cdd4b89138 100644
--- a/addons/web/static/tests/fields/relational_fields_tests.js
+++ b/addons/web/static/tests/fields/relational_fields_tests.js
@@ -570,6 +570,38 @@ QUnit.module('relational_fields', {
         form.destroy();
     });
 
+    QUnit.test('many2one field and list navigation', function (assert) {
+        assert.expect(3);
+
+        var list = createView({
+            View: ListView,
+            model: 'partner',
+            data: this.data,
+            arch: '<tree editable="bottom"><field name="trululu"/></tree>',
+        });
+
+        // edit first input, to trigger autocomplete
+        list.$('.o_data_row .o_data_cell').first().click();
+        list.$('.o_data_cell input').val('').trigger('input');
+
+        // press keydown, to select first choice
+        list.$('.o_data_cell input').focus().trigger($.Event('keydown', {
+            which: $.ui.keyCode.DOWN,
+            keyCode: $.ui.keyCode.DOWN,
+        }));
+
+        // we now check that the dropdown is open (and that the focus did not go
+        // to the next line)
+        var $dropdown = list.$('.o_field_many2one input').autocomplete('widget');
+        assert.ok($dropdown.is(':visible'), "dropdown should be visible");
+        assert.ok(list.$('.o_data_row:eq(0)').hasClass('o_selected_row'),
+            'first data row should still be selected');
+        assert.ok(!list.$('.o_data_row:eq(1)').hasClass('o_selected_row'),
+            'second data row should not be selected');
+
+        list.destroy();
+    });
+
     QUnit.test('standalone many2one field', function (assert) {
         assert.expect(3);
         var done = assert.async();