test-structure

Organize Vitest and Cypress test suites with feature-grouped describe blocks.

Updated Apr 15, 2026

Search Tags:#vitest #testing #vue #bdd #cypress #describe-blocks #feature-groups

Ready to run

npx skills add https://github.com/obaDev95/myf-agent-skills --skill test-structure-obadev95

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: test-structure
Source: https://github.com/obaDev95/myf-agent-skills/tree/main/skills/test-structure
Command: npx skills add https://github.com/obaDev95/myf-agent-skills --skill test-structure-obadev95

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

BDD-style test titles and feature-grouped describe blocks for Vitest and Cypress in Vue projects. Use when structuring or reviewing specs (tables, views, components), enforcing no root-level it(), or when the user asks for consistent test organization across a feature area.

Core Features & Use Cases

Conventions for Vitest (unit/component) and Cypress (component/e2e) specs. Applies to any domain—invoice tables, estatements, refunds, etc. The skeleton shows a recommended structure with grouped describes (Rendering, Sorting, Selection, Pagination, Page size, Mobile expanded parity) and variant-specific groups when applicable.

Quick Start

Use the test-structure skeleton to organize Vitest and Cypress specs with feature-grouped describes and no root-level it() calls.

Frequently Asked Questions about test-structure

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

FAQPage Schema

How do I structure Vitest and Cypress test suites with feature-driven describe blocks?▼

Structure Vitest and Cypress test suites by grouping describe blocks around specific features like Rendering, Sorting, and Pagination. This feature-driven organization ensures descriptive titles and predictable test groupings across any Vue project domain.

Why should I avoid root-level it() calls in Vue component testing?▼

Avoiding root-level it() calls in Vue component testing enforces a consistent, feature-grouped structure. Wrapping individual tests inside descriptive describe blocks makes test suites easier to navigate, read, and maintain across different feature areas.

What is the best way to organize Cypress e2e tests for Vue feature areas like invoices?▼

Organize Cypress e2e tests for Vue feature areas by applying a consistent skeleton of grouped describe blocks. Group tests by features such as Sorting, Selection, and Pagination to ensure predictable test layout and clear descriptive titles.

Can I use BDD-style test titles for both Vitest and Cypress specs in the same Vue project?▼

Yes, you can apply BDD-style test titles across both Vitest and Cypress specs in the same Vue project. Establishing a shared feature-driven structure ensures consistent test organization and descriptive naming across unit, component, and e2e testing layers.

Does this feature-grouped test structure work for complex UI components like data tables?▼

Yes, the feature-grouped test structure works for complex UI components like data tables. It provides specific describe block groupings for Rendering, Sorting, Selection, Pagination, Page size, and Mobile expanded parity to ensure comprehensive coverage.