# 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/county-filters.spec.ts >> blocks county filter: GEOID option values list the county's blocks - Location: tests/ui/county-filters.spec.ts:39:7 # Error details ``` Test timeout of 120000ms exceeded. ``` ``` Error: locator.click: Test timeout of 120000ms exceeded. Call log: - waiting for locator('.toggle-btn[data-view="list"]') ``` # Page snapshot ```yaml - generic [ref=e1]: - generic: - region "Status messages" - generic [active] [ref=e7]: - text: ⋯ - banner - main "Authentication form" [ref=e8]: - generic [ref=e9]: elect.info - generic [ref=e10]: - heading "Sign in to elect.info" [level=1] [ref=e12] - generic [ref=e14]: - paragraph [ref=e15]: Login to continue to us.elect.info. - generic [ref=e16]: - generic [ref=e17]: Email - textbox "Email" [ref=e19] - generic [ref=e20]: - generic [ref=e21]: Password - textbox "Password" [ref=e26]: - /placeholder: Please enter your password - button "Log in" [ref=e28] [cursor=pointer] - generic [ref=e29]: - group "Login sources" [ref=e30]: - text: or - button "Continue with Google" [ref=e32] [cursor=pointer] - group "Additional actions" [ref=e33]: - generic [ref=e35]: - text: Need an account? - link "Sign up." [ref=e36] [cursor=pointer]: - /url: /if/flow/elect-info-enrollment/?client_id=KI5Be8scLVeZN7n5zY8p5s8VbpyradOSKQvo9T2c&redirect_uri=https%3A%2F%2Fus.elect.info%2Foutpost.goauthentik.io%2Fcallback%3FX-authentik-auth-callback%3Dtrue&response_type=code&scope=openid+entitlements+ak_proxy+email+profile&state=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnb2F1dGhlbnRpay5pby9vdXRwb3N0L0tJNUJlOHNjTFZlWk43bjV6WThwNXM4VmJweXJhZE9TS1F2bzlUMmMiLCJzaWQiOiJXQ1lMN0MzTkJYTEpVQlJCSU9LUFhZUTdMUVhJNTVSVFdPSE5GTjM0UkxONzJUNTRRUVNBIiwic3RhdGUiOiJzSDhFLUVITmNPc0NibENMTVdadWh2SzJXVjlqR192WldEZ2hUS0RmOTQ0IiwicmVkaXJlY3QiOiJodHRwczovL3VzLmVsZWN0LmluZm8vYmxvY2tzLyJ9.rVP6TxBKlKC4HX7qNg-AlTM-fRG9rJTuKeDzDuwO444&next=%2Fapplication%2Fo%2Fauthorize%2F%3Fclient_id%3DKI5Be8scLVeZN7n5zY8p5s8VbpyradOSKQvo9T2c%26redirect_uri%3Dhttps%253A%252F%252Fus.elect.info%252Foutpost.goauthentik.io%252Fcallback%253FX-authentik-auth-callback%253Dtrue%26response_type%3Dcode%26scope%3Dopenid%2Bentitlements%2Bak_proxy%2Bemail%2Bprofile%26state%3DeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnb2F1dGhlbnRpay5pby9vdXRwb3N0L0tJNUJlOHNjTFZlWk43bjV6WThwNXM4VmJweXJhZE9TS1F2bzlUMmMiLCJzaWQiOiJXQ1lMN0MzTkJYTEpVQlJCSU9LUFhZUTdMUVhJNTVSVFdPSE5GTjM0UkxONzJUNTRRUVNBIiwic3RhdGUiOiJzSDhFLUVITmNPc0NibENMTVdadWh2SzJXVjlqR192WldEZ2hUS0RmOTQ0IiwicmVkaXJlY3QiOiJodHRwczovL3VzLmVsZWN0LmluZm8vYmxvY2tzLyJ9.rVP6TxBKlKC4HX7qNg-AlTM-fRG9rJTuKeDzDuwO444 - link "Forgot username or password?" [ref=e38] [cursor=pointer]: - /url: /if/flow/elect-info-recovery/?client_id=KI5Be8scLVeZN7n5zY8p5s8VbpyradOSKQvo9T2c&redirect_uri=https%3A%2F%2Fus.elect.info%2Foutpost.goauthentik.io%2Fcallback%3FX-authentik-auth-callback%3Dtrue&response_type=code&scope=openid+entitlements+ak_proxy+email+profile&state=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnb2F1dGhlbnRpay5pby9vdXRwb3N0L0tJNUJlOHNjTFZlWk43bjV6WThwNXM4VmJweXJhZE9TS1F2bzlUMmMiLCJzaWQiOiJXQ1lMN0MzTkJYTEpVQlJCSU9LUFhZUTdMUVhJNTVSVFdPSE5GTjM0UkxONzJUNTRRUVNBIiwic3RhdGUiOiJzSDhFLUVITmNPc0NibENMTVdadWh2SzJXVjlqR192WldEZ2hUS0RmOTQ0IiwicmVkaXJlY3QiOiJodHRwczovL3VzLmVsZWN0LmluZm8vYmxvY2tzLyJ9.rVP6TxBKlKC4HX7qNg-AlTM-fRG9rJTuKeDzDuwO444&next=%2Fapplication%2Fo%2Fauthorize%2F%3Fclient_id%3DKI5Be8scLVeZN7n5zY8p5s8VbpyradOSKQvo9T2c%26redirect_uri%3Dhttps%253A%252F%252Fus.elect.info%252Foutpost.goauthentik.io%252Fcallback%253FX-authentik-auth-callback%253Dtrue%26response_type%3Dcode%26scope%3Dopenid%2Bentitlements%2Bak_proxy%2Bemail%2Bprofile%26state%3DeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnb2F1dGhlbnRpay5pby9vdXRwb3N0L0tJNUJlOHNjTFZlWk43bjV6WThwNXM4VmJweXJhZE9TS1F2bzlUMmMiLCJzaWQiOiJXQ1lMN0MzTkJYTEpVQlJCSU9LUFhZUTdMUVhJNTVSVFdPSE5GTjM0UkxONzJUNTRRUVNBIiwic3RhdGUiOiJzSDhFLUVITmNPc0NibENMTVdadWh2SzJXVjlqR192WldEZ2hUS0RmOTQ0IiwicmVkaXJlY3QiOiJodHRwczovL3VzLmVsZWN0LmluZm8vYmxvY2tzLyJ9.rVP6TxBKlKC4HX7qNg-AlTM-fRG9rJTuKeDzDuwO444 ``` # Test source ```ts 1 | import { test, expect, Page } from '@playwright/test'; 2 | 3 | /* 4 | * County dropdowns on the tract, block and precinct indexes (sites#162). 5 | * 6 | * Tract.county_fips, Block.geoid_county and Precinct.county_fips hold the 7 | * 5-digit county GEOID. After the graph rebuild County.id became a UUID, and 8 | * the dropdowns, which used it as the option value, matched nothing: the tracts 9 | * filter timed out and blocks/precincts silently listed no counties or no results 10 | * (preview run 858793). Each option value must be a GEOID, and picking a county 11 | * must list that county's entities. 12 | */ 13 | 14 | const DATA_LOAD_TIMEOUT = 15000; 15 | const TRAVIS = '48453'; // Travis County, TX: tracts, blocks and precincts all present 16 | 17 | const KINDS = [ 18 | { kind: 'tract', path: '/tracts/' }, 19 | { kind: 'block', path: '/blocks/' }, 20 | { kind: 'precinct', path: '/precincts/' }, 21 | ] as const; 22 | 23 | async function openListView(page: Page, kind: string, path: string) { 24 | const res = await page.goto(path); 25 | expect(res?.status(), `${path} should answer 200`).toBe(200); 26 | // The list view (and its *-index.js) loads when the toggle is activated > 27 | await page.locator('.toggle-btn[data-view="list"]').click(); | ^ Error: locator.click: Test timeout of 120000ms exceeded. 28 | await page.waitForFunction( 29 | sel => { 30 | const s = document.querySelector(sel) as HTMLSelectElement | null; 31 | return !!s && s.options.length > 1; 32 | }, 33 | `#${kind}-state-select`, 34 | { timeout: 45000 }, 35 | ); 36 | } 37 | 38 | for (const { kind, path } of KINDS) { 39 | test(`${kind}s county filter: GEOID option values list the county's ${kind}s`, async ({ page }) => { 40 | test.setTimeout(120000); 41 | await openListView(page, kind, path); 42 | 43 | await page.locator(`#${kind}-state-select`).selectOption('TX'); 44 | const county = page.locator(`#${kind}-county-select`); 45 | await expect(county, `${path} county dropdown should enable after picking TX`).toBeEnabled({ timeout: DATA_LOAD_TIMEOUT }); 46 | await page.waitForFunction( 47 | sel => { 48 | const s = document.querySelector(sel) as HTMLSelectElement | null; 49 | return !!s && s.options.length > 1; 50 | }, 51 | `#${kind}-county-select`, 52 | { timeout: DATA_LOAD_TIMEOUT }, 53 | ); 54 | 55 | // Every county option (after "All Counties") is a 5-digit GEOID, not a graph UUID 56 | const values = (await county.locator('option').evaluateAll(opts => opts.map(o => (o as HTMLOptionElement).value))) 57 | .filter(Boolean); 58 | const bad = values.filter(v => !/^\d{5}$/.test(v)); 59 | expect(bad, `${path} county option values must be 5-digit GEOIDs, got e.g. ${bad.slice(0, 3).join(', ')}`).toEqual([]); 60 | expect(values, `${path} should offer Travis County (${TRAVIS})`).toContain(TRAVIS); 61 | 62 | await county.selectOption(TRAVIS); 63 | await page.waitForSelector(`.${kind}-result, .${kind}-error`, { timeout: DATA_LOAD_TIMEOUT }); 64 | const errors = page.locator(`.${kind}-error`); 65 | const errorText = (await errors.count()) > 0 ? await errors.first().textContent() : null; 66 | expect(errorText, `${path} county ${TRAVIS} should not show an error`).toBeNull(); 67 | const count = await page.locator(`.${kind}-result`).count(); 68 | expect(count, `${path} county ${TRAVIS} should list ${kind}s`).toBeGreaterThan(0); 69 | }); 70 | } 71 | ```