スキル vue-testing-best-practices
📦

vue-testing-best-practices

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

Vueテスト品質の改善

Vueのテストは、非同期タイミング、壊れやすい内部実装への依存、弱いスナップショットが原因で失敗しがちです。このスキルは、Claude、Codex、Claude Codeが信頼性の高いVitest、Vue Test Utils、Playwrightのパターンを採用できるように導きます。

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

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

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

エージェントリクエスト
Review the Skillstore skill "vue-testing-best-practices" from https://skillstore.io/skills/antfu-vue-testing-best-practices.md and its manifest at https://skillstore.io/api/skills/antfu-vue-testing-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

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

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

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

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

テストする

「vue-testing-best-practices」を使用しています。 チームが、コンテンツが表示される前に非同期コンポーネントテストがアサートしてしまう理由を尋ねています。

期待される結果:

  • 非同期Vueコンポーネントは初回マウント後に解決されることを説明します。
  • 最終アサーションの前に保留中のPromiseをawaitすることを推奨します。
  • 読み込み、成功、エラー状態を個別にカバーすることを提案します。

「vue-testing-best-practices」を使用しています。 レビュアーが、コンポーネントのプライベート状態を直接読み取るテストを見つけました。

期待される結果:

  • そのテストが実装に結合しており壊れやすいことを特定します。
  • ユーザー向けのクエリ、emitされたイベントのチェック、表示出力のアサーションを推奨します。
  • 意味的な情報を持たない要素にはdata-testidのガイダンスを維持します。

「vue-testing-best-practices」を使用しています。 プロジェクトがVueアプリ向けのE2Eガイダンスを必要としています。

期待される結果:

  • クロスブラウザーのカバレッジとローカルサーバー統合のためにPlaywrightを推奨します。
  • 安定したロケーターパターンとCIを意識したリトライ設定を提案します。
  • E2EフローをコンポーネントレベルのVitestカバレッジから分離します。

セキュリティ監査

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

All 42 static detections are false positives caused by Markdown examples, ordinary test configuration, localhost URLs, and official documentation links. The examples do not execute shell commands, read environment files, expose secrets, or contact untrusted services. No prompt injection or other semantic security concern was found.

14
スキャンされたファイル
2,255
解析済み行数
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/antfu-vue-testing-best-practices/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdownバッジ

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

HTMLバッジ

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

埋め込みカード

<iframe src="https://skillstore.io/embed/skills/antfu-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 5) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/antfu-vue-testing-best-practices/audits/5

BibTeX形式の引用

@techreport{github-com-vuejs-ai-antfu-vue-testing-best-practices-2026, author = {github.com/vuejs-ai}, title = {vue-testing-best-practices security audit report (audit version 5)}, institution = {Skillstore}, year = {2026}, number = {5}, url = {https://skillstore.io/skills/antfu-vue-testing-best-practices/audits/5}, 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 5)" version: "1.0.0" type: report authors: - name: "github.com/vuejs-ai" date-released: "2026-07-23" url: "https://skillstore.io/skills/antfu-vue-testing-best-practices/audits/5" identifiers: - type: other value: "skillstore:antfu-vue-testing-best-practices:audit:5" 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
コンテンツ
70
コミュニティ
83
仕様準拠

作成できるもの

Vueテストをセットアップする

新しいVue 3アプリケーション向けに、実用的なVitestとVue Test Utilsのベースラインを作成します。

不安定なテストを安定化する

非同期コンポーネント、Suspense、flushPromises、DOM更新に関するタイミング問題を診断します。

テスト設計を改善する

壊れやすい実装テストやスナップショットのみのチェックを、動作に焦点を当てたカバレッジに置き換えます。

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

基本テストをセットアップする 
このスキルを使って、私のVue 3プロジェクトにVitestとVue Test Utilsをセットアップしてください。テスト環境の選択肢と基本設定を推奨してください。
非同期の失敗を修正する 
このスキルを使って、失敗している非同期Vueコンポーネントテストをレビューしてください。flushPromises、nextTick、またはSuspenseラッパーがどこで必要か説明してください。
テスト品質をレビューする 
このスキルを使って、私のVueコンポーネントテストについて、壊れやすい内部実装への依存、スナップショットのみのアサーション、弱いセレクター、ユーザー動作カバレッジの不足をレビューしてください。
全体戦略を設計する 
このスキルを使って、Vitest、composables、Pinia、非同期コンポーネント、Teleport、Playwright E2EテストにまたがるVueテスト戦略を設計してください。

ベストプラクティス

  • コンポーネント内部への直接アクセスよりも、動作に焦点を当てたアサーションを優先します。
  • 最終アサーションの前に、Vueの更新、Promise、ユーザー操作をawaitします。
  • 重要なクロスブラウザーのユーザーフローにはPlaywrightを使い、コンポーネントのフィードバックにはVitestを使います。

回避

  • コンポーネントの正しさをスナップショットのみのテストに依存しないでください。
  • 表示される動作で同じ結果を証明できる場合は、プライベートメソッドをテストしないでください。
  • SuspenseやdefineAsyncComponentの使用箇所をテストするときは、非同期タイミングを無視しないでください。

よくある質問

このスキルはどのVueバージョンを対象にしていますか？
Vitest、Vue Test Utils、Pinia、Playwrightを使ったVue 3のテストパターンを対象にしています。
私のプロジェクトのテストを書けますか？
プロジェクトファイルが利用可能な場合、エージェントがテストを書いたり修正したりするようにガイドできます。
Vitestのドキュメントの代わりになりますか？
いいえ。Vueに焦点を当てた実用的なパターンを提供し、概念を一般的なテスト問題に結び付けます。
E2Eテストを扱いますか？
はい。Playwrightセットアップ、ローカル開発サーバーの使用、ブラウザープロジェクト、安定したロケーターを推奨します。
不安定な非同期テストに役立ちますか？
はい。flushPromises、nextTick、Suspenseラッパー、非同期アサーションのタイミングについて説明します。
セキュリティテストを扱いますか？
いいえ。専用のセキュリティ評価ではなく、Vueアプリケーションのテスト品質に焦点を当てています。

開発者情報

ライセンス

MIT

作者バージョン

v1.0.0

Skillstore リビジョン

r2

リポジトリ

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

参照

89edfdc710d0846129dcee6a929477b04f08052c

メンテナンスの新しさ

2026/7/24

利用状況

8 ダウンロード · 224 閲覧

ファイル構成

📄 LICENSE.md

📁 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

📄 SYNC.md

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

関連スキル

すべて表示