[FIX] web: kanban: many2one label after drop

Have a kanban view grouped on a many2one and displaying that many2one
with a widget in the record cards. Drag a record from one column to
another: a crash occurs. This happens because the record update is done
with a value of the form [id, undefined] (that is with no defined label)
and nothing is done in the kanban model to fetch that label,
making impossible to render the many2one after the update. We fix that
problem by using the known group display name as label for the dropped
record.

Part-of: odoo#102925

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

@@ -443,7 +443,9 @@ export class KanbanDynamicGroupList extends DynamicGroupList {
             const refIndex = targetGroup.list.records.findIndex((r) => r.id === refId);
             // Quick update: moves the record at the right position and notifies components
             targetGroup.addRecord(sourceGroup.removeRecord(record), refIndex + 1);
-            const value = isRelational(this.groupByField) ? [targetGroup.value] : targetGroup.value;
+            const value = isRelational(this.groupByField)
+                ? [targetGroup.value, targetGroup.displayName]
+                : targetGroup.value;
 
             const abort = () => {
                 this.model.transaction.abort(dataRecordId);

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

@@ -11942,4 +11942,66 @@ QUnit.module("Views", (hooks) => {
             ["1", "2", "3"]
         );
     });
+
+    QUnit.test(
+        "drag & drop records grouped by m2o with m2o displayed in records",
+        async (assert) => {
+            const prom = makeDeferred();
+            const readIds = [[2], [1, 3, 2]];
+
+            await makeView({
+                type: "kanban",
+                resModel: "partner",
+                serverData,
+                arch: `
+                    <kanban>
+                        <templates>
+                            <t t-name="kanban-box">
+                                <div>
+                                    <field name="product_id" widget="many2one"/>
+                                </div>
+                            </t>
+                        </templates>
+                    </kanban>
+                `,
+                groupBy: ["product_id"],
+                mockRPC: async (route, args) => {
+                    assert.step(args.method || route);
+                    if (args.method === "read") {
+                        assert.deepEqual(args.args[0], readIds.shift());
+                        await prom;
+                    }
+                },
+            });
+
+            assert.verifySteps([
+                "get_views",
+                "web_read_group",
+                "web_search_read",
+                "web_search_read",
+            ]);
+            assert.deepEqual(
+                [...target.querySelectorAll(".o_kanban_record")].map((el) => el.innerText),
+                ["hello", "hello", "xmo", "xmo"]
+            );
+
+            await dragAndDrop(
+                ".o_kanban_group:nth-child(2) .o_kanban_record",
+                ".o_kanban_group:first-child"
+            );
+            assert.deepEqual(
+                [...target.querySelectorAll(".o_kanban_record")].map((el) => el.innerText),
+                ["hello", "hello", "hello", "xmo"]
+            );
+
+            prom.resolve();
+            await nextTick();
+
+            assert.verifySteps(["write", "read", "/web/dataset/resequence", "read"]);
+            assert.deepEqual(
+                [...target.querySelectorAll(".o_kanban_record")].map((el) => el.innerText),
+                ["hello", "hello", "hello", "xmo"]
+            );
+        }
+    );
 });