testing

Set up Vitest unit tests and Playwright E2E tests in Pixel Studio projects.

3|1|Updated Aug 21, 2024

Search Tags:#vitest #playwright #fixtures #mocking #unit-testing #e2e-testing #testing-patterns

Ready to run

npx skills add https://github.com/kevinreber/pixel-studio --skill testing-kevinreber

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: testing
Source: https://github.com/kevinreber/pixel-studio/tree/main/.claude/skills/testing
Command: npx skills add https://github.com/kevinreber/pixel-studio --skill testing-kevinreber

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Streamlines quality assurance by providing ready-to-run Vitest unit tests and Playwright end-to-end tests, reducing manual testing time and regression risk.

Core Features & Use Cases

Unit tests with Vitest: structure, mocking, and snapshots for utilities and modules
E2E tests with Playwright: end-to-end flows for pages, auth, and user journeys
Test fixtures and patterns: reusable utilities, mocks, data fixtures, and page object patterns

Quick Start

Create Vitest unit tests and Playwright end-to-end tests following the project patterns and run the npm scripts to execute them.

Frequently Asked Questions about testing

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

FAQPage Schema

How do I set up Vitest unit tests and Playwright E2E tests in a Pixel Studio project?▼

To set up Vitest unit tests and Playwright E2E tests, use the provided testing patterns, mock fixtures, and npm scripts. This validates code paths, ensures UI flows, and guards data integrity across utilities, components, and pages.

What testing patterns are available for mocking and fixtures with Vitest?▼

Vitest testing patterns include reusable utilities, mocks, data fixtures, and snapshots for modules. These patterns structure unit tests to validate code paths and reduce manual testing time and regression risk.

Can I automate end-to-end user journeys and auth flows using Playwright?▼

Playwright E2E tests automate end-to-end user journeys, pages, and auth flows. This provides ready-to-run end-to-end testing coverage to streamline quality assurance and reduce manual regression testing.

Does this testing approach support test-driven development for onboarding new contributors?▼

Yes, the Vitest and Playwright testing approach supports test-driven development and regression testing. It provides ready-to-run tests across utilities, components, and pages, facilitating onboarding for new contributors.

Why do I need testing utilities and mock fixtures for Vitest and Playwright?▼

Testing utilities and mock fixtures are required to validate code paths, ensure UI flows, and guard data integrity. They provide reusable patterns and data structures needed to execute Vitest unit tests and Playwright E2E tests successfully.