🧪 [#5040] Add test for deleting one of multiple logic actions in the …

…same trigger

When two variable-set actions are configured for the same trigger, deleting the first action will result in the second one getting the JSON-logic value of the first one.

src/openforms/js/components/admin/form_design/FormLogic.stories.js

@@ -1,4 +1,4 @@
-import {fn} from '@storybook/test';
+import {expect, fn, userEvent, within} from '@storybook/test';
 
 import {
   FeatureFlagsDecorator,
@@ -209,3 +209,74 @@ export const FullFunctionality = {
     availableFormSteps: AVAILABLE_FORM_STEPS,
   },
 };
+
+export const DeletingOneOfMultipleActionsInSameTrigger = {
+  name: 'Deleting one of multiple actions in the same trigger',
+
+  args: {
+    logicRules: [
+      {
+        uuid: 'foo',
+        _generatedId: 'foo', // consumers should generate this, as it's used for the React key prop if no uuid exists
+        _logicType: 'simple',
+        form: 'http://localhost:8000/api/v2/forms/ae26e20c-f059-4fdf-bb82-afc377869bb5',
+        description: 'Sample rule',
+        _mayGenerateDescription: false,
+        order: 1,
+
+        jsonLogicTrigger: {
+          '==': [
+            {
+              var: 'foo',
+            },
+            'bar',
+          ],
+        },
+
+        isAdvanced: false,
+
+        actions: [
+          {
+            component: '',
+            variable: 'foo',
+            formStepUuid: null,
+            action: {
+              type: 'variable',
+              value: 'First action',
+            },
+          },
+          {
+            component: '',
+            variable: 'bar',
+            formStepUuid: null,
+            action: {
+              type: 'variable',
+              value: 'Second action',
+            },
+          },
+        ],
+      },
+    ],
+
+    availableFormVariables: AVAILABLE_FORM_VARIABLES,
+    availableFormSteps: AVAILABLE_FORM_STEPS,
+  },
+
+  play: async ({canvasElement}) => {
+    const canvas = within(canvasElement);
+
+    // Both actions should be present
+    expect(await canvas.findByText(/First action/)).toBeInTheDocument();
+    expect(await canvas.findByText(/Second action/)).toBeInTheDocument();
+
+    // Delete the first action (the first array entry is the delete icon for the entire rule)
+    const deleteIcons = await canvas.findAllByTitle('Verwijderen');
+    expect(deleteIcons).toHaveLength(3);
+    await userEvent.click(deleteIcons[1]);
+    await userEvent.click(await canvas.findByRole('button', {name: 'Accepteren'}));
+
+    // First action should be removed, and the second should still be present
+    expect(canvas.queryByText(/First action/)).not.toBeInTheDocument();
+    expect(await canvas.findByText(/Second action/)).toBeInTheDocument();
+  },
+};