Skip to content

test(frontend): add visual regression snapshot for cooperative page (closes #273) - #379

Merged
FrankHood1 merged 3 commits into
Elite-Work:mainfrom
smaug-1:feat/cooperative-visual-snapshot
Oct 25, 2026
Merged

FrankHood1 merged 3 commits into
Elite-Work:mainfrom
smaug-1:feat/cooperative-visual-snapshot

Conversation

@smaug-1

@smaug-1 smaug-1 commented Oct 22, 2026

Copy link
Copy Markdown
Contributor

Summary

Closes #273

This PR adds visual regression test coverage and baseline snapshot PNGs for the cooperative page (/cooperative/bulk-import and /cooperative redirect) following the guidelines in frontend/tests/visual/SNAPSHOT_POLICY.md.

Changes

  1. Visual Regression Spec (frontend/tests/visual/cooperative.spec.ts):

    • Covers unauthenticated state (/cooperative/bulk-import) matching cooperative-public-main.png and cooperative-public-full.png.
    • Tests /cooperative redirecting to /cooperative/bulk-import.
    • Covers authenticated state with mocked wallet session matching cooperative-auth-main.png and cooperative-auth-full.png.
    • Covers bulk import submission result state matching cooperative-import-result.png.
    • Tested across both viewports: chromium-desktop (1440x900) and chromium-mobile (375x667).
  2. Deterministic Baseline Snapshots (frontend/tests/visual/cooperative.spec.ts-snapshots/):

    • cooperative-public-main-chromium-desktop-linux.png
    • cooperative-public-main-chromium-mobile-linux.png
    • cooperative-public-full-chromium-desktop-linux.png
    • cooperative-public-full-chromium-mobile-linux.png
    • cooperative-auth-main-chromium-desktop-linux.png
    • cooperative-auth-main-chromium-mobile-linux.png
    • cooperative-auth-full-chromium-desktop-linux.png
    • cooperative-auth-full-chromium-mobile-linux.png
    • cooperative-import-result-chromium-desktop-linux.png
    • cooperative-import-result-chromium-mobile-linux.png
  3. Freighter External Message Protocol Mock (frontend/tests/visual/fixtures.ts):

    • Added message event listener in seedAuthenticatedWallet to reply to FREIGHTER_EXTERNAL_MSG_REQUEST with FREIGHTER_EXTERNAL_MSG_RESPONSE, allowing Freighter wallet methods (isAllowed(), getAddress(), isConnected()) to resolve immediately and deterministically during visual tests.
  4. Cooperative Route Redirect & Unit Tests (frontend/src/app/cooperative/page.tsx):

    • Added /cooperative route page redirecting to /cooperative/bulk-import.
    • Added unit test in frontend/src/app/cooperative/__tests__/page.test.tsx verifying the redirect.

Verification

  • pnpm test src/app/cooperative/__tests__/page.test.tsx src/__tests__/accessibility/cooperativeBulkImport.axe.test.tsx passes (unit and a11y tests).
  • pnpm exec playwright test --project=chromium-desktop --project=chromium-mobile tests/visual/cooperative.spec.ts passes 12/12 tests with zero pixel diff.
  • pnpm lint passes with 0 errors.
  • pnpm analyze:budget passes under bundle budget limit.
  • node scripts/validate-flaky-quarantine.mjs passes.

…lite-Work#273)

- Add Playwright visual regression spec for /cooperative/bulk-import covering unauthenticated wallet connect prompt, authenticated CSV bulk import form, import result view, and /cooperative redirect.
- Generate baseline desktop (1440x900) and mobile (375x667) PNG snapshots following SNAPSHOT_POLICY.md.
- Update visual fixtures to mock Freighter external message protocol responses for deterministic authentication.
- Add /cooperative page redirecting to /cooperative/bulk-import with unit test coverage.

Closes Elite-Work#273
@smaug-1
smaug-1 requested a review from FrankHood1 as a code owner October 22, 2026 15:49
@FrankHood1
FrankHood1 merged commit 99564c6 into Elite-Work:main Oct 25, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

frontend: add visual regression snapshot for the cooperative page

2 participants