skills.rest
SSiertsema
SSiertsemaCOMMUNITY
Explore all skills by this author →
GitHub

vue-development

Automate TDD-driven Vue/Nuxt 3 development with QA gates and Playwright E2E tests.

1|Updated Nov 29, 2025
Search Tags:#tdd#e2e#qa#vue#playwright#nuxt
One-click install
npx skills add https://github.com/SSiertsema/claude-code-plugins --skill vue-development-ssiertsema
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vue-development
Source: https://github.com/SSiertsema/claude-code-plugins/tree/main/vue-development-skill/skills/vue-development
Command: npx skills add https://github.com/SSiertsema/claude-code-plugins --skill vue-development-ssiertsema

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Vue/Nuxt 3 development often suffers from late feedback loops between requirements, tests, and UI implementation. This skill enforces a test-driven development workflow with QA gates and automated E2E test generation to ensure quality from story to deployment.

Core Features & Use Cases

  • TDD-first development: Write unit tests before implementing Vue components, composables, or pages.
  • QA gates: Validate against a Vue QA checklist to maintain code quality and reliability.
  • E2E test generation: Produce Playwright tests from Gherkin acceptance criteria and generate JSON reports.
  • End-to-end reporting: Create structured JSON reports detailing unit tests, QA status, and E2E results.

Quick Start

Ingest a user story with Gherkin criteria and the system will automatically scaffold unit tests, minimal implementations, and Playwright-based E2E tests with a comprehensive report.

Frequently Asked Questions about vue-development

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

FAQPage Schema
How do I generate Playwright E2E tests from Gherkin acceptance criteria in Vue?▼

Generate Playwright E2E tests for Vue and Nuxt applications by parsing Gherkin acceptance criteria from user stories, executing QA gates, and producing structured JSON reports detailing the E2E test results.

Can I enforce QA gates and unit testing before implementing Vue composables?▼

Yes, you can enforce QA gates and unit testing before implementing Vue composables. The workflow validates code against a Vue QA checklist and ensures unit tests are written prior to component or composable implementation.

What is the best way to apply test-driven development to Nuxt 3 pages?▼

The best way to apply TDD to Nuxt 3 pages is using a workflow that ingests user stories to drive unit test creation first, followed by minimal page implementation and automated Playwright E2E test generation.

How do I create structured JSON reports for Vue unit tests and E2E results?▼

Create structured JSON reports for Vue tests by running a TDD-first development workflow that automatically documents unit tests, QA checklist status, and Playwright E2E results into a comprehensive JSON output.

Do I need Gherkin acceptance criteria to use this Vue TDD workflow?▼

Yes, you need Gherkin acceptance criteria. The workflow relies on ingesting user stories with Gherkin syntax to automatically scaffold unit tests, implement minimal Vue components, and generate Playwright E2E tests.

Related Skills

Explore More Software Engineering Skills→
vito1317vito1317

motion

Animate Vue 3 and Nuxt 3 components with declarative Motion Vue.

Community
Intermediate
SensLiaoSensLiao

qa-e2e-coverage-gate

Automate E2E coverage preparation, execution, and validation for QA pipelines.

Community
Intermediate
incubrainincubrain
78

motion

Automate hardware-accelerated animations in Vue 3 and Nuxt with motion-v.

Official
Intermediate
remiconnessonremiconnesson

vue-testing-best-practices

Consolidate Vue testing guidance for component, composable, and E2E tests.

Community
Intermediate