# 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/entity-graph.spec.ts >> entity-graph pop-over >> opens and draws on /committees/a75a9110-f1db-a945-39a8-7503ed3c04da/
- Location: tests/ui/entity-graph.spec.ts:62:9

# Error details

```
Test timeout of 30000ms exceeded.
```

```
Error: expect(locator).toBeVisible() failed

Locator: locator('dialog.eg-dialog').locator('.eg-canvas canvas').first()
Expected: visible
Error: element(s) not found

Call log:
  - Expect "toBeVisible" locator('dialog.eg-dialog').locator('.eg-canvas canvas').first() with timeout 60000ms
  - waiting for locator('dialog.eg-dialog').locator('.eg-canvas canvas').first()
  - Test timeout of 30000ms exceeded.

```

```yaml
- banner:
  - heading "DNC SERVICES CORP / DEMOCRATIC NATIONAL COMMITTEE" [level=1]
  - paragraph: Party - Qualified
  - paragraph: "FEC ID: C00010603"
  - button "Graph"
- heading "Overview" [level=2]
- term: Committee Type
- definition: Party - Qualified
- term: Designation
- definition: U
- term: Party Affiliation
- definition:
  - link "Democratic Party":
    - /url: https://us.elect.info/parties/democratic/
- term: Treasurer
- definition: MCGREGOR, VIRGINIA
- term: Location
- definition:
  - text: WASHINGTON,
  - link "District of Columbia":
    - /url: https://us.elect.info/states/district-of-columbia/
  - text: "20003"
- term: Active Cycles
- definition:
  - link "2026":
    - /url: https://us.elect.info/elections/2026/
  - text: ","
  - link "2024":
    - /url: https://us.elect.info/elections/2024/
  - text: ","
  - link "2022":
    - /url: https://us.elect.info/elections/2022/
  - text: ","
  - link "2020":
    - /url: https://us.elect.info/elections/2020/
  - text: ","
  - link "2018":
    - /url: https://us.elect.info/elections/2018/
  - text: ","
  - link "2016":
    - /url: https://us.elect.info/elections/2016/
  - text: ","
  - link "2014":
    - /url: https://us.elect.info/elections/2014/
  - text: ","
  - link "2012":
    - /url: https://us.elect.info/elections/2012/
  - text: ","
  - link "2010":
    - /url: https://us.elect.info/elections/2010/
  - text: ","
  - link "2008":
    - /url: https://us.elect.info/elections/2008/
  - text: ","
  - link "2006":
    - /url: https://us.elect.info/elections/2006/
  - text: ","
  - link "2004":
    - /url: https://us.elect.info/elections/2004/
  - text: ","
  - link "2002":
    - /url: https://us.elect.info/elections/2002/
  - text: ","
  - link "2000":
    - /url: https://us.elect.info/elections/2000/
  - text: ","
  - link "1998":
    - /url: https://us.elect.info/elections/1998/
  - text: ","
  - link "1996":
    - /url: https://us.elect.info/elections/1996/
  - text: ","
  - link "1994":
    - /url: https://us.elect.info/elections/1994/
  - text: ","
  - link "1992":
    - /url: https://us.elect.info/elections/1992/
  - text: ","
  - link "1990":
    - /url: https://us.elect.info/elections/1990/
  - text: ","
  - link "1988":
    - /url: https://us.elect.info/elections/1988/
  - text: ","
  - link "1986":
    - /url: https://us.elect.info/elections/1986/
  - text: ","
  - link "1984":
    - /url: https://us.elect.info/elections/1984/
  - text: ","
  - link "1982":
    - /url: https://us.elect.info/elections/1982/
  - text: ","
  - link "1980":
    - /url: https://us.elect.info/elections/1980/
- term: Party Affinity
- definition:
  - link "Democratic Party":
    - /url: https://us.elect.info/parties/democratic/
  - text: ": 81%"
  - link "Republican Party":
    - /url: https://us.elect.info/parties/republican/
  - text: ": 19%"
- heading "Financial Summary" [level=2]
- term: Total Receipts
- definition:
  - strong: $4505.2M
- term: Total Disbursements
- definition: $4489.7M
- heading "Connected Organizations" [level=2]
- term: Connected Organization
- definition: DEMOCRATIC GRASSROOTS VICTORY FUND
- heading "Candidates Funded" [level=2]
- group "View":
  - button "Sankey view" [pressed]
  - button "Table view"
- paragraph: "Candidates receiving contributions from this committee:"
- img "Candidates Funded as a Sankey diagram. Switch to table view for the list."
- paragraph: Showing top 20 of 439
- heading "Independent Expenditures For" [level=2]
- group "View":
  - button "Sankey view" [pressed]
  - button "Table view"
- paragraph: "Candidates this committee spent for, independently of their campaigns (not contributions to the campaigns):"
- img "Independent Expenditures For as a Sankey diagram. Switch to table view for the list."
- paragraph: Showing all 6
- heading "Independent Expenditures Against" [level=2]
- group "View":
  - button "Sankey view" [pressed]
  - button "Table view"
- paragraph: "Candidates this committee spent against, independently of their campaigns:"
- img "Independent Expenditures Against as a Sankey diagram. Switch to table view for the list."
- paragraph: Showing all 5
- heading "Committees Funded" [level=2]
- group "View":
  - button "Sankey view" [pressed]
  - button "Table view"
- paragraph: "Committees receiving transfers from this committee:"
- img "Committees Funded as a Sankey diagram. Switch to table view for the list."
- paragraph: Showing top 20 of 1,646
- heading "Funded By" [level=2]
- group "View":
  - button "Sankey view" [pressed]
  - button "Table view"
- paragraph: "Committees that have transferred funds to this committee:"
- img "Funded By as a Sankey diagram. Switch to table view for the list."
- paragraph: Showing top 20 of 2,261
- contentinfo:
  - paragraph:
    - link "elect.info":
      - /url: https://us.elect.info/
    - text: "| Data from"
    - link "Federal Election Commission":
      - /url: https://us.elect.info/datasources/fec_bulk/
    - text: "| Generated 2026-10-09"
- 'dialog "DNC SERVICES CORP / DEMOCRATIC NATIONAL COMMITTEE: graph of connected entities"':
  - heading "DNC SERVICES CORP / DEMOCRATIC NATIONAL COMMITTEE — connected entities" [level=2]
  - button "Fit"
  - button "Close graph": Close
  - img "Network graph of DNC SERVICES CORP / DEMOCRATIC NATIONAL COMMITTEE and its most significant connections": No connected entities to show.
  - text: Committee Candidate Vendor Party State / place Office Cycle Committees and candidates are tinted by party
```

