スキル vue-testing-best-practices
📦

vue-testing-best-practices

v1.0.0 コンテンツリビジョン r1 安全 ⚡ スクリプトを含む⚙️ 外部コマンド🌐 ネットワークアクセス🔑 環境変数

Vueのテストプラクティスを改善する

Vueのテストスイートは、しばしば不安定で壊れやすく、設定が難しくなります。このスキルは、Vitest、Vue Test Utils、Pinia、非同期ヘルパー、Playwrightを使用して、信頼性の高いVue 3テストを作成するための実践的なガイダンスを提供します。

対応: Claude Codex Code(CC)
🥈 80 シルバー

自分のエージェントでインストール

このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。

エージェントリクエスト
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.

エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。

エージェントが読めるリソース

AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。

Markdown詳細 GET /skills/vuejs-ai-vue-testing-best-practices.md 署名済み manifest GET /api/skills/vuejs-ai-vue-testing-best-practices/manifest 署名済み lockfile GET /api/skills/vuejs-ai-vue-testing-best-practices/lockfile

テストする

「vue-testing-best-practices」を使用しています。 コンポーネントテストが、非同期データのレンダリング前に失敗する。

期待される結果:

考えられる問題は、マウント後にpromiseが未解決のままであることです。推奨事項は、Vueの更新をawaitし、保留中のpromiseをflushし、非同期コンポーネントまたはリクエストが完了してからのみアサーションを行うことです。

「vue-testing-best-practices」を使用しています。 チームがコンポーネントカバレッジのために広範なスナップショットに依存している。

期待される結果:

レスポンスでは、安定したマークアップに対してのみ小さなスナップショットを推奨し、表示テキスト、発火されたイベント、フォーム状態、ユーザー操作に対する振る舞いのアサーションを追加します。

「vue-testing-best-practices」を使用しています。 Teleportでレンダリングされたモーダルがwrapperクエリで見つからない。

期待される結果:

レスポンスでは、wrapperスコープのクエリがteleportされたDOMを見つけられない理由を説明し、ユニットテストではTeleportをスタブ化するか、統合テストではdocument bodyをクエリすることを推奨します。

セキュリティ監査

安全
v4 • 2026/7/7 バージョン別レポートを開く

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.

12
スキャンされたファイル
2,227
解析済み行数
0
レビュー項目
0
誤検知を無視

リスク要因

