[LKPR-137] chore: E2E + visual regression test suite (Playwright) - #340
Merged
Merged
Conversation
- playwright.config.ts: Chromium 1440x900, base http://127.0.0.1:7777 - tests/shell.spec.ts: NavRail (7+Settings), active highlight, nav per item, TopBar breadcrumb per page, Command Palette open/nav/close - tests/memories.spec.ts: table loads, sort, row → drawer, edit mode - tests/sessions.spec.ts: timeline loads, session drawer open/close - tests/review.spec.ts: both tabs, bulk select + accept - tests/links.spec.ts: table, relationship drawer, delete confirm/cancel - tests/query.spec.ts: input renders, query runs, Enter key works - tests/home.spec.ts: health ring + activity section + stat tiles - tests/metrics.spec.ts: heatmap renders, tooltip on hover - tests/settings.spec.ts: 4 sections, unsaved indicator, save toast - tests/visual.spec.ts: per-page @visual screenshots, 0.1% pixel diff threshold - package.json: test:e2e, test:e2e:ui, test:visual, test:visual:update scripts - .gitignore: exclude package-lock.json, pnpm-lock.yaml, playwright reports
Contributor
Coverage report
The report is also available in the GitHub Actions job summary. |
Owner
|
@coderabbitai review using beat practices |
|
✅ Action performedReview finished.
|
|
Important Review skippedBot user detected. To trigger a single review, invoke the ⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughChangesPlaywright tooling and configuration were added for Dashboard Playwright coverage
Important Pre-merge checks failedPlease resolve all errors before merging. Addressing warnings is optional. ❌ Failed checks (1 error, 1 warning)
✅ Passed checks (4 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 10
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/dashboard_v2/playwright.config.ts`:
- Around line 18-22: Update the webServer command in the Playwright
configuration to build the application before running the preview server,
ensuring test:e2e uses current dist assets. Preserve the existing preview port,
URL, reuseExistingServer, and timeout settings.
- Around line 7-15: Move the 1440×900 viewport override from the global use
configuration into the chromium project after the Desktop Chrome device spread.
Update the webServer command to build the application before running vite
preview, preserving the existing preview startup behavior.
In `@src/dashboard_v2/tests/home.spec.ts`:
- Around line 20-25: Update the “stat tiles are present” test to assert the
existing statTiles locator directly instead of the health-card locator. Verify
the rendered .stat-link tile wrappers have the expected presence, such as
asserting their count or visibility, and remove the unused health-card
assertion.
In `@src/dashboard_v2/tests/memories.spec.ts`:
- Around line 27-32: Update the “pagination controls render” test to seed more
memories than one page, then use the existing pagination locator to assert the
controls are visible. Exercise the pagination control to move to another page
and verify the displayed page or memory rows change, replacing the current
table/empty-state-only assertion.
- Around line 55-59: Require drawer controls instead of conditionally skipping
workflows: in src/dashboard_v2/tests/memories.spec.ts lines 55-59, use an
editable fixture and require the edit action before asserting `#drawer-title`; in
src/dashboard_v2/tests/links.spec.ts lines 35-39 and 50-58, require “Delete
link” before testing confirmation and cancel behavior.
In `@src/dashboard_v2/tests/review.spec.ts`:
- Around line 27-35: Strengthen the workflow assertions in
src/dashboard_v2/tests/review.spec.ts:27-35 by clicking Accept after bulk
selection and verifying the selected suggestions reach their accepted state; in
src/dashboard_v2/tests/query.spec.ts:17-29, assert a result state or request
attributable to the submitted query; in
src/dashboard_v2/tests/settings.spec.ts:33-45, assert a save-specific toast or
that the unsaved state is cleared. Ensure each assertion proves the operation
completed rather than relying on an intermediate or pre-existing UI state.
In `@src/dashboard_v2/tests/shell.spec.ts`:
- Around line 64-66: Update the breadcrumb assertion in the parameterized shell
tests to target the locator rendered by TopBar.svelte, such as the existing
breadcrumb navigation or current-breadcrumb class, instead of the nonexistent
topbar-breadcrumb test ID. Keep the assertion verifying that p.label is
displayed for every route.
- Around line 39-40: In the navigation assertions of shell.spec.ts, replace the
loose RegExp URL expectation with an exact expected URL check derived from
item.href. Update the breadcrumb lookup from getByTestId('topbar-breadcrumb') to
the existing breadcrumb navigation/current-label element in TopBar.svelte.
Adjust the Meta+k shortcut assertion to use Meta on macOS and Ctrl on other
platforms, matching the application’s platform branch.
In `@src/dashboard_v2/tests/visual.spec.ts`:
- Around line 26-28: Replace the page.waitForLoadState('networkidle') and fixed
page.waitForTimeout(300) in the visual test setup with an application-ready
assertion using a route-specific locator or loaded-data condition. Keep the
existing toHaveScreenshot() flow, relying on its built-in stability and
animation handling rather than arbitrary timing.
- Line 25: Update the navigation flow around page.goto to capture its response
and verify it is successful before taking screenshots or updating snapshots.
Fail the visual test when navigation returns a non-OK response, preventing error
pages from becoming baselines.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: d9175ad0-6246-49fe-8565-5d8027bb4ec6
📒 Files selected for processing (13)
src/dashboard_v2/.gitignoresrc/dashboard_v2/package.jsonsrc/dashboard_v2/playwright.config.tssrc/dashboard_v2/tests/home.spec.tssrc/dashboard_v2/tests/links.spec.tssrc/dashboard_v2/tests/memories.spec.tssrc/dashboard_v2/tests/metrics.spec.tssrc/dashboard_v2/tests/query.spec.tssrc/dashboard_v2/tests/review.spec.tssrc/dashboard_v2/tests/sessions.spec.tssrc/dashboard_v2/tests/settings.spec.tssrc/dashboard_v2/tests/shell.spec.tssrc/dashboard_v2/tests/visual.spec.ts
Contributor
There was a problem hiding this comment.
Pull request overview
This PR (LKPR-137, closing #302) sets up the Playwright E2E and visual-regression test infrastructure for the SvelteKit Dashboard V2 frontend. It adds a Playwright config, npm scripts, a @playwright/test dev dependency, .gitignore entries, and 10 spec files covering shell/navigation, each route page, and per-page screenshot baselines.
Changes:
- Add
playwright.config.ts(Chromium, 1440×900,webServer: npm run preview) plustest:e2e/test:visualnpm scripts and the@playwright/testdependency. - Add 10 spec files exercising NavRail, TopBar, Command Palette, Memories, Sessions, Review, Links, Query, Home, Metrics, Settings, and a viewport visual-regression suite.
- Update
.gitignoreto exclude lock files and Playwright output directories.
Review Assessment
The suite is a good breadth of coverage, but it appears not to have been run green against a live app before submission — several assertions target selectors/behaviors that don't exist in the components, and the configured webServer doesn't serve the API the pages depend on. Key blockers:
- CI break:
.gitignorenow excludespackage-lock.jsonwhilepackage.jsongains@playwright/test; the lint job'snpm ci(ci.yml:127) requires an in-sync lockfile. - Test infra:
npm run previewserves only the static bundle (no/api/*), so data-driven pages render error states and their non-skipped tests fail. - Selector bugs: breadcrumb
getByTestId, command-palettetoBeFocused, memoriesrole="group", and settings multi-match[role="status"]will each fail.
Reviewed changes
Copilot reviewed 13 out of 13 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
src/dashboard_v2/playwright.config.ts |
New Playwright config; webServer uses npm run preview (static bundle, no API backend). |
src/dashboard_v2/package.json |
Adds e2e/visual scripts and @playwright/test dep (lockfile not updated → npm ci risk). |
src/dashboard_v2/.gitignore |
Ignores lock files + Playwright output; lock-file ignore conflicts with npm ci. |
src/dashboard_v2/tests/shell.spec.ts |
Nav/breadcrumb/palette tests; breadcrumb getByTestId and palette toBeFocused don't match the DOM. |
src/dashboard_v2/tests/memories.spec.ts |
Table/drawer tests; getByRole('group','Memory toolbar') won't match (no role="group"). |
src/dashboard_v2/tests/settings.spec.ts |
Sections/save tests; bare [role="status"] matches multiple elements (strict-mode violation). |
src/dashboard_v2/tests/sessions.spec.ts |
Timeline + drawer open/close; data-dependent, backend required. |
src/dashboard_v2/tests/review.spec.ts |
Tabs + bulk select/accept; selectors verified against the page. |
src/dashboard_v2/tests/links.spec.ts |
Relationship drawer + inline delete confirm/cancel flow. |
src/dashboard_v2/tests/query.spec.ts |
Query run via click/Enter; empty-state fallback verified. |
src/dashboard_v2/tests/home.spec.ts |
Health/activity/stat sections; only render when /api/health succeeds. |
src/dashboard_v2/tests/metrics.spec.ts |
Heatmap render + hover tooltip; selectors verified. |
src/dashboard_v2/tests/visual.spec.ts |
Per-page viewport screenshots at 0.1% diff; depends on live pages rendering. |
…file, webServer build step, assertion quality
Contributor
Author
|
Addressed all review comments in commit Blocker — .gitignore / lockfile desync:
playwright.config.ts:
shell.spec.ts:
memories.spec.ts:
review.spec.ts:
query.spec.ts:
settings.spec.ts:
home.spec.ts:
visual.spec.ts:
|
Jessinra
approved these changes
Jul 24, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Closes #302
Sets up Playwright with Chromium and writes E2E + visual regression tests for every Dashboard V2 page.
Changes
Infrastructure
playwright.config.ts— Chromium, 1440×900, base URLhttp://127.0.0.1:7777, webServer vianpm run previewpackage.json—test:e2e,test:e2e:ui,test:visual,test:visual:updatescripts.gitignore— excludedpackage-lock.json,pnpm-lock.yaml, Playwright output dirsTest Files (10 specs)
tests/shell.spec.tstests/memories.spec.tstests/sessions.spec.tstests/review.spec.tstests/links.spec.tstests/query.spec.tstests/home.spec.tstests/metrics.spec.tstests/settings.spec.tstests/visual.spec.tsACs Covered
playwright.config.ts)npm run test:e2eworksNotes
npm run test:visual:updatebefore visual tests can pass in CItest.skip()where row data may be absent; shell/nav/settings tests have no data dependencyConfirmDialog.svelteis not wired globally — confirm pattern is inline per component (RelationshipDrawer). The links.spec.ts tests cover that inline flow directly