From 6530f1253d28c0b4b83f8b901428a7201c2d51dc Mon Sep 17 00:00:00 2001
From: "Lucas Perais (lpe)" <lpe@odoo.com>
Date: Thu, 21 Feb 2019 16:13:36 +0000
Subject: [PATCH] [FIX] web: list editable create then escape

Have an editable list that begins with a date/time field
create a line.
The first field is focused and the datetimepicker is popped up

Now, stroke ESC key

Before this commit, there was a traceback because the datetimepicker received an erroneous
BLUR/INPUT event

After this commit, there is no traceback as we detroy the widgets of the line
(including the datetimepicker) before removing the row from the DOM

OPW 1932409

closes odoo/odoo#31342
---
 .../js/views/list/list_editable_renderer.js   |  4 +-
 addons/web/static/tests/views/list_tests.js   | 46 +++++++++++++++++++
 2 files changed, 48 insertions(+), 2 deletions(-)

diff --git a/addons/web/static/src/js/views/list/list_editable_renderer.js b/addons/web/static/src/js/views/list/list_editable_renderer.js
index ab5e5036dfa..185a385a812 100644
--- a/addons/web/static/src/js/views/list/list_editable_renderer.js
+++ b/addons/web/static/src/js/views/list/list_editable_renderer.js
@@ -278,6 +278,8 @@ ListRenderer.include({
             this.currentRow = null;
         }
 
+        // destroy widgets first
+        this._destroyFieldWidgets(recordID);
         // remove the row
         var $row = this.$('.o_data_row:nth(' + rowIndex + ')');
         if (this.state.count >= 4) {
@@ -285,8 +287,6 @@ ListRenderer.include({
         } else {
             $row.replaceWith(this._renderEmptyRow());
         }
-
-        this._destroyFieldWidgets(recordID);
     },
     /**
      * Updates the already rendered row associated to the given recordID so that
diff --git a/addons/web/static/tests/views/list_tests.js b/addons/web/static/tests/views/list_tests.js
index 76f4d3f6808..3d2b2881197 100644
--- a/addons/web/static/tests/views/list_tests.js
+++ b/addons/web/static/tests/views/list_tests.js
@@ -10,6 +10,7 @@ var ListView = require('web.ListView');
 var mixins = require('web.mixins');
 var NotificationService = require('web.NotificationService');
 var testUtils = require('web.test_utils');
+var testUtilsDom = require('web.test_utils_dom');
 var widgetRegistry = require('web.widget_registry');
 var Widget = require('web.Widget');
 
@@ -277,6 +278,51 @@ QUnit.module('Views', {
         list.destroy();
     });
 
+    QUnit.test('editable list datetimepicker destroy widget', function (assert) {
+        assert.expect(7);
+        var done = assert.async();
+
+        var list = createView({
+            View: ListView,
+            model: 'foo',
+            data: this.data,
+            arch: '<tree editable="top">' +
+                    '<field name="date"/>' +
+                '</tree>',
+        });
+        list.$el.on({
+            'show.datetimepicker': function () {
+                assert.equal($('.bootstrap-datetimepicker-widget').length, 1,
+                    'The datetimepicker is open');
+
+                assert.equal(list.$('.o_data_row').length, 5,
+                    'There should be 5 rows');
+
+                assert.equal(list.$('.o_selected_row').length, 1,
+                    'One row in edit mode');
+
+                list.$('input.o_datepicker_input').trigger($.Event('keydown', {which: $.ui.keyCode.ESCAPE}));
+
+                assert.equal(list.$('.o_data_row').length, 4,
+                    'There should be 4 rows');
+
+                assert.equal(list.$('.o_selected_row').length, 0,
+                    'No row should be in edit mode');
+
+                done();
+            }
+        });
+        assert.equal(list.$('.o_data_row').length, 4,
+            'There should be 4 rows');
+
+        assert.equal(list.$('.o_selected_row').length, 0,
+            'No row should be in edit mode');
+
+        testUtilsDom.click(list.$buttons.find('.o_list_button_add'));
+
+        list.destroy();
+    });
+
     QUnit.test('at least 4 rows are rendered, even if less data', function (assert) {
         assert.expect(1);