From 46a65c4ca6b0145cc75cb1f59a2f5f3fff321fce Mon Sep 17 00:00:00 2001
From: Skaiir <serval.core@gmail.com>
Date: Fri, 16 Aug 2024 05:54:19 +0200
Subject: [PATCH] fix: disallow drop when no formfield is found

Closes #1219
---
 .../src/features/dragging/Dragging.js         |  5 ++
 .../test/spec/FormEditor.spec.js              | 51 +++++++++++++++++++
 2 files changed, 56 insertions(+)

diff --git a/packages/form-js-editor/src/features/dragging/Dragging.js b/packages/form-js-editor/src/features/dragging/Dragging.js
index bf937002b..e0bf3d191 100644
--- a/packages/form-js-editor/src/features/dragging/Dragging.js
+++ b/packages/form-js-editor/src/features/dragging/Dragging.js
@@ -79,6 +79,11 @@ export class Dragging {
 
     if (formFieldNode) {
       formField = this._formFieldRegistry.get(formFieldNode.dataset.id);
+
+      if (!formField) {
+        return 'No associated form field in the registry';
+      }
+
       columns = (formField.layout || {}).columns;
 
       // (1) check for row constraints
diff --git a/packages/form-js-editor/test/spec/FormEditor.spec.js b/packages/form-js-editor/test/spec/FormEditor.spec.js
index 5bc363a67..36241cc6d 100644
--- a/packages/form-js-editor/test/spec/FormEditor.spec.js
+++ b/packages/form-js-editor/test/spec/FormEditor.spec.js
@@ -952,6 +952,57 @@ describe('FormEditor', function () {
       });
     });
 
+    it('should not move form field if it cannot be found in the registry', async function () {
+      // given
+      let dragulaCreated = false;
+
+      await bootstrapFormEditor({
+        schema: schemaRows,
+        container,
+        bootstrapExecute: (editor) => {
+          editor.on('dragula.created', () => {
+            dragulaCreated = true;
+          });
+        },
+      });
+
+      const formFieldRegistry = formEditor.get('formFieldRegistry');
+
+      expect(dragulaCreated).to.be.true;
+
+      const formField = formFieldRegistry.get('Textfield_1');
+
+      // assume
+      expectLayout(formField, {
+        columns: 8,
+        row: 'Row_1',
+      });
+
+      const formFieldVisualComponnet = container.querySelector('[data-id="Textfield_1"]').parentNode;
+
+      const row = container.querySelector('[data-row-id=Row_4]');
+      const bounds = row.getBoundingClientRect();
+
+      formFieldRegistry._formFields['Textfield_1'] = undefined;
+
+      // when
+      startDragging(container, formFieldVisualComponnet);
+      moveDragging(container, {
+        clientX: bounds.x + 10,
+        clientY: bounds.y + 10,
+      });
+
+      endDragging(container);
+
+      // then
+      expectLayout(formField, {
+        columns: 8,
+        row: 'Row_1',
+      });
+
+      expect(formFieldRegistry.get('Textfield_1')).to.be.undefined;
+    });
+
     it('should move form field into group', async function () {
       // given
       let dragulaCreated = false;