webapp-testing

Automate Playwright end-to-end tests for TaxHelper web UI with mocked API routes.

Updated Jul 11, 2025
One-click install
npx skills add https://github.com/mattleonard16/taxhelper --skill webapp-testing-mattleonard16
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: webapp-testing
Source: https://github.com/mattleonard16/taxhelper/tree/main/.factory/skills/webapp-testing
Command: npx skills add https://github.com/mattleonard16/taxhelper --skill webapp-testing-mattleonard16

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure web app reliability by providing standardized Playwright E2E testing patterns for TaxHelper, covering authentication redirects, insights drill-down flows, and PWA verification.

Core Features & Use Cases

  • Deterministic tests: Mock API routes to avoid flaky Prisma-related state and speed up feedback cycles.
  • Auth redirect validation: Verify unauthenticated users are redirected to the sign-in page.
  • Cross-device testing: Validate dashboards and insights across mobile and desktop viewports, including service worker checks.
  • PWA verification: Ensure progressiveness and offline capabilities are maintained.

Quick Start

Execute npm run test:e2e to run the Playwright test suite against the configured base URL.

Frequently Asked Questions about webapp-testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write deterministic Playwright E2E tests that don't rely on database state?

Playwright E2E tests achieve deterministic results by mocking API routes instead of relying on real database state. This approach avoids flaky data dependencies and speeds up feedback cycles during web UI validation.

How do I test authentication redirects for unauthenticated users with Playwright?

Testing authentication redirects with Playwright involves verifying that unauthenticated users navigating protected routes are automatically redirected to the sign-in page. This validates access control workflows without requiring real login sessions.

Can I validate dashboards across mobile and desktop viewports in Playwright?

Yes, you can validate dashboards across mobile and desktop viewports in Playwright. Cross-device testing ensures UI layouts and insights drill-down flows render correctly on different screen sizes, including service worker checks for PWA verification.

Do I need a base URL configured in playwright.config.ts to run these tests?

Yes, a base URL configured in playwright.config.ts is required to run these E2E tests. The test suite executes against this configured base URL using the npm run test:e2e command to validate the web UI.

What is the best way to verify PWA offline capabilities and service workers in E2E testing?

The best way to verify PWA offline capabilities in E2E testing is using Playwright service worker checks. This validates progressiveness and offline functionality to ensure web app reliability is maintained across device viewports.

Why are my Playwright test fixtures failing on authenticated paths?

Playwright test fixtures fail on authenticated paths when API routes are not properly mocked or base URL configurations are incorrect. Applying standardized test patterns and mocking network requests ensures reliable authentication redirect validation.