frontend-testing

Generate Vitest and React Testing Library tests for Dify frontend components, hooks, and utilities.

Updated Jan 9, 2026
One-click install
npx skills add https://github.com/mr-phariyawit/startup --skill frontend-testing-mr-phariyawit
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-testing
Source: https://github.com/mr-phariyawit/startup/tree/main/.agent/skills/frontend-testing
Command: npx skills add https://github.com/mr-phariyawit/startup --skill frontend-testing-mr-phariyawit

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Generate Vitest + React Testing Library tests for Dify frontend components, hooks, and utilities, reducing manual test writing and ensuring consistent coverage.

Core Features & Use Cases

  • Generate unit and integration tests for components, hooks, and utilities following established Dify conventions.
  • Provide test structure templates, mock patterns, and coverage guidance to accelerate testing workflows.
  • Use with test requests for writing, reviewing, or improving tests across the frontend codebase.

Quick Start

Provide a test request for a specific frontend file and I will generate a complete test suite following the Dify frontend testing standards.

Frequently Asked Questions about frontend-testing

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

FAQPage Schema
How do I generate unit tests for frontend components using Vitest and React Testing Library?

To generate unit tests with Vitest and RTL, provide a specific frontend file request. The tool outputs a complete test suite with mock patterns and coverage guidance conforming to project testing standards.

What is the best way to structure integration tests for React hooks?

Structuring integration tests for React hooks uses established templates and Vitest APIs like vi.*. This ensures consistent coverage and integrates seamlessly with project mocks and workflow guidance.

Can I use this to review and improve existing frontend test coverage?

Yes, you can review and improve existing frontend test coverage. Apply the tool to requests for writing, reviewing, or improving unit and integration tests across the frontend codebase to accelerate testing workflows.

Does this frontend testing approach support mock patterns and test templates?

Yes, this frontend testing approach supports mock patterns and test templates. It provides test structure templates and integrates with the project’s mocks to accelerate testing workflows for utilities and components.

When do I need to use Vitest APIs like vi.* for frontend testing?

You need to use Vitest APIs like vi.* for frontend testing when mocking modules or functions in unit and integration tests. These APIs conform to web testing standards and ensure accurate component and hook validation.