Add Playwright e2e coverage for the webview editors - #102
Conversation
2:
3:Adds a browser-level test tier that runs the real webview bundles in real
4:Chromium against the real host code, with only `vscode` itself faked. 56 specs
5:cover the objmod editor (browse/search/field filters/tooltip editor/layout) and
6:the editable .w3i and .wpm editors, including full edit -> undo/redo -> save ->
7:bytes-on-disk round-trips.
8:
9:The harness mounts the actual CustomEditorProvider on a fake panel, so
10:openCustomDocument, resolveCustomEditor, buildHtml, the message handler, the
11:edit stack and saveCustomDocument are the shipping code paths rather than
12:reimplementations. The page is served over http with webview.cspSource pointed
13:at that origin, so the shipped CSP has to genuinely admit what the page loads.
14:
15:tsLoader reports __dirname as <root>/dist for anything under src/, matching what
16:webpack emits; that is what makes resources/wc3-knowledge-base.json resolve, so
17:field rows are available without a compiler or Warcraft III install.
18:
19:Also ports the three local-only CDP scripts to Playwright. connectOverCDP plus a
20:frame search replaces the hand-rolled DevTools WebSocket client, target tracking
21:and execution-context bookkeeping; the assertions are kept. Two latent bugs in
22:that path surfaced while validating the port: a .w3a passed on the command line
23:opened in the text editor because the extension host had not registered its
24:custom editors yet (now fixed by pinning workbench.editorAssociations in the
25:temp profile), and bring-to-foreground.ps1 was invoked with the wrong parameter
26:name, so Ctrl+C silently no-opped and Ctrl+V pasted stale clipboard content.
27:
28:Fixes a real bug the new suite caught: `.dirty-badge { display: inline-block }`
29:outranks the user-agent [hidden] rule, so the .w3i editor showed "unsaved" on
30:clean documents.
31:
32:Includes the saved custom-colour palette for the tooltip editor (persisted in
33:globalState, seeded through the initial payload) and live "used colours"
34:swatches that refresh as the text changes, both covered by the new tooltip specs.
35:
36:The e2e tier is not wired into build.yml: that job substitutes .ci/mocks/casc-ts,
37:whose parsers all throw, and these tests parse and re-serialize real binary
38:fixtures. `npm test` is unchanged and still passes under the CI mocks.
39:
41:
4afa4dc to
6c80147
Compare
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 4afa4dcb70
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| gap: 4px; | ||
| padding-top: 2px; |
There was a problem hiding this comment.
When the user switches the object editor to cozy density, the new saved-colour section retains these hard-coded compact gap and padding-top values, making this part of the toolbar inconsistent with the rest of the selected density. Define both values in the existing :root/body.density-cozy variable pair and reference those variables here.
AGENTS.md reference: AGENTS.md:L79-L79
Useful? React with 👍 / 👎.
| "watch-web": "webpack --watch", | ||
| "test": "npm run test:fuzzy && npm run test:image-decoders && npm run test:diagnostics && npm run test:webview", | ||
| "test:e2e": "npm run compile-web && playwright test --project=webview", | ||
| "test:e2e:ui": "playwright test --project=webview --ui", |
There was a problem hiding this comment.
On a fresh checkout or after cleaning the ignored dist/ directory, npm run test:e2e:ui opens Playwright without building dist/webview/objModEditorWebview.js, so the object-editor tests immediately fail with the harness's missing-bundle error instead of running interactively. Prefix this script with npm run compile-web, as the non-UI e2e command already does.
AGENTS.md reference: AGENTS.md:L103-L109
Useful? React with 👍 / 👎.
…e UI mode The saved-colour group in the tooltip colour popover kept hard-coded compact `gap`/`padding-top`, so it stayed on the compact scale while the rest of the editor switched to cozy. Both numbers now live in the :root / body.density-cozy variable pair as --palette-group-gap / --palette-group-pad, per AGENTS.md. Covered by a new spec that measures the resolved spacing in both densities; verified it fails against the hard-coded values it replaces. `test:e2e:ui` now runs compile-web first, like `test:e2e` already did — on a fresh checkout it otherwise opened Playwright's UI against a missing dist/webview bundle and every objmod test failed on the harness guard.
|
@codex review |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 635b24c156
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const frame = await session.waitForFrame(() => !!window.__wurstModelThumbDebug, 'the objmod webview'); | ||
| await openAssetBrowser(frame); | ||
|
|
||
| const { state, initialKeys, violations } = await drainVisibleThumbnails(frame, 90000); |
There was a problem hiding this comment.
When local WC3 data takes more than 90 seconds to resolve or render, increasing WURST_OBJMOD_E2E_TIMEOUT_MS only extends VS Code startup and frame discovery because this drain still has a fixed 90-second deadline. The migrated harness previously applied that setting throughout the run, so both thumbnail tests now time out despite the user's override; pass the configured timeout into drainVisibleThumbnails instead.
Useful? React with 👍 / 👎.
1 participant
Adds a browser-level test tier so the webview editors have real regression cover, and ports the three local-only CDP scripts onto the same framework.
New tier:
npm run test:e2e— 56 specs, ~39sRuns the real webview bundles in real Chromium against the real host code, with only
vscodeitself faked. No VS Code launch, no Warcraft III install.objmod-browse(8)objmod-fields(11)objmod-tooltip-editor(11)globalState, Escape revert, colour markup written on saveobjmod-layout(8)objModTooltipWidthclamping, no horizontal page scroll at four widthsw3i-editor(9)wpm-editor(9)Design notes:
CustomEditorProvideron a fake panel, soopenCustomDocument→resolveCustomEditor→buildHtml→ message handler → edit stack →saveCustomDocumentare the shipping paths, not reimplementations.webview.cspSourcepointed at that origin, so the shipped CSP has to genuinely admit what the page loads — a CSP regression fails the suite.tsLoaderreports__dirnameas<root>/distfor anything undersrc/, matching webpack's output. That is what makesresources/wc3-knowledge-base.jsonresolve, so field rows exist without a compiler or WC3 install.Bug found by the new suite
.dirty-badge { display: inline-block }outranks the user-agent[hidden]rule, so the.w3ieditor showed "● unsaved" on clean documents. Fixed, and every otherhiddenelement across the viewers was audited — this was the only one.Ported local tier:
npm run test:e2e:localconnectOverCDP+ a frame search replaces ~115KB of hand-rolled DevTools WebSocket, target-tracking and execution-context plumbing; assertions kept. The three old scripts are deleted.Two latent bugs in that path surfaced while validating the port:
.w3apassed on the command line opened in the text editor, because on a cold--extensionDevelopmentPathstart the extension host has not registered its custom editors yet — so no webview was ever created. Fixed by pinningworkbench.editorAssociationsin the temp profile.bring-to-foreground.ps1was invoked with the wrong parameter name, so the VS Code window never took focus, Ctrl+C silently no-opped and Ctrl+V pasted stale clipboard content.Verified against real VS Code: clipboard suite 4/4, CodeLens asset browser passing, thumbnail DOM-order/scheduling passing. The thumbnail render/budget assertions fail locally (stock doodads come back
not-found); the pre-port script restored from git fails identically, so that is environmental rather than a port regression.Also included
globalState, seeded through the initial payload) and live "used colours" swatches that refresh as the text changes — both covered by the new tooltip specs.scripts/test-webview.jsnow uses the sharede2e/harness/tsLoader.jsinstead of its two local copies.CI
Deliberately not wired into
build.yml. That job substitutes.ci/mocks/casc-ts, whose parsers all throw, and these tests parse and re-serialize real binary fixtures. Running e2e in CI would need those mocks to gain realparseObjMod/serializeObjMod/parseW3i/serializeW3i/parseWpm/serializeWpmimplementations, or a job with access to the real siblings.npm testis unchanged and still passes under the CI mocks.npm test,npx tsc -p . --noEmitandnpm run lintare all clean (one pre-existing webpack warning).