# Instructions - Following Playwright test failed. - Explain why, be concise, respect Playwright best practices. - Provide a snippet of code with the fix, if possible. # Test info - Name: tests/ui/entities.spec.ts >> us.elect.info entity sections >> candidates section - index and random pages - Location: tests/ui/entities.spec.ts:15:7 # Error details ``` Test timeout of 30000ms exceeded. ``` ``` Error: page.goto: net::ERR_ABORTED; maybe frame was detached? Call log: - navigating to "http://10.1.105.22/candidates/", waiting until "load" ``` # Test source ```ts 1 | import { test, expect } from '@playwright/test'; 2 | import { getRandomItems, toRelativePath, premiumVisitor, skipIfPremiumGated } from './helpers'; 3 | 4 | // Entity section tests verify generated content is properly served. 5 | // Samples are seeded (helpers.getRandomItems, SAMPLE_SEED) and logged, and every 6 | // status assertion names its URL, so a failure is reproducible from the log alone. 7 | 8 | // Wait timeout for async data loading (GraphQL browseEntities) 9 | const DATA_LOAD_TIMEOUT = 15000; 10 | 11 | const hasAuthCredentials = !!process.env.PLAYWRIGHT_AUTH_USER; 12 | 13 | test.describe('us.elect.info entity sections', () => { 14 | 15 | test('candidates section - index and random pages', async ({ page }) => { > 16 | const indexResponse = await page.goto('/candidates/'); | ^ Error: page.goto: net::ERR_ABORTED; maybe frame was detached? 17 | expect(indexResponse?.status(), '/candidates/ should answer 200').toBe(200); 18 | await expect(page.locator('h1')).toContainText(/Candidates/i); 19 | 20 | // Wait for GraphQL browseEntities to populate results 21 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 22 | 23 | const links = await page.locator('.entity-search-result').all(); 24 | expect(links.length).toBeGreaterThan(0); 25 | 26 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 27 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 28 | 29 | for (const href of randomLinks) { 30 | const entityResponse = await page.goto(toRelativePath(href)); 31 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 32 | await expect(page.locator('h1')).toBeVisible(); 33 | } 34 | }); 35 | 36 | test('committees section - index and random pages', async ({ page }) => { 37 | const indexResponse = await page.goto('/committees/'); 38 | expect(indexResponse?.status(), '/committees/ should answer 200').toBe(200); 39 | await expect(page.locator('h1')).toContainText(/Committees/i); 40 | 41 | // Wait for GraphQL browseEntities to populate results 42 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 43 | 44 | const links = await page.locator('.entity-search-result').all(); 45 | expect(links.length).toBeGreaterThan(0); 46 | 47 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 48 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 49 | 50 | for (const href of randomLinks) { 51 | const entityResponse = await page.goto(toRelativePath(href)); 52 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 53 | await expect(page.locator('h1')).toBeVisible(); 54 | } 55 | }); 56 | 57 | test('parties section - index and random pages', async ({ page }) => { 58 | const indexResponse = await page.goto('/parties/'); 59 | expect(indexResponse?.status(), '/parties/ should answer 200').toBe(200); 60 | await expect(page.locator('h1')).toContainText(/Parties/i); 61 | 62 | // Wait for GraphQL browseEntities to populate results 63 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 64 | 65 | const links = await page.locator('.entity-search-result').all(); 66 | expect(links.length).toBeGreaterThan(0); 67 | 68 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 69 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 70 | 71 | for (const href of randomLinks) { 72 | const entityResponse = await page.goto(toRelativePath(href)); 73 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 74 | await expect(page.locator('h1')).toBeVisible(); 75 | } 76 | }); 77 | 78 | test('offices section - index and random pages', async ({ page }) => { 79 | const indexResponse = await page.goto('/offices/'); 80 | expect(indexResponse?.status(), '/offices/ should answer 200').toBe(200); 81 | await expect(page.locator('h1')).toContainText(/Offices/i); 82 | 83 | // Wait for GraphQL browseEntities to populate results 84 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 85 | 86 | const links = await page.locator('.entity-search-result').all(); 87 | expect(links.length).toBeGreaterThan(0); 88 | 89 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 90 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 91 | 92 | for (const href of randomLinks) { 93 | const entityResponse = await page.goto(toRelativePath(href)); 94 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 95 | await expect(page.locator('h1')).toBeVisible(); 96 | } 97 | }); 98 | 99 | test('districts section - index and random pages', async ({ page }) => { 100 | const indexResponse = await page.goto('/districts/'); 101 | expect(indexResponse?.status(), '/districts/ should answer 200').toBe(200); 102 | await expect(page.locator('h1')).toContainText(/Districts/i); 103 | 104 | // List view is now default — EntityIndex browses all districts without requiring state selection 105 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 106 | 107 | // State selector is populated from a static list (no GraphQL wait required) 108 | const stateSelect = page.locator('#district-state-select'); 109 | await expect(stateSelect).toBeVisible(); 110 | await stateSelect.selectOption('CA'); 111 | 112 | // Wait for state-filtered results then collect links 113 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 114 | const links = await page.locator('.entity-search-result').all(); 115 | expect(links.length).toBeGreaterThan(0); 116 | ```