diff --git a/packages/astro/components/ViewTransitions.astro b/packages/astro/components/ViewTransitions.astro index d9786ac6ac32..310f1865a92c 100644 --- a/packages/astro/components/ViewTransitions.astro +++ b/packages/astro/components/ViewTransitions.astro @@ -106,8 +106,8 @@ const { fallback = 'animate' } = Astro.props; // the "dialog" method is a special keyword used within elements // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#attr-fs-method - if (method === "dialog") { - return + if (method === 'dialog') { + return; } const options: Options = { sourceElement: submitter ?? form }; @@ -119,7 +119,7 @@ const { fallback = 'animate' } = Astro.props; } else { options.formData = formData; } - + ev.preventDefault(); navigate(action, options); }); diff --git a/packages/astro/e2e/view-transitions.test.js b/packages/astro/e2e/view-transitions.test.js index 27b7ea6d6a76..222c9dfdf2aa 100644 --- a/packages/astro/e2e/view-transitions.test.js +++ b/packages/astro/e2e/view-transitions.test.js @@ -1075,17 +1075,20 @@ test.describe('View Transitions', () => { await expect(page).toHaveURL(expected); }); - test('Dialog using form with method of "dialog" should not trigger navigation', async ({ page, astro }) => { + test('Dialog using form with method of "dialog" should not trigger navigation', async ({ + page, + astro, + }) => { await page.goto(astro.resolveUrl('/dialog')); let requests = []; - page.on('request', request => requests.push(`${request.method()} ${request.url()}`)); + page.on('request', (request) => requests.push(`${request.method()} ${request.url()}`)); await page.click('#open'); - await expect(page.locator("dialog")).toHaveAttribute("open") + await expect(page.locator('dialog')).toHaveAttribute('open'); await page.click('#close'); - await expect(page.locator("dialog")).not.toHaveAttribute("open") + await expect(page.locator('dialog')).not.toHaveAttribute('open'); - expect(requests).toHaveLength(0) + expect(requests).toHaveLength(0); }); });