# Test source

```ts
  1  | import { test, expect } from '@playwright/test';
  2  | 
  3  | // Entity graph pop-over (electinfo/sites#249). nginx injects /js/entity-graph.js
  4  | // next to money-flow.js on Candidate and Committee detail pages. The script
  5  | // adds a "Graph" button to the header; opening it fetches entityGraph from
  6  | // /api/graphql, loads /js/entity-graph-view.js (Cytoscape) and draws the node
  7  | // and its most significant neighbours in a modal dialog.
  8  | //
  9  | // Same targets and pages as money-flow.spec.ts.
  10 | 
  11 | const SCRIPT = '<script src="/js/entity-graph.js" defer></script>';
  12 | const DNC = '/committees/a75a9110-f1db-a945-39a8-7503ed3c04da/'; // C00010603
  13 | const HARRIS = '/candidates/a8897257-430c-2bf3-4498-349021b09ca3/'; // P00009423
  14 | const OTHER_PAGES = [
  15 |   '/states/032f8d61-f554-f435-2a6d-50b3c8cc01d7/', // AK
  16 |   '/elections/2024/',
  17 |   '/offices/president/',
  18 | ];
  19 | 
  20 | test.describe('entity-graph script injection', () => {
  21 |   for (const path of [DNC, HARRIS]) {
  22 |     test(`injected once on ${path}`, async ({ request }) => {
  23 |       const res = await request.get(path);
  24 |       expect(res.status()).toBe(200);
  25 |       expect((await res.text()).split(SCRIPT).length - 1).toBe(1);
  26 |     });
  27 |   }
  28 | 
  29 |   for (const path of OTHER_PAGES) {
  30 |     test(`not injected on ${path}`, async ({ request }) => {
  31 |       const res = await request.get(path);
  32 |       expect(res.status()).toBe(200);
  33 |       expect(await res.text()).not.toContain('entity-graph.js');
  34 |     });
  35 |   }
  36 | });
  37 | 
  38 | test.describe('entityGraph API', () => {
  39 |   for (const fecId of ['C00010603', 'P00009423']) {
  40 |     test(`${fecId}: neighbours without individuals, money edges with amounts`, async ({ request }) => {
  41 |       const res = await request.post('/api/graphql', {
  42 |         data: {
  43 |           query: 'query($f: String!) { entityGraph(fecId: $f) { focalId nodes { id label labels focal displayName } edges { type amount } } }',
  44 |           variables: { f: fecId },
  45 |         },
  46 |         timeout: 60000,
  47 |       });
  48 |       expect(res.status()).toBe(200);
  49 |       const g = (await res.json())?.data?.entityGraph;
  50 |       expect(g).toBeTruthy();
  51 |       expect(g.nodes.filter((n: { focal: boolean }) => n.focal)).toHaveLength(1);
  52 |       expect(g.nodes.length).toBeGreaterThan(5);
  53 |       expect(g.nodes.some((n: { labels: string[] }) => n.labels.includes('Individual'))).toBe(false);
  54 |       expect(g.nodes.every((n: { displayName: string }) => !!n.displayName)).toBe(true);
  55 |       expect(g.edges.some((e: { amount: number | null }) => e.amount != null && e.amount > 0)).toBe(true);
  56 |     });
  57 |   }
  58 | });
  59 | 
  60 | test.describe('entity-graph pop-over', () => {
  61 |   for (const path of [DNC, HARRIS]) {
  62 |     test(`opens and draws on ${path}`, async ({ page }) => {
  63 |       const errors: string[] = [];
  64 |       page.on('pageerror', (e) => errors.push(String(e)));
  65 |       await page.goto(path);
  66 |       const button = page.locator('button.eg-open');
  67 |       await expect(button).toHaveCount(1, { timeout: 15000 });
  68 |       await button.click();
  69 |       const dialog = page.locator('dialog.eg-dialog');
  70 |       await expect(dialog).toBeVisible();
> 71 |       await expect(dialog.locator('.eg-canvas canvas').first()).toBeVisible({ timeout: 60000 });
     |                                                                 ^ Error: expect(locator).toBeVisible() failed
  72 |       await page.keyboard.press('Escape');
  73 |       await expect(dialog).toBeHidden();
  74 |       expect(errors).toEqual([]);
  75 |     });
  76 |   }
  77 | });
  78 | 
```