|
| 1 | +import { test, expect, type Page } from '@playwright/test'; |
| 2 | + |
| 3 | +const ORIGIN = 'https://debate.pi-stack.org'; |
| 4 | +const TOOL_PAGES = [ |
| 5 | + { path: '/tools', h1: 'Free debate tools', type: 'CollectionPage' }, |
| 6 | + { path: '/tools/debate-timer', h1: 'Free debate timer for every format', type: 'WebApplication' }, |
| 7 | + { path: '/tools/debate-motion-generator', h1: 'Debate motion generator', type: 'WebApplication' }, |
| 8 | + { path: '/tools/debate-flow-sheet', h1: 'Printable debate flow sheet', type: 'WebApplication' }, |
| 9 | + { path: '/tools/speech-time-calculator', h1: 'How long is my speech? Speech time calculator', type: 'WebApplication' }, |
| 10 | +] as const; |
| 11 | + |
| 12 | +/** Every request the page makes to a Supabase host or API path. The free tools need none. */ |
| 13 | +function watchSupabase(page: Page): string[] { |
| 14 | + const calls: string[] = []; |
| 15 | + page.on('request', (request) => { |
| 16 | + const url = new URL(request.url()); |
| 17 | + if (url.hostname.endsWith('supabase.co') || /^\/(auth|rest|functions|storage)\/v1\//.test(url.pathname)) calls.push(request.url()); |
| 18 | + }); |
| 19 | + return calls; |
| 20 | +} |
| 21 | + |
| 22 | +const T0 = new Date('2026-10-22T10:00:00Z').getTime(); |
| 23 | + |
| 24 | +/** Opens a page on a fake clock that only moves when the test runs it forward. */ |
| 25 | +async function openPaused(page: Page, path: string) { |
| 26 | + await page.clock.install({ time: T0 }); |
| 27 | + await page.goto(path); |
| 28 | + await page.clock.pauseAt(T0 + 5_000); |
| 29 | +} |
| 30 | + |
| 31 | +function watchErrors(page: Page): string[] { |
| 32 | + const errors: string[] = []; |
| 33 | + page.on('pageerror', (error) => errors.push(error.message)); |
| 34 | + page.on('console', (message) => { |
| 35 | + if (message.type() === 'error' && !/Failed to load resource|net::ERR_/.test(message.text())) errors.push(message.text()); |
| 36 | + }); |
| 37 | + return errors; |
| 38 | +} |
| 39 | + |
| 40 | +test.describe('free debate tools', { tag: '@smoke' }, () => { |
| 41 | + for (const tool of TOOL_PAGES) { |
| 42 | + test(`${tool.path} renders signed out with its head and structured data`, async ({ page }) => { |
| 43 | + const supabase = watchSupabase(page); |
| 44 | + const errors = watchErrors(page); |
| 45 | + const response = await page.goto(tool.path); |
| 46 | + expect(response?.ok()).toBeTruthy(); |
| 47 | + await expect(page.getByRole('heading', { level: 1, name: tool.h1 })).toBeVisible(); |
| 48 | + await expect(page.locator('link[rel="canonical"]')).toHaveAttribute('href', `${ORIGIN}${tool.path}`); |
| 49 | + await expect(page).toHaveTitle(/DebateLab/); |
| 50 | + const graphs = await page.locator('script[type="application/ld+json"]').allTextContents(); |
| 51 | + const types = graphs.flatMap((json) => (JSON.parse(json)['@graph'] as { '@type': string }[]).map((node) => node['@type'])); |
| 52 | + expect(types).toContain(tool.type); |
| 53 | + expect(types).toContain('BreadcrumbList'); |
| 54 | + expect(JSON.stringify(graphs)).not.toMatch(/aggregateRating|"review"/); |
| 55 | + expect(supabase, supabase.join('\n')).toEqual([]); |
| 56 | + expect(errors, errors.join('\n')).toEqual([]); |
| 57 | + }); |
| 58 | + } |
| 59 | + |
| 60 | + test('the timer starts, pauses and opens points of information after the first minute', async ({ page }) => { |
| 61 | + await openPaused(page, '/tools/debate-timer?format=bp'); |
| 62 | + const clock = page.getByRole('timer', { name: 'Speech time remaining' }); |
| 63 | + await expect(clock).toHaveText('7:00'); |
| 64 | + await expect(page.getByText('Protected time', { exact: true })).toBeVisible(); |
| 65 | + |
| 66 | + await page.getByRole('button', { name: 'Start' }).click(); |
| 67 | + await page.clock.runFor(61_000); |
| 68 | + await expect(clock).toHaveText('5:59'); |
| 69 | + await expect(page.getByText('POIs open', { exact: true })).toBeVisible(); |
| 70 | + |
| 71 | + await page.getByRole('button', { name: 'Pause' }).click(); |
| 72 | + await page.clock.runFor(5_000); |
| 73 | + await expect(clock).toHaveText('5:59'); |
| 74 | + |
| 75 | + // The round survives a reload. |
| 76 | + await page.reload(); |
| 77 | + await expect(page.getByRole('timer', { name: 'Speech time remaining' })).toHaveText('5:59'); |
| 78 | + |
| 79 | + // Keys act once the timer has focus. |
| 80 | + await page.getByRole('timer', { name: 'Speech time remaining' }).click(); |
| 81 | + await page.keyboard.press('ArrowRight'); |
| 82 | + await expect(page.getByRole('heading', { level: 2, name: 'Leader of the Opposition (Opening Opposition)' })).toBeVisible(); |
| 83 | + }); |
| 84 | + |
| 85 | + test('a custom format applies, lands in the share link, and survives a reload', async ({ page }) => { |
| 86 | + await page.goto('/tools/debate-timer?format=wsdc'); |
| 87 | + await page.getByRole('button', { name: 'Build a custom format' }).click(); |
| 88 | + const editor = page.getByRole('form', { name: 'Custom format' }); |
| 89 | + await editor.getByLabel('Format name').fill('Club round'); |
| 90 | + // Whole and fractional minutes both submit; the browser's step check once blocked every value. |
| 91 | + await editor.getByLabel('Minutes', { exact: true }).first().fill('5'); |
| 92 | + await editor.getByLabel('Minutes', { exact: true }).nth(1).fill('2.5'); |
| 93 | + await editor.getByRole('button', { name: 'Use this format' }).click(); |
| 94 | + await expect(editor).toHaveCount(0); |
| 95 | + await expect(page).toHaveURL(/format=custom&custom=[A-Za-z0-9_-]+/); |
| 96 | + await expect(page.getByRole('timer', { name: 'Speech time remaining' })).toHaveText('5:00'); |
| 97 | + await page.reload(); |
| 98 | + await expect(page.getByRole('region', { name: /round timer/ }).getByLabel('Format')).toHaveValue('custom'); |
| 99 | + await expect(page.getByRole('navigation', { name: 'Speeches' })).toContainText('2:30'); |
| 100 | + }); |
| 101 | + |
| 102 | + test('prep banks run down one side at a time', async ({ page }) => { |
| 103 | + await openPaused(page, '/tools/debate-timer?format=pf'); |
| 104 | + const teamA = page.getByRole('button', { name: /Team A prep/ }); |
| 105 | + const teamB = page.getByRole('button', { name: /Team B prep/ }); |
| 106 | + await teamA.click(); |
| 107 | + await page.clock.runFor(30_000); |
| 108 | + await teamB.click(); |
| 109 | + await page.clock.runFor(10_000); |
| 110 | + await expect(teamA).toContainText('2:30'); |
| 111 | + await expect(teamB).toContainText('2:50'); |
| 112 | + await expect(teamB).toHaveAttribute('aria-pressed', 'true'); |
| 113 | + await expect(teamA).toHaveAttribute('aria-pressed', 'false'); |
| 114 | + }); |
| 115 | + |
| 116 | + test('the embed renders the format alone, makes no third-party request, and stays out of the index', async ({ page, baseURL }) => { |
| 117 | + const external: string[] = []; |
| 118 | + page.on('request', (request) => { |
| 119 | + if (new URL(request.url()).origin !== new URL(baseURL!).origin) external.push(request.url()); |
| 120 | + }); |
| 121 | + await page.goto('/embed/debate-timer?format=wsdc'); |
| 122 | + await expect(page.getByRole('heading', { level: 2, name: 'First Proposition' })).toBeVisible(); |
| 123 | + await expect(page.locator('meta[name="robots"]')).toHaveAttribute('content', 'noindex'); |
| 124 | + await expect(page.locator('link[rel="canonical"]')).toHaveAttribute('href', `${ORIGIN}/tools/debate-timer`); |
| 125 | + const attribution = page.getByRole('link', { name: 'Timer by DebateLab' }); |
| 126 | + await expect(attribution).toHaveAttribute('href', `${ORIGIN}/tools/debate-timer`); |
| 127 | + await expect(attribution).not.toHaveAttribute('rel', /nofollow/); |
| 128 | + await expect(page.getByLabel('Format')).toHaveCount(0); |
| 129 | + await page.getByRole('button', { name: 'Start' }).click(); |
| 130 | + await expect(page.getByRole('button', { name: 'Pause' })).toBeVisible(); |
| 131 | + // Running for a few seconds gives any stray request time to show up. |
| 132 | + await expect(page.getByRole('timer', { name: 'Speech time remaining' })).toHaveText('7:57', { timeout: 10_000 }); |
| 133 | + expect(external, external.join('\n')).toEqual([]); |
| 134 | + }); |
| 135 | + |
| 136 | + test('a drawn set of motions keeps its permalink', async ({ page }) => { |
| 137 | + await page.goto('/tools/debate-motion-generator'); |
| 138 | + await page.getByRole('button', { name: 'Education', exact: true }).click(); |
| 139 | + await page.getByRole('button', { name: 'Draw three' }).click(); |
| 140 | + const options = page.getByRole('region', { name: 'Motion generator' }).locator('ol > li'); |
| 141 | + await expect(options).toHaveCount(3); |
| 142 | + const drawn = await options.locator('p').first().textContent(); |
| 143 | + await expect(page).toHaveURL(/[?&]m=edu-\d{3}%2Cedu-\d{3}%2Cedu-\d{3}/); |
| 144 | + await page.reload(); |
| 145 | + await expect(page.getByRole('region', { name: 'Motion generator' }).locator('ol > li').first().locator('p').first()).toHaveText(drawn!); |
| 146 | + // The whole bank is on the page for readers and crawlers. |
| 147 | + await expect(page.locator('#edu-001')).toBeAttached(); |
| 148 | + }); |
| 149 | + |
| 150 | + test('the calculator times a pasted speech and fits it to speech slots', async ({ page }) => { |
| 151 | + await page.goto('/tools/speech-time-calculator'); |
| 152 | + await page.getByLabel('Your speech').fill(Array.from({ length: 260 }, (_, i) => `word${i}`).join(' ')); |
| 153 | + await expect(page.getByTestId('word-count')).toHaveText('260'); |
| 154 | + // 260 words at 130 wpm is two minutes: it fits a 2:00 final focus exactly. |
| 155 | + await expect(page.getByTestId('slot-fits').locator('li', { hasText: 'PF 2:00' })).toContainText('0:00 spare'); |
| 156 | + }); |
| 157 | + |
| 158 | + test('the flow sheet has a column per speech and prints', async ({ page }) => { |
| 159 | + await page.goto('/tools/debate-flow-sheet'); |
| 160 | + await page.getByLabel('Format').selectOption('bp'); |
| 161 | + const sheet = page.getByTestId('flow-sheet'); |
| 162 | + for (const speech of ['PM', 'LO', 'DPM', 'DLO', 'MG', 'MO', 'GW', 'OW']) await expect(sheet.getByText(speech, { exact: true })).toBeVisible(); |
| 163 | + await page.emulateMedia({ media: 'print' }); |
| 164 | + await expect(page.getByRole('button', { name: /Print/ })).toBeHidden(); |
| 165 | + await expect(sheet).toBeVisible(); |
| 166 | + }); |
| 167 | + |
| 168 | + test('the landing footer links to the tools hub', async ({ page }) => { |
| 169 | + await page.goto('/'); |
| 170 | + await page.getByRole('contentinfo').getByRole('link', { name: 'Free debate tools' }).click(); |
| 171 | + await expect(page).toHaveURL(/\/tools$/); |
| 172 | + await expect(page.getByRole('heading', { level: 1, name: 'Free debate tools' })).toBeVisible(); |
| 173 | + }); |
| 174 | +}); |
0 commit comments