[IMP] web: kanban: drop card only when a column is highlighted

Before, when the user dragged a card outside of a column
(e.g. whitespace to the right), the card was moved to the last stage
for which the event handler for the target was registered.

Now, we move the card only when the card drop is done inside a column.

task-2459381

closes odoo/odoo#98897

Signed-off-by: Simon Genin (ges@odoo) <ges@odoo.com>

addons/web/static/src/views/kanban/kanban_renderer.js

@@ -71,15 +71,21 @@ export class KanbanRenderer extends Component {
                 },
                 onDrop: async ({ element, previous, parent }) => {
                     element.classList.remove("o_record_draggable");
-                    parent && parent.classList && parent.classList.remove("o_kanban_hover");
-                    const refId = previous ? previous.dataset.id : null;
-                    const targetGroupId = parent && parent.dataset.id;
-                    await this.props.list.moveRecord(
-                        dataRecordId,
-                        dataGroupId,
-                        refId,
-                        targetGroupId
-                    );
+                    if (
+                        !this.props.list.isGrouped ||
+                        parent.classList.contains("o_kanban_hover") ||
+                        parent.dataset.id === element.parentElement.dataset.id
+                    ) {
+                        parent && parent.classList && parent.classList.remove("o_kanban_hover");
+                        const refId = previous ? previous.dataset.id : null;
+                        const targetGroupId = parent && parent.dataset.id;
+                        await this.props.list.moveRecord(
+                            dataRecordId,
+                            dataGroupId,
+                            refId,
+                            targetGroupId
+                        );
+                    }
                     element.classList.add("o_record_draggable");
                 },
             });

addons/web/static/tests/views/kanban_view_tests.js

@@ -4070,6 +4070,29 @@ QUnit.module("Views", (hooks) => {
         assert.containsNone(target, ".o_kanban_group:nth-child(2).o_kanban_hover");
     });
 
+    QUnit.test("drag and drop outside of a column", async (assert) => {
+        await makeView({
+            type: "kanban",
+            resModel: "partner",
+            serverData,
+            arch: `
+                <kanban on_create="quick_create">
+                <field name="product_id"/>
+                <templates><t t-name="kanban-box">
+                <div class="oe_kanban_global_click"><field name="foo"/>
+                </div>
+                </t></templates>
+                </kanban>`,
+            groupBy: ["product_id"],
+        });
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 2);
+        assert.containsN(target, ".o_kanban_group:nth-child(2) .o_kanban_record", 2);
+
+        // first record of first column moved to the right of a column
+        await dragAndDrop(".o_kanban_group:first-child .o_kanban_record", ".o_column_quick_create");
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 2);
+    });
+
     QUnit.test("drag and drop a record, grouped by selection", async (assert) => {
         assert.expect(7);