diff --git a/packages/e2e-tests/tests/app-integrations/webhook.spec.js b/packages/e2e-tests/tests/app-integrations/webhook.spec.js index e457abb8..4eea2aa6 100644 --- a/packages/e2e-tests/tests/app-integrations/webhook.spec.js +++ b/packages/e2e-tests/tests/app-integrations/webhook.spec.js @@ -12,7 +12,7 @@ test.describe('Webhook flow', () => { test('Create a new flow with a sync Webhook step then a Webhook step', async ({ flowEditorPage, page, - request + request, }) => { await flowEditorPage.flowName.click(); await flowEditorPage.flowNameInput.fill('syncWebhook'); @@ -23,10 +23,11 @@ test.describe('Webhook flow', () => { await expect(flowEditorPage.continueButton).toHaveCount(1); await expect(flowEditorPage.continueButton).not.toBeEnabled(); - await page - .getByTestId('parameters.statusCode-power-input') - .locator('[contenteditable]') - .fill('200'); + await expect( + page + .getByTestId('parameters.statusCode-power-input') + .locator('[contenteditable]') + ).toHaveText('200'); await flowEditorPage.clickAway(); await expect(flowEditorPage.continueButton).toHaveCount(1); await expect(flowEditorPage.continueButton).not.toBeEnabled(); @@ -36,7 +37,9 @@ test.describe('Webhook flow', () => { .locator('[contenteditable]') .fill('response from webhook'); await flowEditorPage.clickAway(); - await expect(page.getByTestId("parameters.headers.0.key-power-input")).toBeVisible(); + await expect( + page.getByTestId('parameters.headers.0.key-power-input') + ).toBeVisible(); await expect(flowEditorPage.continueButton).toBeEnabled(); await flowEditorPage.continueButton.click(); @@ -52,7 +55,7 @@ test.describe('Webhook flow', () => { test('Create a new flow with an async Webhook step then a Webhook step', async ({ flowEditorPage, page, - request + request, }) => { await flowEditorPage.flowName.click(); await flowEditorPage.flowNameInput.fill('asyncWebhook'); @@ -75,7 +78,9 @@ test.describe('Webhook flow', () => { .locator('[contenteditable]') .fill('response from webhook'); await flowEditorPage.clickAway(); - await expect(page.getByTestId("parameters.headers.0.key-power-input")).toBeVisible(); + await expect( + page.getByTestId('parameters.headers.0.key-power-input') + ).toBeVisible(); await expect(flowEditorPage.continueButton).toBeEnabled(); await flowEditorPage.continueButton.click(); diff --git a/packages/web/src/components/CodeEditor/index.jsx b/packages/web/src/components/CodeEditor/index.jsx index 5b4fc985..643a85c5 100644 --- a/packages/web/src/components/CodeEditor/index.jsx +++ b/packages/web/src/components/CodeEditor/index.jsx @@ -14,7 +14,7 @@ function CodeEditor(props) { required, name, label, - defaultValue, + defaultValue = '', shouldUnregister = false, disabled, 'data-test': dataTest, @@ -39,7 +39,7 @@ function CodeEditor(props) { ( diff --git a/packages/web/src/components/ControlledAutocomplete/index.jsx b/packages/web/src/components/ControlledAutocomplete/index.jsx index ebb33beb..d441a5de 100644 --- a/packages/web/src/components/ControlledAutocomplete/index.jsx +++ b/packages/web/src/components/ControlledAutocomplete/index.jsx @@ -53,7 +53,7 @@ function ControlledAutocomplete(props) { { return { ...previousValue, - [field.key]: '', + [field.key]: field.value ?? '', __id: uuidv4(), }; }, {}); }, [fields]); + const generateDefaultValue = React.useCallback(() => { + if (defaultValue?.length > 0) { + return defaultValue.map((item) => { + return fields.reduce((previousValue, field) => { + return { + ...previousValue, + // if field value is different than null or undefined - use it, + // otherwise use the parent default value + [field.key]: field.value ?? item[field.key] ?? '', + }; + }, {}); + }); + } else { + return [createEmptyItem()]; + } + }, [defaultValue, fields, createEmptyItem]); + const addItem = React.useCallback(() => { const values = getValues(name); if (!values) { @@ -52,13 +69,11 @@ function DynamicField(props) { React.useEffect( function addInitialGroupWhenEmpty() { const fieldValues = getValues(name); - if (!fieldValues && defaultValue) { - setValue(name, defaultValue); - } else if (!fieldValues) { - setValue(name, [createEmptyItem()]); + if (!fieldValues) { + setValue(name, generateDefaultValue()); } }, - [createEmptyItem, defaultValue], + [generateDefaultValue], ); return ( diff --git a/packages/web/src/components/InputCreator/index.jsx b/packages/web/src/components/InputCreator/index.jsx index aa04b09f..7aea1de6 100644 --- a/packages/web/src/components/InputCreator/index.jsx +++ b/packages/web/src/components/InputCreator/index.jsx @@ -162,6 +162,7 @@ function InputCreator(props) { required={required} disabled={disabled} shouldUnregister={shouldUnregister} + defaultValue={value} /> {isDynamicFieldsLoading && !additionalFields?.length && ( diff --git a/packages/web/src/components/TextField/index.jsx b/packages/web/src/components/TextField/index.jsx index dfe505c2..38b45d7a 100644 --- a/packages/web/src/components/TextField/index.jsx +++ b/packages/web/src/components/TextField/index.jsx @@ -23,7 +23,7 @@ function TextField(props) { const { required, name, - defaultValue, + defaultValue = '', shouldUnregister = false, clickToCopy = false, readOnly = false, @@ -38,7 +38,7 @@ function TextField(props) {