diff --git a/packages/react/src/useForm.ts b/packages/react/src/useForm.ts index 5d9514c85..33ac7c98a 100644 --- a/packages/react/src/useForm.ts +++ b/packages/react/src/useForm.ts @@ -132,8 +132,6 @@ export default function useForm>( }, onSuccess: (page) => { if (isMounted.current) { - setProcessing(false) - setProgress(null) setErrors({} as FormDataErrors) setHasErrors(false) setWasSuccessful(true) @@ -152,8 +150,6 @@ export default function useForm>( }, onError: (errors) => { if (isMounted.current) { - setProcessing(false) - setProgress(null) setErrors(errors) setHasErrors(true) } @@ -163,11 +159,6 @@ export default function useForm>( } }, onCancel: () => { - if (isMounted.current) { - setProcessing(false) - setProgress(null) - } - if (options.onCancel) { return options.onCancel() } diff --git a/packages/svelte/src/useForm.ts b/packages/svelte/src/useForm.ts index 6d8df8095..b04b6cf76 100644 --- a/packages/svelte/src/useForm.ts +++ b/packages/svelte/src/useForm.ts @@ -194,8 +194,6 @@ export default function useForm>( } }, onSuccess: async (page: Page) => { - this.setStore('processing', false) - this.setStore('progress', null) this.clearErrors() this.setStore('wasSuccessful', true) this.setStore('recentlySuccessful', true) @@ -206,8 +204,6 @@ export default function useForm>( return onSuccess }, onError: (errors: Errors) => { - this.setStore('processing', false) - this.setStore('progress', null) this.clearErrors().setError(errors) if (options.onError) { @@ -215,9 +211,6 @@ export default function useForm>( } }, onCancel: () => { - this.setStore('processing', false) - this.setStore('progress', null) - if (options.onCancel) { return options.onCancel() } diff --git a/packages/vue3/src/useForm.ts b/packages/vue3/src/useForm.ts index bbb0f58e5..41b72f820 100644 --- a/packages/vue3/src/useForm.ts +++ b/packages/vue3/src/useForm.ts @@ -182,8 +182,6 @@ export default function useForm>( } }, onSuccess: async (page) => { - this.processing = false - this.progress = null this.clearErrors() this.wasSuccessful = true this.recentlySuccessful = true @@ -195,8 +193,6 @@ export default function useForm>( return onSuccess }, onError: (errors) => { - this.processing = false - this.progress = null this.clearErrors().setError(errors) if (options.onError) { @@ -204,9 +200,6 @@ export default function useForm>( } }, onCancel: () => { - this.processing = false - this.progress = null - if (options.onCancel) { return options.onCancel() } diff --git a/tests/form-helper.spec.ts b/tests/form-helper.spec.ts index ebb1ddcb9..16c8fc5a4 100644 --- a/tests/form-helper.spec.ts +++ b/tests/form-helper.spec.ts @@ -658,36 +658,6 @@ test.describe('Form Helper', () => { await expect(pageData).toHaveProperty('version') }) - test('marks the form as no longer processing', async ({ page }) => { - await page.getByRole('button', { exact: true, name: 'onSuccess resets processing' }).click() - - const data = await page.evaluate(() => (window as any).data) - - const processing = data.find((d) => d.event === 'onStart' && d.type === 'processing').data - const notProcessing = data.find((d) => d.event === 'onFinish' && d.type === 'processing').data - - await expect(processing).toBe(true) - await expect(notProcessing).toBe(false) - }) - - test('resets the progress property back to null', async ({ page }) => { - await clickAndWaitForResponse(page, 'onSuccess progress property', 'sleep', 'button') - - const messages = await page.evaluate(() => (window as any).events) - const data = await page.evaluate(() => (window as any).data) - const event = data.find((d) => d.event === 'onProgress' && d.type === 'progress').data - const endEvent = data.find((d) => d.event === 'onFinish' && d.type === 'progress').data - - await expect(event).toHaveProperty('percentage') - await expect(event).toHaveProperty('total') - await expect(event).toHaveProperty('loaded') - await expect(event.percentage).toBeGreaterThanOrEqual(0) - await expect(event.percentage).toBeLessThanOrEqual(100) - - await expect(messages[4]).toBe('onFinish') - await expect(endEvent).toBeNull() - }) - test('can delay onFinish from firing by returning a promise', async ({ page }) => { await clickAndWaitForResponse(page, 'onSuccess promise', '/dump/post', 'button') @@ -775,42 +745,6 @@ test.describe('Form Helper', () => { await expect(errors.name).toBe('Some name error') }) - test('marks the form as no longer processing', async ({ page }) => { - await clickAndWaitForResponse(page, 'onError resets processing', 'form-helper/events/errors', 'button') - - const messages = await page.evaluate(() => (window as any).events) - const data = await page.evaluate(() => (window as any).data) - - await expect(messages).toEqual(['onBefore', 'onCancelToken', 'onStart', 'onError', 'onFinish']) - - const processing = data.find((d) => d.event === 'onStart' && d.type === 'processing').data - const notProcessing = data.find((d) => d.event === 'onFinish' && d.type === 'processing').data - - await expect(processing).toBe(true) - await expect(notProcessing).toBe(false) - }) - - test('resets the progress property back to null', async ({ page }) => { - await clickAndWaitForResponse(page, 'onError progress property', 'form-helper/events/errors', 'button') - - const messages = await page.evaluate(() => (window as any).events) - const data = await page.evaluate(() => (window as any).data) - - await expect(messages[3]).toBe('onProgress') - - const event = data.find((d) => d.event === 'onProgress' && d.type === 'progress').data - const finishEvent = data.find((d) => d.event === 'onFinish' && d.type === 'progress').data - - await expect(event).toHaveProperty('percentage') - await expect(event).toHaveProperty('total') - await expect(event).toHaveProperty('loaded') - await expect(event.percentage).toBeGreaterThanOrEqual(0) - await expect(event.percentage).toBeLessThanOrEqual(100) - - await expect(messages[4]).toBe('onError') - await expect(finishEvent).toBeNull() - }) - test('sets form errors', async ({ page }) => { await clickAndWaitForResponse(page, 'Errors set on error', 'form-helper/events/errors', 'button') @@ -854,6 +788,36 @@ test.describe('Form Helper', () => { await expect(messages).toEqual(['onBefore', 'onCancelToken', 'onStart', 'onSuccess', 'onFinish']) }) + + test('marks the form as no longer processing', async ({ page }) => { + await page.getByRole('button', { exact: true, name: 'onSuccess resets processing' }).click() + + const data = await page.evaluate(() => (window as any).data) + + const processing = data.find((d) => d.event === 'onStart' && d.type === 'processing').data + const notProcessing = data.find((d) => d.event === 'onFinish' && d.type === 'processing').data + + await expect(processing).toBe(true) + await expect(notProcessing).toBe(false) + }) + + test('resets the progress property back to null', async ({ page }) => { + await clickAndWaitForResponse(page, 'onSuccess progress property', 'sleep', 'button') + + const messages = await page.evaluate(() => (window as any).events) + const data = await page.evaluate(() => (window as any).data) + const event = data.find((d) => d.event === 'onProgress' && d.type === 'progress').data + const endEvent = data.find((d) => d.event === 'onFinish' && d.type === 'progress').data + + await expect(event).toHaveProperty('percentage') + await expect(event).toHaveProperty('total') + await expect(event).toHaveProperty('loaded') + await expect(event.percentage).toBeGreaterThanOrEqual(0) + await expect(event.percentage).toBeLessThanOrEqual(100) + + await expect(messages[4]).toBe('onFinish') + await expect(endEvent).toBeNull() + }) }) }) })