Standardizes Vue 3 component testing using best practices for rendering, user interactions, and state mocking.
This skill equips Claude with specialized patterns for testing Vue 3 components using the official Vue Test Utils library. It enforces high-fidelity testing strategies by prioritizing full component rendering with mount() over shallowMount(), utilizing data-test attributes for resilient selectors, and ensuring proper handling of asynchronous operations. By integrating patterns for Pinia store mocking and Vue Router simulation, it enables the creation of robust integration tests that mirror real-world user behavior while adhering to strict architectural conventions.
Key Features
013 GitHub stars
02Standardized mounting strategies for full and isolated component testing
03Built-in patterns for mocking Pinia stores using createTestingPinia
04Resilient selector strategies using data-test attributes
05Advanced async lifecycle management with flushPromises and nextTick
06Asynchronous event handling for triggers, inputs, and form submissions
Use Cases
01Simulating multi-step user interaction flows and form validations
02Testing complex Vue 3 components using the Composition API
03Mocking global state management and routing in isolated component tests
