diff --git a/e2e/tests/dashboard/team-setup.spec.ts b/e2e/tests/dashboard/team-setup.spec.ts new file mode 100644 index 000000000000..4399144ebfe9 --- /dev/null +++ b/e2e/tests/dashboard/team-setup.spec.ts @@ -0,0 +1,35 @@ +import { test, expect } from '@playwright/test' +import { setupSite } from '../fixtures' +import { expectLiveViewConnected } from '../test-utils' + +test('submitting team name via Enter key does not crash', async ({ + page, + request +}) => { + await setupSite({ page, request }) + await page.goto('/team/setup') + + await expectLiveViewConnected(page) + + await expect(page.getByRole('button', { name: 'Create Team' })).toBeVisible() + + const nameInput = page.locator('input[name="team[name]"]') + + await nameInput.clear() + await nameInput.fill('My New Team') + + await nameInput.press('Enter') + + await expect(nameInput).toHaveValue('My New Team') + + // the form had no phx-submit handler and plain HTTP POST fallback was made + await page.getByRole('button', { name: 'Create Team' }).click() + + await expect(page).toHaveURL(/\/settings\/team\/general/) + + await expectLiveViewConnected(page) + + const nameInput2 = page.locator('input[name="team[name]"]') + + await expect(nameInput2).toHaveValue('My New Team') +}) diff --git a/e2e/tests/test-utils.ts b/e2e/tests/test-utils.ts index 1d9de1dc3721..e6fe78d969c8 100644 --- a/e2e/tests/test-utils.ts +++ b/e2e/tests/test-utils.ts @@ -2,7 +2,9 @@ import type { Locator, Page } from '@playwright/test' import { expect } from '@playwright/test' export async function expectLiveViewConnected(page: Page) { - return expect(page.locator('.phx-connected')).toHaveCount(1) + await expect + .poll(() => page.locator('.phx-connected').count()) + .toBeGreaterThan(0) } export function randomID() { diff --git a/lib/plausible_web/live/team_setup.ex b/lib/plausible_web/live/team_setup.ex index cf14d8e5d208..46826be6ca66 100644 --- a/lib/plausible_web/live/team_setup.ex +++ b/lib/plausible_web/live/team_setup.ex @@ -84,6 +84,7 @@ defmodule PlausibleWeb.Live.TeamSetup do for={@team_name_form} method="post" phx-change="update-team" + phx-submit="update-team" phx-blur="update-team" id="update-team-form" class="mt-4 mb-8"