Habilidades vue-testing-best-practices

📦

vue-testing-best-practices

Name: vue-testing-best-practices
Author: github.com/vuejs-ai

v1.0.0 Revisión del contenido r1 Seguro ⚡ Contiene scripts⚙️ Comandos externos🌐 Acceso a red🔑 Variables de entorno

Mejorar las prácticas de testing en Vue

Las suites de pruebas de Vue a menudo se vuelven inestables, frágiles o difíciles de configurar. Esta skill ofrece orientación enfocada para crear pruebas confiables en Vue 3 usando Vitest, Vue Test Utils, Pinia, helpers asíncronos y Playwright.

Compatible con: Claude Codex Code(CC)

🥈 80 Plata

Instalar con mi Agente

Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.

Solicitud de agente

Review the Skillstore skill "vue-testing-best-practices" from https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices.md and its manifest at https://skillstore.io/api/skills/vuejs-ai-vue-testing-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.

Recursos legibles por agentes

Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.

Detalle Markdown GET /skills/vuejs-ai-vue-testing-best-practices.md Manifest firmado GET /api/skills/vuejs-ai-vue-testing-best-practices/manifest Lockfile firmado GET /api/skills/vuejs-ai-vue-testing-best-practices/lockfile

Pruébalo

Usando "vue-testing-best-practices". Una prueba de componente falla antes de que se rendericen los datos asíncronos.

Resultado esperado:

El problema probable son promesas sin resolver después del montaje. La recomendación es esperar las actualizaciones de Vue, vaciar las promesas pendientes y hacer assertions solo después de que el componente asíncrono o la solicitud se haya completado.

Usando "vue-testing-best-practices". Un equipo depende de snapshots amplios para la cobertura de componentes.

Resultado esperado:

La respuesta recomienda snapshots más pequeños solo para markup estable y añade assertions de comportamiento para texto visible, eventos emitidos, estado de formularios e interacciones de usuario.

Usando "vue-testing-best-practices". Un modal renderizado con Teleport no se puede encontrar en las consultas del wrapper.

Resultado esperado:

La respuesta explica por qué las consultas limitadas al wrapper no detectan el DOM teletransportado y recomienda simular Teleport para pruebas unitarias o consultar document body para pruebas de integración.

Auditoría de seguridad

Seguro

v4 • 7/7/2026 Abrir el informe versionado

I found no evidence of malicious intent or prompt injection. The static findings are false positives from documentation examples: local dynamic imports, CI flags, localhost URLs, and Markdown backticks. No remediation is required before publication from this audit.

Archivos escaneados

2,227

Líneas analizadas

Elementos de revisión

Falsos positivos ignorados

Factores de riesgo

⚡ Contiene scripts (5)

reference/async-component-testing.md:28 reference/async-component-testing.md:46 reference/async-component-testing.md:60 reference/async-component-testing.md:85 reference/async-component-testing.md:142

⚙️ Comandos externos (4)

reference/async-component-testing.md:98-110 reference/testing-no-snapshot-only.md:109-111 reference/testing-suspense-async-components.md:57-72 reference/testing-suspense-async-components.md:203-213

🌐 Acceso a red (6)

reference/testing-e2e-playwright-recommended.md:50 reference/testing-e2e-playwright-recommended.md:80 SKILL.md:26 SKILL.md:27 SKILL.md:28 SKILL.md:29

🔑 Variables de entorno (10)

reference/testing-e2e-playwright-recommended.md:43 reference/testing-e2e-playwright-recommended.md:44 reference/testing-e2e-playwright-recommended.md:45 reference/testing-e2e-playwright-recommended.md:81 reference/testing-e2e-playwright-recommended.md:43 reference/testing-e2e-playwright-recommended.md:44 reference/testing-e2e-playwright-recommended.md:45 reference/testing-e2e-playwright-recommended.md:81 reference/testing-vitest-recommended-for-vue.md:160 reference/testing-vitest-recommended-for-vue.md:160

La auditoría estática y semántica completada más reciente no detectó hallazgos de seguridad confirmados. Esto no demuestra que el skill no tenga efectos secundarios.

Auditado por: codex Ver historial de auditorías →

Compartir y citar este informe

Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.

Abrir el informe versionado

Copiar enlace del informe

https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Insignia Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/vuejs-ai-vue-testing-best-practices/security.svg)](https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices?utm_source=security_passport_badge)

Insignia HTML

<a href="https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/vuejs-ai-vue-testing-best-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Tarjeta para insertar

<iframe src="https://skillstore.io/embed/skills/vuejs-ai-vue-testing-best-practices.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Citas académicas (APA · BibTeX · CFF)

Cita APA

github.com/vuejs-ai. (2026). vue-testing-best-practices security audit report (audit version 4) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices/audits/4

Cita BibTeX

