skills.rest
CallMeLuigiv2
CallMeLuigiv2COMMUNITY
Explore all skills by this author →
GitHub

frontend-testing

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

Updated Jan 29, 2026
Search Tags:#testing#frontend#Vitest#RTL#unit-tests#integration-tests#spec-files
One-click install
npx skills add https://github.com/CallMeLuigiv2/Socratic-IDE --skill frontend-testing-callmeluigiv2
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-testing
Source: https://github.com/CallMeLuigiv2/Socratic-IDE/tree/main/.agents/skills/frontend-testing
Command: npx skills add https://github.com/CallMeLuigiv2/Socratic-IDE --skill frontend-testing-callmeluigiv2

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automatically generates high-quality Vitest + React Testing Library tests for Dify frontend components, hooks, and utilities, eliminating repetitive boilerplate and accelerating test coverage.

Core Features & Use Cases

  • Test generation across components, hooks, and utilities using Vitest and RTL.
  • Test review guidance to improve existing specs and boost coverage metrics.
  • Integration-ready templates and patterns for unit and integration tests that follow the project's testing conventions.

Quick Start

Use the frontend-testing skill to generate tests for a target directory or file. For example: "generate tests for src/ui/components" and specify any coverage expectations.

Frequently Asked Questions about frontend-testing

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

FAQPage Schema
How do I automatically generate Vitest and RTL tests for frontend components?▼

To generate frontend tests automatically, you target a specific directory or file and specify your coverage expectations. This produces unit and integration spec files using Vitest and React Testing Library templates.

Can I use this to review existing spec files and improve test coverage?▼

Yes, you can review existing spec files to improve test coverage metrics. It provides test review guidance to refine current specs and boost coverage for components, hooks, and utilities.

Do I need TypeScript tooling installed to generate Vitest tests?▼

Yes, TypeScript tooling must be present in your environment. The test generation requires Vitest, React Testing Library, and TypeScript to properly conform to the repository's testing guidelines.

What's the best way to write integration tests for React hooks and utilities?▼

The best way to write integration tests is using integration-ready templates that follow project conventions. It automates spec file creation for hooks and utilities within the Vitest and RTL workflow.

Does this frontend testing approach work for Dify UI components specifically?▼

Yes, this frontend testing approach is tailored for Dify UI components. It conforms to the repository's web testing guidelines while generating unit and integration tests for the UI.

Related Skills

Explore More Software Engineering Skills→
zenbuappszenbuapps

aibdd.auto.ts.it.starter

Initialize a React integration test scaffold with Vitest, React Testing Library, and MSW.

Official
Intermediate
wunkiwunki
19

write-test

Write tests for untested user-facing features guided by code coverage reports.

Community
Intermediate
tarekBassiounytarekBassiouny

Najaah LMS - Code Quality Agent

Enforces code quality standards for the Najaah LMS project using Pest, PHPStan, and Laravel Pint.

Community
Advanced
wojonswojons
4

testing-e2e

Execute end-to-end tests for user workflows across browsers and platforms.

Community
Advanced