diff --git a/ui/desktop/src/components/ParameterInputModal.tsx b/ui/desktop/src/components/ParameterInputModal.tsx index bb79732fb..eb5a28784 100644 --- a/ui/desktop/src/components/ParameterInputModal.tsx +++ b/ui/desktop/src/components/ParameterInputModal.tsx @@ -94,7 +94,8 @@ const ParameterInputModal: React.FC = ({ setInputValues((prevValues: Record) => ({ ...prevValues, [name]: value })); }; - const handleSubmit = (): void => { + const handleSubmit = (e: React.SyntheticEvent): void => { + e.preventDefault(); setValidationErrors({}); const requiredParams: Parameter[] = parameters.filter(needsUserValue); diff --git a/ui/desktop/src/components/__tests__/ParameterInputModal.test.tsx b/ui/desktop/src/components/__tests__/ParameterInputModal.test.tsx index 847ac9707..1f96b8dbd 100644 --- a/ui/desktop/src/components/__tests__/ParameterInputModal.test.tsx +++ b/ui/desktop/src/components/__tests__/ParameterInputModal.test.tsx @@ -80,6 +80,30 @@ describe('ParameterInputModal', () => { }); }); + it('prevents the default form submission when Enter is pressed in a parameter field', async () => { + const user = userEvent.setup(); + renderWithIntl(); + + let submitFired = false; + let defaultPrevented: boolean | undefined; + const captureSubmit = (event: Event) => { + submitFired = true; + // Read before suppressing, otherwise this listener would mask the result + defaultPrevented = event.defaultPrevented; + event.preventDefault(); + }; + document.addEventListener('submit', captureSubmit); + + try { + await user.type(screen.getByLabelText(/test parameter 1/i), 'test value{Enter}'); + } finally { + document.removeEventListener('submit', captureSubmit); + } + + expect(submitFired).toBe(true); + expect(defaultPrevented).toBe(true); + }); + it('shows validation errors for required parameters', async () => { const user = userEvent.setup(); renderWithIntl();