test(components): restore web and html-reporter component tests

[pavelfeldman]

Summary

• Restores the component tests deleted in chore: delete component tests for web and html-reporter #38187 (chip, headerView, testCaseView, expandable, splitView, codeMirrorWrapper, imageDiffView) using the built-in mount fixture and the story-gallery setup from the component-testing skill.
• Stories live next to the components; each package hosts a playwright/gallery page served by Vite (html-reporter reuses its dev server, packages/web gets a minimal standalone config). test-html-reporter / test-web npm scripts and the Web Components CI job restored.
• Callback props are asserted with expect.fn() mocks, adding coverage the old suite never had: CodeMirrorWrapper.onChange (with read-only negative), Expandable.expandOnTitleClick (both branches), and a Chip.body render prop served synchronously via mockReturnValue().

Depends on #41884.

[github-actions]

Test results for "MCP"

2 failed
❌ [chromium] › mcp/http.spec.ts:104 › http transport browser lifecycle (isolated) @mcp-ubuntu-latest-chromium
❌ [firefox] › mcp/annotate.spec.ts:496 › should disengage annotate mode when --annotate client disconnects @mcp-macos-latest-firefox

7758 passed, 1249 skipped

---

Merge workflow run.

[github-actions]

🟢 CI is clear — both failures are pre-existing MCP flakes

Hi, I'm the Playwright bot and I took a first look at the CI failures. Neither of the two failing tests is caused by this PR — both are long-standing flakes that fail across many unrelated PRs, and this PR touches no MCP code.

Details

This PR restores component tests and adds expect.fn() mock functions (serializers, matchers, html-reporter/web stories). The only reported failures are two MCP tests, and the MCP transport/annotate flows don't exercise any of the changed code paths.

Pre-existing flake / infra

• [chromium] › mcp/http.spec.ts:104 › http transport browser lifecycle (isolated) — flake. In the aggregated CI DB this test fails on every engine across 133 distinct PRs: chromium 3/324, webkit 2/327, firefox 1/320, msedge 1/83. Broad, cross-PR, engine-agnostic — unrelated to this change.

• [firefox] › mcp/annotate.spec.ts:496 › should disengage annotate mode when --annotate client disconnects — flake, and a noisy one: webkit 11/327, firefox 10/320, chrome 7/326, chromium 4/324, again spread over 133 PRs. Fails well beyond this PR's SHA.

Nothing here reaches the diff — safe to rerun.

_{Triaged by the Playwright bot - agent run}

[github-actions]

Test results for "tests 1"

2 failed
❌ [chromium-page] › page/page-evaluate-callback.spec.ts:215 › should record calls to a mock function created with expect.fn() @frozen-time-library-chromium-linux
❌ [webkit-page] › page/page-leaks.spec.ts:164 › waitFor should not leak @webkit-ubuntu-22.04-node20

6 flaky

⚠️ [chromium-library] › library/video.spec.ts:495 › screencast › should capture static page in persistent context @smoke `@frozen-time-library-chromium-linux`
⚠️ [chromium-library] › library/video.spec.ts:736 › screencast › should work with video+trace `@frozen-time-library-chromium-linux`
⚠️ [chromium-library] › library/chromium/chromium.spec.ts:211 › should intercept service worker requests (main and within) `@chromium-ubuntu-22.04-node24`
⚠️ [chromium-library] › library/video.spec.ts:736 › screencast › should work with video+trace `@chromium-ubuntu-22.04-node22`
⚠️ [firefox-page] › page/page-event-request.spec.ts:181 › should return response body when Cross-Origin-Opener-Policy is set `@firefox-ubuntu-22.04-node20`
⚠️ [firefox-page] › page/page-goto.spec.ts:81 › should work with Cross-Origin-Opener-Policy `@firefox-ubuntu-22.04-node20`

50221 passed, 1189 skipped

---

Merge workflow run.

[github-actions]

🔴 One failure is caused by this PR — a new expect.fn() test breaks under a frozen clock

Hi, I'm the Playwright bot and I took a first look at the CI failures.

page-evaluate-callback.spec.ts:215 › should record calls to a mock function created with expect.fn() — the test this PR adds — fails on frozen-time-library-chromium-linux because it relies on setTimeout(() => cb('later'), 50) firing, and under the frozen clock that timer never runs. The other three failures are pre-existing flakes with no path to the diff.

Details

This PR adds expect.fn() mock functions and restores component tests. One of the new tests hits a frozen-clock CI project; the rest of the failures are unrelated MCP / leak flakes.

Caused by this PR

• [chromium-page] › page/page-evaluate-callback.spec.ts:215 › should record calls to a mock function created with expect.fn() — a test this PR adds. It schedules the second call with setTimeout(() => cb('later'), 50) and then asserts toHaveBeenCalledWith('later') / toHaveBeenCalledTimes(2). On the frozen-time-library-chromium-linux bot (PW_CLOCK=frozen, clock: 'clock-frozen') there's "no way to inject real setTimeout" — the same reason capabilities.spec.ts:448 skips under frozen time — so the timer never fires and the two-call assertions fail. Gate it like the other clock-sensitive tests, e.g. it.skip(process.env.PW_CLOCK === 'frozen'), or drive the second call without a real timer.

Pre-existing flake / infra

• [webkit-page] › page/page-leaks.spec.ts:164 › waitFor should not leak — flake. In the aggregated CI DB this fails 2 of 435 webkit-page runs across 126 PRs and passes 433; it's green on every other engine (firefox/chromium/electron/android 0 failures). Webkit-only, unrelated to the serializer/matcher/component changes here.

• [chromium] › mcp/http.spec.ts:104 › http transport browser lifecycle (isolated) and [firefox] › mcp/annotate.spec.ts:496 › should disengage annotate mode when --annotate client disconnects — both long-standing MCP flakes that fail across ~133 unrelated PRs on every engine. This PR touches no MCP code.

Only the first one needs a fix; the rest are safe to rerun.

_{Triaged by the Playwright bot - agent run}