[IMP] web: enable drag&drop in ungrouped kanban views

With this rev., the resequencing feature (with drag and drop) that
was already available in list views is now available also in kanban
views having a field with widget="handle". This works for main as
well as x2many kanban views.

Some code handling the resequencing has been moved from the list
components (controller and renderer) to the basic ones, so that the
logic is shared between list and kanban.

Task 1902808

closes odoo/odoo#28581

Signed-off-by: VincentSchippefilt <VincentSchippefilt@users.noreply.github.com>


Co-authored-by: Mohammed Shekha <msh@openerp.com>
Co-authored-by: Aaron Bohy <aab@odoo.com>

2 files changed, 130 insertions, 1 deletions

diff --git a/addons/web/static/tests/fields/relational_fields/field_one2many_tests.js b/addons/web/static/tests/fields/relational_fields/field_one2many_tests.js
index 85975d99231..40d362d220c 100644
--- a/addons/web/static/tests/fields/relational_fields/field_one2many_tests.js
+++ b/addons/web/static/tests/fields/relational_fields/field_one2many_tests.js
@@ -2,7 +2,6 @@ odoo.define('web.field_one_to_many_tests', function (require) {
 "use strict";
 
 var AbstractField = require('web.AbstractField');
-var concurrency = require('web.concurrency');
 var FormView = require('web.FormView');
 var KanbanRecord = require('web.KanbanRecord');
 var ListRenderer = require('web.ListRenderer');
@@ -121,6 +120,7 @@ QUnit.module('fields', {}, function () {
                         display_name: "leonardo",
                         turtle_bar: true,
                         turtle_foo: "yop",
+                        turle_int: 1,
                         partner_ids: [],
                     }, {
                         id: 2,
@@ -8290,6 +8290,59 @@ QUnit.module('fields', {}, function () {
 
             form.destroy();
         });
+
+        QUnit.test('one2many kanban with widget handle', async function (assert) {
+            assert.expect(5);
+
+            this.data.partner.records[0].turtles = [1, 2, 3];
+            var form = await createView({
+                View: FormView,
+                model: 'partner',
+                data: this.data,
+                arch: '<form>' +
+                        '<field name="turtles">' +
+                            '<kanban>' +
+                                '<field name="turtle_int" widget="handle"/>' +
+                                '<templates>' +
+                                    '<t t-name="kanban-box">' +
+                                        '<div><field name="turtle_foo"/></div>' +
+                                    '</t>' +
+                                '</templates>' +
+                            '</kanban>' +
+                        '</field>' +
+                    '</form>',
+                mockRPC: function (route, args) {
+                    if (args.method === 'write') {
+                        assert.deepEqual(args.args[1], {
+                            turtles: [
+                                [1, 2, {turtle_int: 0}],
+                                [1, 3, {turtle_int: 1}],
+                                [1, 1, {turtle_int: 2}],
+                            ],
+                        });
+                    }
+                    return this._super.apply(this, arguments);
+                },
+                res_id: 1,
+            });
+
+            assert.strictEqual(form.$('.o_kanban_record:not(.o_kanban_ghost)').text(), 'yopblipkawa');
+            assert.doesNotHaveClass(form.$('.o_field_one2many .o_kanban_view'), 'ui-sortable');
+
+            await testUtils.form.clickEdit(form);
+
+            assert.hasClass(form.$('.o_field_one2many .o_kanban_view'), 'ui-sortable');
+
+            var $record = form.$('.o_field_one2many[name=turtles] .o_kanban_view .o_kanban_record:first');
+            var $to = form.$('.o_field_one2many[name=turtles] .o_kanban_view .o_kanban_record:nth-child(3)');
+            await testUtils.dom.dragAndDrop($record, $to, {position: "bottom"});
+
+            assert.strictEqual(form.$('.o_kanban_record:not(.o_kanban_ghost)').text(), 'blipkawayop');
+
+            await testUtils.form.clickSave(form);
+
+            form.destroy();
+        });
     });
 });
 });
diff --git a/addons/web/static/tests/views/kanban_tests.js b/addons/web/static/tests/views/kanban_tests.js
index f0dc078f26c..8fbbab8c27b 100644
--- a/addons/web/static/tests/views/kanban_tests.js
+++ b/addons/web/static/tests/views/kanban_tests.js
@@ -5571,6 +5571,82 @@ QUnit.module('Views', {
         kanban.destroy();
     });
 
+    QUnit.test('ungrouped kanban with handle field', async function (assert) {
+        assert.expect(4);
+
+        var envIDs = [1, 2, 3, 4]; // the ids that should be in the environment during this test
+
+        var kanban = await createView({
+            View: KanbanView,
+            model: 'partner',
+            data: this.data,
+            arch: '<kanban>' +
+                    '<field name="int_field" widget="handle" />' +
+                    '<templates><t t-name="kanban-box">' +
+                    '<div>' +
+                        '<field name="foo"/>' +
+                    '</div>' +
+                '</t></templates></kanban>',
+            mockRPC: function (route, args) {
+                if (route === '/web/dataset/resequence') {
+                    assert.deepEqual(args.ids, envIDs,
+                        "should write the sequence in correct order");
+                    return Promise.resolve(true);
+                }
+                return this._super(route, args);
+            },
+        });
+
+        assert.hasClass(kanban.$('.o_kanban_view'), 'ui-sortable');
+        assert.strictEqual(kanban.$('.o_kanban_record:not(.o_kanban_ghost)').text(),
+            'yopblipgnapblip');
+
+        var $record = kanban.$('.o_kanban_view .o_kanban_record:first');
+        var $to = kanban.$('.o_kanban_view .o_kanban_record:nth-child(4)');
+        envIDs = [2, 3, 4, 1]; // first record of moved after last one
+        await testUtils.dom.dragAndDrop($record, $to, {position: "bottom"});
+
+        assert.strictEqual(kanban.$('.o_kanban_record:not(.o_kanban_ghost)').text(),
+            'blipgnapblipyop');
+
+        kanban.destroy();
+    });
+
+    QUnit.test('ungrouped kanban without handle field', async function (assert) {
+        assert.expect(3);
+
+        var kanban = await createView({
+            View: KanbanView,
+            model: 'partner',
+            data: this.data,
+            arch: '<kanban>' +
+                    '<templates><t t-name="kanban-box">' +
+                    '<div>' +
+                        '<field name="foo"/>' +
+                    '</div>' +
+                '</t></templates></kanban>',
+            mockRPC: function (route, args) {
+                if (route === '/web/dataset/resequence') {
+                    assert.ok(false, "should not trigger a resequencing");
+                }
+                return this._super(route, args);
+            },
+        });
+
+        assert.doesNotHaveClass(kanban.$('.o_kanban_view'), 'ui-sortable');
+        assert.strictEqual(kanban.$('.o_kanban_record:not(.o_kanban_ghost)').text(),
+            'yopblipgnapblip');
+
+        var $draggedRecord = kanban.$('.o_kanban_view .o_kanban_record:first');
+        var $to = kanban.$('.o_kanban_view .o_kanban_record:nth-child(4)');
+        await testUtils.dom.dragAndDrop($draggedRecord, $to, {position: "bottom"});
+
+        assert.strictEqual(kanban.$('.o_kanban_record:not(.o_kanban_ghost)').text(),
+            'yopblipgnapblip');
+
+        kanban.destroy();
+    });
+
 });
 
 });