[vishnuv688]

What & why

Part of #494. Stacked on #523.

A trace is untrusted input: whoever recorded it chose the DOM the player replays, and the hosted player invites opening traces from other people. The hosted player's CSP already stopped a replayed page running script, but show-trace and the live dashboard sent no CSP, and the replay applied later DOM updates without filtering them. This makes a replayed trace run no script in every mode, with three independent layers.

Type of change

• Bugfix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Polish (an improvement to an existing feature)
• Breaking change (existing behavior changes for users)
• Documentation
• Internal (build, CI, dependencies, tooling)

Packages touched

• shared (types and contracts)
• core (framework-agnostic capture/reporting)
• elements (published element/snapshot API — @wdio/elements)
• service (WebdriverIO adapter)
• nightwatch-devtools (Nightwatch adapter)
• selenium-devtools (Selenium adapter)
• selenium-devtools-py (Selenium Python adapter)
• backend (server)
• app (UI)
• script (page-injected runtime)
• trace (Trace mode)

Plus conformance (the hosted e2e check).

Capability matrix

• packages/conformance/src/features.ts updated, and tables regenerated with pnpm docs:capabilities, if this adds or changes user-facing behaviour

Not needed: no per-adapter capability changes.

Notes for reviewers

Layers

Layer	Change	Where it applies
Sandboxed replay frame	<iframe sandbox="allow-same-origin">: the app still writes the replayed DOM, nothing inside runs, and nested frames inherit the sandbox	every mode
Filtering	components/browser/replay-safety.ts drops <script>, on* attributes, srcdoc, http-equiv and javascript: URLs, on the first render and on every replayed mutation (previously only the first render dropped scripts and handlers)	every mode
One CSP	shared/player-csp.ts is the policy. The backend sends it on its HTML responses, with the live dashboard's WebSocket source taken from the Host header only when it is a plain host; vercel.json sends it for the hosted player, and a test holds the two equal	show-trace and live gain what hosted had

Replay crash found by the hostile trace: starting a replayed page puts a <base> first in its head, and the code spread head.props.children as an array. Preact stores one child as the child itself and none as undefined, so a page whose head had zero or one element crashed the replay (props.children is not iterable), and a document with no head lost its <base>. withBaseUrl in vnode-transform.ts reads both through toChildArray, with tests for an empty head, one child, several, and no head.

frame-ancestors 'none' now also applies to the local dashboard, so a website cannot frame localhost and lure clicks on Rerun. Nothing in the repo embeds the dashboard in a frame.

Testing

• pnpm install --frozen-lockfile, pnpm build, pnpm test (3526 passed) and pnpm lint are green; the built app carries the sandbox attribute.
• New tests: the filter (refused and kept cases), the transform dropping a nested <script>, javascript: and srcdoc, the CSP builder and Host handling, the backend header (a malformed Host reflects nothing, API responses carry no CSP), and vercel.json equal to the shared policy. Removing the script filter or the backend header makes them fail.
• The hosted e2e check (Check the hosted trace player end to end on every PR #518) now opens a hostile trace that tries three paths: a handler in the first render, a handler added by a later update and then triggered, and an added <script>. It fails unless the page was replayed, the frame is sandboxed, no <script> reached the frame, and nothing ran. This PR's hosted-player job is its first run.

Needs checking by eye (the sandbox changes how the replay frame runs, and the backend sends a CSP for the first time)

1. pnpm show-trace <zip>: the replay renders styled; scrolling, the element highlight and the A11y overlay work.
2. pnpm player:hosted: the same.
3. pnpm demo:wdio:mocha (live): the dashboard connects and updates, with no CSP error in the console.

Not in this PR: the remaining ways a trace touches the outside world are tracked: replay loading the recorded site's own stylesheets and images (#499), and redacting what a trace records (#503).

Screenshots / recordings

Not applicable: no visual change intended.

🤖 Generated with Claude Code