@techreport{github-com-vuejs-ai-vuejs-ai-vue-testing-best-practices-2026,
  author = {github.com/vuejs-ai},
  title = {vue-testing-best-practices security audit report (audit version 4)},
  institution = {Skillstore},
  year = {2026},
  number = {4},
  url = {https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices/audits/4},
  note = {Author version 1.0.0}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "vue-testing-best-practices security audit report (audit version 4)"
version: "1.0.0"
type: report
authors:
  - name: "github.com/vuejs-ai"
date-released: "2026-07-07"
url: "https://skillstore.io/skills/vuejs-ai-vue-testing-best-practices/audits/4"
identifiers:
  - type: other
    value: "skillstore:vuejs-ai-vue-testing-best-practices:audit:4"
    description: "Skillstore immutable audit report identifier"

Comparar variantes

2 variantes instalables

Cada autor sigue siendo un skill instalable independiente. La variante recomendada se ordena según la evidencia de Skillstore.

Por qué esta variante es la primera

Mayor uso en Skillstore

Autor / fuente Puntuación de Skillstore Confianza de la evidencia Uso en Skillstore Actualizado

github.com/vuejs-ai Recomendado Actual

vuejs-ai-vue-testing-best-practices

Puntuación de Skillstore 80

Confianza de la evidencia Alto

Uso en Skillstore 20

Actualizado

2026-09-09

github.com/vuejs-ai

antfu-vue-testing-best-practices

Puntuación de Skillstore 80

Confianza de la evidencia Alto

Uso en Skillstore 17

Actualizado

2026-09-09

Puntuación de Skillstore

Por qué esta puntuación Confianza de la evidencia: Alto

Arquitectura

100

Mantenibilidad

Contenido

Comunidad

Cumplimiento de la especificación

Lo que puedes crear

Estabilizar pruebas de componentes inestables

Diagnosticar problemas de actualizaciones asíncronas y elegir las esperas correctas para actualizaciones del DOM de Vue, promesas y eventos de usuario.

Planificar la infraestructura de pruebas de Vue

Seleccionar Vitest, browser mode o Playwright según el alcance de las pruebas, las necesidades de runtime y las restricciones de CI.

Revisar patrones de testing del equipo

Reemplazar snapshots frágiles y comprobaciones dependientes de la implementación por assertions enfocadas en el comportamiento y helpers mantenibles.

Prueba estos prompts

Elegir un runner de pruebas para Vue

Ayúdame a elegir una configuración de testing para Vue 3 en un proyecto Vite. Compara Vitest, Vue Test Utils, browser mode y Playwright para mi caso de uso.

Corregir un fallo de prueba asíncrona

Revisa esta prueba fallida de Vue y explica si debería usar nextTick, flushPromises, waitFor o Suspense. Céntrate en el problema de timing asíncrono.

Mejorar la configuración de pruebas con Pinia

Evalúa mi enfoque de testing con Pinia. Recomienda cuándo usar createTestingPinia, setActivePinia, stubbed actions y ejecución de actions reales.

Diseñar una estrategia de testing

Crea una estrategia de testing para Vue en una app grande con composables, stores de Pinia, componentes asíncronos, modales con Teleport, comportamiento específico del navegador y flujos E2E.

Mejores prácticas

Probar el comportamiento visible para el usuario antes que los detalles de implementación.
Usar el runner más pequeño que cubra con precisión el comportamiento bajo prueba.
Esperar explícitamente las actualizaciones de Vue, las promesas externas y los eventos de usuario.

Evitar

Usar snapshots como la única prueba de que un componente funciona.
Llamar métodos privados del componente en lugar de interactuar mediante la salida renderizada.
Usar pruebas browser o E2E para lógica que las pruebas rápidas de componentes pueden cubrir.

Preguntas frecuentes

¿A qué versiones de Vue está dirigida esta skill?

Está dirigida a proyectos Vue 3, especialmente aplicaciones creadas con Vite, Vitest, Vue Test Utils, Pinia y Playwright.

¿Puede ayudar a elegir entre Vitest y Playwright?

Sí. Explica cuándo usar pruebas rápidas de componentes, pruebas de componentes basadas en navegador y pruebas end-to-end con Playwright.

¿Genera archivos de prueba completos?

Puede guiar la estructura de las pruebas y proporcionar ejemplos, pero las pruebas generadas deben revisarse y adaptarse al codebase del proyecto.

¿Cubre el comportamiento asíncrono de Vue?

Sí. Cubre nextTick, flushPromises, Suspense, async setup, defineAsyncComponent y fallos de pruebas relacionados con timing.

¿Soporta testing con Pinia?

Sí. Cubre createTestingPinia, setActivePinia, stubbing de actions, ejecución de actions reales y aislamiento de stores.

¿Es seguro publicar esta skill?

La auditoría encontró solo ejemplos de documentación y referencias normales de testing. No se identificó comportamiento malicioso ni prompt injection.