FreePublished on GitHub

vue-testing-best-practices

Use for Vue.js testing. Covers Vitest, Vue Test Utils, component testing, mocking, testing patterns, and Playwright for E2E testing.

The English summary is being prepared. Showing the original description.

hetari/sulaf

Works withPlaywright

See how to install

Files included (14)

SKILL.md2.1 KB
LICENSE.md1.1 KB
reference/async-component-testing.md4.9 KB
reference/teleport-testing-complexity.md4.1 KB
reference/testing-async-await-flushpromises.md5.1 KB
reference/testing-browser-vs-node-runners.md5.5 KB
reference/testing-component-blackbox-approach.md4.6 KB
reference/testing-composables-helper-wrapper.md6.0 KB
reference/testing-e2e-playwright-recommended.md6.9 KB
reference/testing-no-snapshot-only.md6.1 KB
reference/testing-pinia-store-setup.md6.1 KB
reference/testing-suspense-async-components.md6.3 KB
reference/testing-vitest-recommended-for-vue.md5.1 KB
SYNC.md162 B

SKILL.md (original)

Review the instructions the agent will receive before you install.

Vue.js testing best practices, patterns, and common gotchas.

Testing

Setting up test infrastructure for Vue 3 projects → See testing-vitest-recommended-for-vue
Tests keep breaking when refactoring component internals → See testing-component-blackbox-approach
Tests fail intermittently with race conditions → See testing-async-await-flushpromises
Composables using lifecycle hooks or inject fail to test → See testing-composables-helper-wrapper
Getting "injection Symbol(pinia) not found" errors in tests → See testing-pinia-store-setup
Components with async setup won't render in tests → See testing-suspense-async-components
Snapshot tests keep passing despite broken functionality → See testing-no-snapshot-only
Choosing end-to-end testing framework for Vue apps → See testing-e2e-playwright-recommended
Tests need to verify computed styles or real DOM events → See testing-browser-vs-node-runners
Testing components created with defineAsyncComponent fails → See async-component-testing
Teleported modal content can't be found in wrapper queries → See teleport-testing-complexity

Reference

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

More skills from this repository

accessibility

Free

Audit and improve web accessibility following WCAG 2.2 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible".

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

frontend-design

Free

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

motion

Free

Use when adding animations with Motion Vue (motion-v) - provides motion component API, gesture animations, scroll-linked effects, layout transitions, and composables for Vue 3/Nuxt

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

nuxt

Free

Nuxt full-stack Vue framework with SSR, auto-imports, and file-based routing. Use when working with Nuxt apps, server routes, useFetch, middleware, or hybrid rendering.

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

nuxt-content

Free

Use when working with Nuxt Content v3, markdown content, or CMS features in Nuxt - provides collections (local/remote/API sources), queryCollection API, MDC rendering, database configuration, NuxtStudio integration, hooks, i18n patterns, and LLMs integration

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

nuxt-seo

Free

Nuxt SEO meta-module with robots, sitemap, og-image, schema-org. Use when configuring SEO, generating sitemaps, creating OG images, or adding structured data.

The English summary is being prepared. Showing the original description.

hetari/sulaf17Updated Sep 10, 2026

See all skills by hetari

Report a problem with this skill

Install

Install with a command

npx skills add https://github.com/hetari/sulaf --skill vue-testing-best-practices

Paste it into your terminal and run it (requires Node.js). You can choose which agents to install it for, such as Claude Code or Codex.

Ask your agent

Please install the following Agent Skill.
https://github.com/hetari/sulaf/tree/main/.agents/skills/vue-testing-best-practices

First review SKILL.md and the bundled files and confirm there is nothing suspicious (such as sending data externally or reading credentials). Then place it in ~/.claude/skills/vue-testing-best-practices/ for Claude Code, or ~/.agents/skills/vue-testing-best-practices/ for Codex.

Send this text to Claude Code or Codex as is. It checks the contents before installing.

View source on GitHub

Repository: hetari/sulaf
Stars: 17
Forks: 0
Category: Testing & Security
License: MIT
Original language: English
Last updated: Sep 10, 2026

A skill is a set of instructions and scripts for an agent. cccskills does not guarantee that skills are safe. Review the contents before you install.