⚡ スクリプトを含む (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
⚙️ 外部コマンド (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
🌐 ネットワークアクセス (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
🔑 環境変数 (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
最新の完了済み静的・セマンティック監査では、確認済みのセキュリティ検出事項は見つかりませんでした。これは、スキルに副作用がないことを証明するものではありません。
監査者: codex 監査履歴を表示 →
このレポートを共有・引用

バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。

バージョン別レポートを開く
セキュリティ評価

レポートリンクをコピー

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

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)

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>

埋め込みカード

<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>
学術引用 (APA · BibTeX · CFF)

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

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"

バリアントを比較

インストール可能なバリアント 2 件

各作者のスキルは個別のインストール項目として維持されます。推奨バリアントは Skillstore の証拠で順位付けされます。

このバリアントが首位の理由

Skillstore での利用が多い
github.com/vuejs-ai 推奨 現在

vuejs-ai-vue-testing-best-practices

Skillstore スコア 80
証拠の信頼度 高
Skillstore 利用状況 20
更新済み

2026-09-09

github.com/vuejs-ai

antfu-vue-testing-best-practices

Skillstore スコア 80
証拠の信頼度 高
Skillstore 利用状況 18
更新済み

2026-09-09

Skillstore スコア

このスコアの理由 証拠の信頼度: 高
55
アーキテクチャ
100
保守性
87
コンテンツ
71
コミュニティ
83
仕様準拠

作成できるもの

不安定なコンポーネントテストを安定させる

非同期更新の問題を診断し、VueのDOM更新、promise、ユーザーイベントに適した待機方法を選択します。

Vueのテストインフラを計画する

テスト範囲、ランタイム要件、CI制約に基づいて、Vitest、ブラウザモード、Playwrightを選択します。

チームのテストパターンをレビューする

壊れやすいスナップショットや実装依存のチェックを、振る舞い重視のアサーションと保守しやすいヘルパーに置き換えます。

これらのプロンプトを試す

Vueのテストランナーを選ぶ 
Viteプロジェクト向けのVue 3テスト環境を選ぶのを手伝ってください。私のユースケースに対して、Vitest、Vue Test Utils、ブラウザモード、Playwrightを比較してください。
非同期テストの失敗を修正する 
失敗しているこのVueテストをレビューし、nextTick、flushPromises、waitFor、Suspenseのどれを使うべきか説明してください。非同期タイミングの問題に焦点を当ててください。
Piniaのテスト設定を改善する 
私のPiniaテスト手法を評価してください。createTestingPinia、setActivePinia、スタブ化されたアクション、実際のアクション実行をいつ使うべきか推奨してください。
テスト戦略を設計する 
composables、Piniaストア、非同期コンポーネント、Teleportモーダル、ブラウザ固有の振る舞い、E2Eフローを含む大規模アプリ向けに、Vueのテスト戦略を作成してください。

ベストプラクティス

  • 実装の詳細よりも、ユーザーに見える振る舞いを先にテストします。
  • テスト対象の振る舞いを正確にカバーできる最小のランナーを使用します。
  • Vueの更新、外部promise、ユーザーイベントを明示的にawaitします。

回避

  • コンポーネントが動作する唯一の証拠としてスナップショットを使用する。
  • レンダリングされた出力を通じて操作する代わりに、privateなコンポーネントメソッドを呼び出す。
  • 高速なコンポーネントテストでカバーできるロジックに、ブラウザテストやE2Eテストを使用する。

よくある質問

このスキルはどのVueバージョンを対象にしていますか？
Vue 3プロジェクト、特にVite、Vitest、Vue Test Utils、Pinia、Playwrightで構築されたアプリケーションを対象としています。
VitestとPlaywrightのどちらを選ぶべきか判断するのに役立ちますか？
はい。高速なコンポーネントテスト、ブラウザベースのコンポーネントテスト、エンドツーエンドのPlaywrightテストをいつ使うべきか説明します。
完全なテストファイルを生成しますか？
テスト構造や例をガイドできますが、生成されたテストはプロジェクトのコードベースに合わせてレビューし、調整する必要があります。
Vueの非同期動作を扱いますか？
はい。nextTick、flushPromises、Suspense、async setup、defineAsyncComponent、タイミング関連のテスト失敗を扱います。
Piniaテストをサポートしていますか？
はい。createTestingPinia、setActivePinia、アクションのスタブ化、実際のアクション実行、ストアの分離を扱います。
このスキルは公開しても安全ですか？
監査では、ドキュメント例と通常のテスト参照のみが見つかりました。悪意のある動作やプロンプトインジェクションは確認されませんでした。

開発者情報

ライセンス

MIT

作者バージョン

v1.0.0

Skillstore リビジョン

r1

リポジトリ

https://github.com/vuejs-ai/skills/tree/main/skills/vue-testing-best-practices/

参照

36e07d5e13068e5be64447e8f20b427cf2cbd21a

メンテナンスの新しさ

2026/7/18

利用状況

14 ダウンロード · 237 閲覧

ファイル構成

📁 reference/

📄 async-component-testing.md

📄 teleport-testing-complexity.md

📄 testing-async-await-flushpromises.md

📄 testing-browser-vs-node-runners.md

📄 testing-component-blackbox-approach.md

📄 testing-composables-helper-wrapper.md

📄 testing-e2e-playwright-recommended.md

📄 testing-no-snapshot-only.md

📄 testing-pinia-store-setup.md

📄 testing-suspense-async-components.md

📄 testing-vitest-recommended-for-vue.md

📄 SKILL.md

github.com/vuejs-ai のその他のスキル

📦

vue-pinia-best-practices

80

Vue Pinia ストアパターンの改善

Vue アプリケーションは、ストアのセットアップ、分割代入、URL 状態のルールを見落としやすいため、失敗することがよくあります。このスキルは、Claude、Codex、Claude Code に対して、信頼性の高いストアと予測可能なリアクティビティを実現するための Pinia に特化したガイダンスを提供します。

コーディング＆開発 表示

関連スキル

すべて表示
📦

testing-patterns

81

コードベース全体で信頼性の高いテストを計画する

作成者 0xDarkMatter

このスキルは、テスト範囲を混在させずに、チームがテスト戦略、モック、データフィクスチャ、カバレッジゲート、CIパターンを選択するのに役立ちます。Claude、Codex、Claude Codeに、ユニット、統合、エンドツーエンド、TDD、パイプラインテストのための構造化されたガイダンスを提供します。

コーディング＆開発 表示