feat(testing): set up comprehensive testing infrastructure with Vitest and Playwright - #44
Open
akordavid373 wants to merge 5 commits into
Open
Conversation
…t and Playwright - Add vitest.config.ts with jsdom environment, path aliases, and coverage thresholds - Add playwright.config.ts for E2E tests (chromium, firefox, mobile) - Create src/test/setup.ts with global browser API mocks and Freighter wallet mock - Create src/test/utils.tsx with custom render wrapped in NextIntlClientProvider - Create MSW handlers and server for API endpoint mocking - Add test fixtures for wallet states, vesting schedules, and Soroban RPC responses - Add 95 unit tests across 9 files covering all lib/ functions and hooks - Add component tests for AriaLiveRegion and VisuallyHidden - Add E2E test spec for homepage, locale switching, and accessibility - Update CI workflow (test.yml) with typecheck, test, coverage, and e2e jobs - Add npm scripts: test, test:ui, test:watch, test:coverage, test:e2e - Fix isTranslationKey to verify resolved leaf values are strings - Fix validateRedirectUrl to reject arbitrary non-URL strings Closes stellar-network-builders#22
- Add e2e/wallet-connect.spec.ts with Freighter API mocking via addInitScript - Tests disconnected, connected, and network mismatch states - Forward-looking skipped tests for wallet lifecycle UX (when UI is built) - Page error tracking to catch unhandled exceptions during tests - Add e2e/dashboard-navigation.spec.ts with comprehensive navigation tests - Locale routing for all 4 languages with metadata validation - Responsive layout tests (mobile, tablet, desktop) - External link behavior validation - Error resilience (unknown locale 404, rapid locale switching) - All selectors use getByRole/getByLabel/getByText best practices - Refactor e2e/homepage.spec.ts to remove duplication, use getByRole - Add coverage/, test-results/, playwright-report/ to ESLint ignores Related: stellar-network-builders#22
…e, and LocaleSwitcher - Add SkipLink.test.tsx: tests anchor rendering, className, click/keydown handlers - Add WebVitals.test.tsx: tests hook invocation on mount, renders null - Add AxeCore.test.tsx: tests null rendering, production early-return, dev dynamic import - Add LocaleSwitcher.test.tsx: tests select rendering, all 4 locales, announcePolite + router.replace on change, enabled state - Add requestIdleCallback mock to test setup for @axe-core/react compatibility - All tests use vi.mock with vi.hoisted for clean module-level mocking Related: stellar-network-builders#22
- Merge package.json: combine Storybook/Radix deps from main with testing infra deps - Merge vitest.config.ts: split into 'unit' (jsdom) and 'storybook' (browser) projects - Pull .storybook/main.ts and .storybook/preview.tsx from main - Add global @axe-core/react mock in setup.ts to prevent React.createElement error - Move path alias and exclude into per-project config for correct vitest resolution All 114 tests pass, typecheck clean, lint clean, build succeeds.
Contributor
sorry it did not pass pipeline |
Contributor
|
did not pass pipeline and resolve conflict |
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
2 participants
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 #22
This PR sets up a comprehensive testing infrastructure for the Lumina frontend application as described in issue #22.
Testing Infrastructure
vitest.config.ts— Vitest with jsdom environment, path aliases, and coverage thresholds (50%)playwright.config.ts— Playwright E2E configuration with Chromium, Firefox, and Mobile Chrome projectssrc/test/setup.ts— Global browser API mocks (matchMedia, ResizeObserver, IntersectionObserver, crypto, Freighter wallet, scrollTo, rAF)src/test/utils.tsx— Custom render utility wrapping components inNextIntlClientProvidersrc/test/mocks/— MSW server + handlers for all API endpoints (health, auth, vesting, dashboard) and error scenariosTest Fixtures
wallet.ts— 4 wallet states (connected, disconnected, wrong network, not installed) + test accountsvesting.ts— 4 vesting schedule states (active, pre-cliff, completed, revoked) + summarysoroban.ts— 7 Soroban RPC response mocks (success, failed, pending, simulate, events, empty)Unit Tests — 95 tests across 9 files, all passing ✅
security.test.tsperformance.test.tsformat.test.tsa11y.test.tsvirtual-scroll.test.tsi18n-types.test.tsuseAnnounce.test.tsuseFocusManagement.test.tsui-components.test.tsxE2E Tests
e2e/homepage.spec.ts— Homepage rendering, skip-to-content, locale switching, accessibility landmarksBug Fixes
isTranslationKeyto verify resolved leaf values are strings, not objectsvalidateRedirectUrlto reject arbitrary non-URL stringsCI Pipeline
.github/workflows/test.ymlwithtypecheck→test --coverage→build→e2ejobstypecheck,test,test:ui,test:watch,test:coverage,test:e2e,test:e2e:uiVerification