スキル javascript-testing-patterns
🧪

javascript-testing-patterns

安全

JavaScriptテストパターンマスター

こちらからも入手できます: wshobson

テストを書くことは難しいです。このスキルでは、Jest、Vitest、Testing Libraryを使用したユニットテスト、統合テスト、E2Eテストのための実証済みのパターンと例を提供し、信頼性の高いテストスイートを素早く構築できます。

対応: Claude Codex Code(CC)
📊 71 十分
1

スキルZIPをダウンロード

2

Claudeでアップロード

設定 → 機能 → スキル → スキルをアップロードへ移動

3

オンにして利用開始

テストする

「javascript-testing-patterns」を使用しています。 Write unit tests for an add function that takes two numbers and returns their sum

期待される結果:

  • ```typescript
  • import { describe, it, expect } from 'vitest';
  • import { add } from './calculator';
  •  
  • describe('add', () => {
  • it('should add two positive numbers', () => {
  • expect(add(2, 3)).toBe(5);
  • });
  •  
  • it('should add negative numbers', () => {
  • expect(add(-2, -3)).toBe(-5);
  • });
  •  
  • it('should handle zero', () => {
  • expect(add(0, 5)).toBe(5);
  • });
  • });
  • ```

「javascript-testing-patterns」を使用しています。 Create a test for a user form component that validates email and submits data

期待される結果:

  • ```typescript
  • import { render, screen, fireEvent } from '@testing-library/react';
  • import { describe, it, expect, vi } from 'vitest';
  • import { UserForm } from './UserForm';
  •  
  • describe('UserForm', () => {
  • it('should show validation error for invalid email', () => {
  • render(<UserForm onSubmit={vi.fn()} />);
  • fireEvent.change(screen.getByTestId('email-input'), {
  • target: { value: 'invalid-email' }
  • });
  • fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
  • expect(screen.getByText('Invalid email')).toBeInTheDocument();
  • });
  •  
  • it('should call onSubmit with form data', () => {
  • const onSubmit = vi.fn();
  • render(<UserForm onSubmit={onSubmit} />);
  • fireEvent.change(screen.getByTestId('name-input'), {
  • target: { value: 'John Doe' }
  • });
  • fireEvent.change(screen.getByTestId('email-input'), {
  • target: { value: 'john@example.com' }
  • });
  • fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
  • expect(onSubmit).toHaveBeenCalledWith({
  • name: 'John Doe',
  • email: 'john@example.com'
  • });
  • });
  • });
  • ```

セキュリティ監査

安全
v1 • 2/25/2026

All 145 static findings are false positives. The detected patterns exist only in code examples within markdown documentation files, not in executable code. The skill provides educational content about testing patterns with code samples demonstrating legitimate testing practices including mock setup, API testing, email service testing, and database integration testing. No executable code, no security risks.

2
スキャンされたファイル
1,063
解析された行数
0
検出結果
1
総監査数
セキュリティ問題は見つかりませんでした
監査者: claude

品質スコア

38
アーキテクチャ
100
保守性
87
コンテンツ
31
コミュニティ
100
セキュリティ
91
仕様準拠

作れるもの

新規プロジェクトテストセットアップ

適切なフレームワーク設定、ディレクトリ構造、CI/CD統合を持つゼロからテストインフラストラクチャを確立する必要がある、新しいJavaScript/TypeScriptプロジェクトを開始する開発者向け。

既存のコードベースへのテスト追加

既存の機能を壊すことなく、既存の関数、API、およびコンポーネントのテストを徐々に導入する必要がある、レガシーまたは未テストのアプリケーションを保守するチーム向け。

テストカバレッジの改善

高度なモックパターン、フィクスチャファクトリ、統合テスト戦略を学ぶことで、コードカバレッジを高め、テスト品質を向上させたい開発者向け。

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

基本的なユニットテスト
[関数の動作の説明]を行う関数のユニットテストを作成してください。成功ケースとエラー処理のテストを含んでください。
Testing Libraryを使用したコンポーネントテスト
[コンポーネント動作の説明]を行うコンポーネントのReact Testing Libraryテストを作成してください。ユーザーインタラクション、フォーム送信、エラー状態をテストしてください。
API統合テスト
外部依存関係のモック
[リストされた依存関係]を含む外部依存関係を模倣した[サービス/クラス]のテストを作成してください。依存関係注入とvi.mockパターンを使用してください。

ベストプラクティス

  • 明確な構造と可読性のために、すべてのテストでArrange-Act-Assert(AAA)パターンを守ってください
  • リファクタリングに対してテストを堅牢にするために、実装詳細ではなく動作とユーザーインタラクションをテストしてください
  • テストを分離し、ポリューショニングを防ぐために、beforeEachとafterEachフックをセットアップとティアダウンに使用してください

回避

  • 内部関数の呼び出しやコンポーネントの状態など、実装詳細ではなくobservableな動作をテストしてください
  • リファクタリング時に動作は変わらないのに壊れる脆いテストを書かないでください
  • テストを理解し保守しづらくする過度に複雑なテストセットアップと多くのモックを作成しないでください

よくある質問

JestとVitestのどちらを使用すべきですか?
Vitestはより高速で、Viteプロジェクトにより適しています。Jestはより成熟しており、より広く採用されています。Viteを使用する場合はVitest、そうでない場合はJestが安全な選択です。
外部APIを使用するコードはどのようにテストしますか?
vi.mock()または依存関係注入を使用して外部API呼び出しを模倣してください。これにより、テストが高速で信頼性が高く、外部サービスから独立した状態に保たれます。
どのテストカバレッジを目指すべきですか?
80%のカバレッジを一般的な目標としてください。100%のカバレッジを追求するのではなく重要なビジネスロジックとエラーパスのカバーに焦点を当ててください。
プライベートなメソッドをテストすべきですか?
いいえ。パブリックな動作のみをテストしてください。プライベートなメソッドのテストが必要な場合は、それらを別々のテスト可能なユニットにリファクタリングすることを検討してください。
データベーステストはどのように処理しますか?
個別のテストデータベースを使用し、beforeEachを使用してテスト間でデータをクリーンアップしてください。テーブルをトランケートする代わりに、より高速なロールバックのためにトランザクションの使用を検討してください。
ユニットテストと統合テストの違いは何ですか?
ユニットテストは単一の関数またはクラスを分離します。統合テストはデータベースとAPIを含む複数のコンポーネントが 함께動作することを確認します。

開発者の詳細

ファイル構成