diff --git a/packages/editor-ui/src/components/ParameterInput.vue b/packages/editor-ui/src/components/ParameterInput.vue index c5564ef64f..e7b5e5c339 100644 --- a/packages/editor-ui/src/components/ParameterInput.vue +++ b/packages/editor-ui/src/components/ParameterInput.vue @@ -1187,6 +1187,10 @@ function onUpdateTextInput(value: string) { } function valueChanged(value: NodeParameterValueType | {} | Date) { + if (remoteParameterOptionsLoading.value) { + return; + } + if (props.parameter.name === 'nodeCredentialType') { activeCredentialType.value = value as string; } diff --git a/packages/editor-ui/src/components/__tests__/ParameterInput.test.ts b/packages/editor-ui/src/components/__tests__/ParameterInput.test.ts index 06b3e415ae..02a131a70a 100644 --- a/packages/editor-ui/src/components/__tests__/ParameterInput.test.ts +++ b/packages/editor-ui/src/components/__tests__/ParameterInput.test.ts @@ -4,11 +4,13 @@ import type { useNDVStore } from '@/stores/ndv.store'; import type { CompletionResult } from '@codemirror/autocomplete'; import { createTestingPinia } from '@pinia/testing'; import { faker } from '@faker-js/faker'; - -let mockNdvState: Partial>; -let mockCompletionResult: Partial; import { waitFor } from '@testing-library/vue'; import userEvent from '@testing-library/user-event'; +import type { useNodeTypesStore } from '../../stores/nodeTypes.store'; + +let mockNdvState: Partial>; +let mockNodeTypesState: Partial>; +let mockCompletionResult: Partial; vi.mock('@/stores/ndv.store', () => { return { @@ -16,6 +18,12 @@ vi.mock('@/stores/ndv.store', () => { }; }); +vi.mock('@/stores/nodeTypes.store', () => { + return { + useNodeTypesStore: vi.fn(() => mockNodeTypesState), + }; +}); + vi.mock('@/plugins/codemirror/completions/datatype.completions', () => { return { datatypeCompletions: vi.fn(() => mockCompletionResult), @@ -45,6 +53,9 @@ describe('ParameterInput.vue', () => { typeVersion: 1, }, }; + mockNodeTypesState = { + allNodeTypes: [], + }; }); test('should render an options parameter (select)', async () => { @@ -121,4 +132,32 @@ describe('ParameterInput.vue', () => { expect(emitted('update')).toContainEqual([expect.objectContaining({ value: 'foo' })]); }); + + test('should not reset the value of a multi-select with loadOptionsMethod on load', async () => { + mockNodeTypesState.getNodeParameterOptions = vi.fn(async () => [ + { name: 'ID', value: 'id' }, + { name: 'Title', value: 'title' }, + { name: 'Description', value: 'description' }, + ]); + + const { emitted, container } = renderComponent(ParameterInput, { + pinia: createTestingPinia(), + props: { + path: 'columns', + parameter: { + displayName: 'Columns', + name: 'columns', + type: 'multiOptions', + typeOptions: { loadOptionsMethod: 'getColumnsMultiOptions' }, + }, + modelValue: ['id', 'title'], + }, + }); + + const input = container.querySelector('input') as HTMLInputElement; + expect(input).toBeInTheDocument(); + + // Nothing should be emitted + expect(emitted('update')).toBeUndefined(); + }); });