|
| 1 | +/** |
| 2 | + * Network Status Component Tests |
| 3 | + * Validates toast behavior and connection indicator updates using the testing fixture route |
| 4 | + * @see src/pages/testing/network-status.astro |
| 5 | + */ |
| 6 | + |
| 7 | +import type { Page } from '@playwright/test' |
| 8 | +import { BasePage, expect, test } from '@test/e2e/helpers' |
| 9 | + |
| 10 | +const NETWORK_STATUS_FIXTURE = { |
| 11 | + path: '/testing/network-status', |
| 12 | + toastSelector: '#network-status-toast', |
| 13 | + indicatorSelector: '[data-testid="connection-indicator"]', |
| 14 | +} |
| 15 | + |
| 16 | +async function loadNetworkStatusFixture(playwrightPage: Page) { |
| 17 | + const page = await BasePage.init(playwrightPage) |
| 18 | + await page.goto(NETWORK_STATUS_FIXTURE.path) |
| 19 | + await page.waitForLoadState('networkidle') |
| 20 | + return page |
| 21 | +} |
| 22 | + |
| 23 | +async function dispatchConnectionEvent(page: BasePage, eventName: 'online' | 'offline') { |
| 24 | + await page.evaluate(name => { |
| 25 | + window.dispatchEvent(new Event(name)) |
| 26 | + }, eventName) |
| 27 | +} |
| 28 | + |
| 29 | +test.describe('Network Status Component', () => { |
| 30 | + test('renders toast host and connection indicator in testing fixture', async ({ page: playwrightPage }) => { |
| 31 | + const page = await loadNetworkStatusFixture(playwrightPage) |
| 32 | + const toast = page.locator(NETWORK_STATUS_FIXTURE.toastSelector) |
| 33 | + const indicator = page.locator(NETWORK_STATUS_FIXTURE.indicatorSelector) |
| 34 | + |
| 35 | + await expect(toast).toHaveClass(/hidden/) |
| 36 | + await expect(indicator).toHaveText('Online') |
| 37 | + await expect(indicator).toHaveClass(/text-green-600/) |
| 38 | + }) |
| 39 | + |
| 40 | + test('updates connection status and shows toast after reconnection', async ({ page: playwrightPage }) => { |
| 41 | + const page = await loadNetworkStatusFixture(playwrightPage) |
| 42 | + const toast = page.locator(NETWORK_STATUS_FIXTURE.toastSelector) |
| 43 | + const indicator = page.locator(NETWORK_STATUS_FIXTURE.indicatorSelector) |
| 44 | + |
| 45 | + await dispatchConnectionEvent(page, 'offline') |
| 46 | + await expect(indicator).toHaveText('Offline') |
| 47 | + await expect(indicator).toHaveClass(/text-red-600/) |
| 48 | + await expect(toast).toHaveClass(/hidden/) |
| 49 | + |
| 50 | + await dispatchConnectionEvent(page, 'online') |
| 51 | + await expect(indicator).toHaveText('Online') |
| 52 | + await expect(indicator).toHaveClass(/text-green-600/) |
| 53 | + await expect(toast).not.toHaveClass(/hidden/) |
| 54 | + }) |
| 55 | +}) |
0 commit comments