# 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 >> districts section - index and random pages - Location: tests/ui/entities.spec.ts:99:7 # Error details ``` Error: page.goto: net::ERR_CONNECTION_REFUSED at http://10.1.105.22/districts/ Call log: - navigating to "http://10.1.105.22/districts/", 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/'); 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/'); | ^ Error: page.goto: net::ERR_CONNECTION_REFUSED at http://10.1.105.22/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 | 117 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 118 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 119 | 120 | for (const href of randomLinks) { 121 | const entityResponse = await page.goto(toRelativePath(href)); 122 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 123 | await expect(page.locator('h1')).toBeVisible(); 124 | } 125 | 126 | // District map (Congressional by default): navigate back and explicitly click the map toggle 127 | await page.goto('/districts/'); 128 | await page.locator('.toggle-btn[data-view="map"]').click(); 129 | await expect(page.locator('#map.leaflet-container')).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 130 | await expect(page.locator('#map .leaflet-interactive').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 131 | const shapes = await page.locator('#map .leaflet-interactive').all(); 132 | expect(shapes.length).toBeGreaterThan(0); 133 | }); 134 | 135 | test('states section - index and random pages', async ({ page }) => { 136 | const indexResponse = await page.goto('/states/'); 137 | expect(indexResponse?.status(), '/states/ should answer 200').toBe(200); 138 | await expect(page.locator('h1')).toContainText(/States/i); 139 | 140 | // Map view is default — verify Leaflet map renders with GeoJSON state shapes 141 | await expect(page.locator('#map.leaflet-container')).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 142 | await expect(page.locator('#map .leaflet-interactive').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 143 | const shapes = await page.locator('#map .leaflet-interactive').all(); 144 | expect(shapes.length).toBeGreaterThan(0); 145 | 146 | // Switch to Grid view to test state chips and detail navigation 147 | await page.locator('.toggle-btn[data-view="grid"]').click(); 148 | 149 | await expect(page.locator('.state-chip').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 150 | 151 | const links = await page.locator('.state-chip').all(); 152 | expect(links.length).toBeGreaterThan(0); 153 | 154 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 155 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 156 | 157 | for (const href of randomLinks) { 158 | const entityResponse = await page.goto(toRelativePath(href)); 159 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 160 | await expect(page.locator('h1')).toBeVisible(); 161 | } 162 | }); 163 | 164 | test('elections section - index and random pages', async ({ page }) => { 165 | const indexResponse = await page.goto('/elections/'); 166 | expect(indexResponse?.status(), '/elections/ should answer 200').toBe(200); 167 | await expect(page.locator('h1')).toContainText(/Election/i); 168 | 169 | // Wait for GraphQL browseEntities to populate results 170 | await expect(page.locator('.entity-search-result').first()).toBeVisible({ timeout: DATA_LOAD_TIMEOUT }); 171 | 172 | const links = await page.locator('.entity-search-result').all(); 173 | expect(links.length).toBeGreaterThan(0); 174 | 175 | const hrefs = await Promise.all(links.slice(0, 20).map(l => l.getAttribute('href'))); 176 | const randomLinks = getRandomItems(hrefs.filter(Boolean) as string[], 3); 177 | 178 | for (const href of randomLinks) { 179 | const entityResponse = await page.goto(toRelativePath(href)); 180 | expect(entityResponse?.status(), `${toRelativePath(href)} should answer 200`).toBe(200); 181 | await expect(page.locator('h1')).toBeVisible(); 182 | } 183 | }); 184 | }); 185 | 186 | test.describe('office profile - dynamic candidates', () => { 187 | // President of the United States office page 188 | const PRESIDENT_PATH = '/offices/684f6e2d-7105-932b-8b7f-94016580f727/'; 189 | 190 | test('office profile loads candidates filtered to office', async ({ page }) => { 191 | // Intercept the browseEntities GraphQL request to verify filter is applied 192 | const responsePromise = page.waitForResponse(resp => { 193 | if (!resp.url().includes('/api/graphql')) return false; 194 | if (resp.request().method() !== 'POST') return false; 195 | const body = resp.request().postData() || ''; 196 | return body.includes('browseEntities'); 197 | }, { timeout: DATA_LOAD_TIMEOUT }); 198 | 199 | await page.goto(PRESIDENT_PATH); 200 | const response = await responsePromise; ```