javascript-typescript-jest

作成者: github

Jestテストのベストプラクティス:JavaScriptおよびTypeScriptプロジェクトにおけるモック、非同期処理、Reactパターン。テストは説明的な名前を付けてネストされたdescribeブロックで整理し、.test.ts / .test.jsファイルをソースコードと並べて配置するか、__tests__ディレクトリに配置します。外部依存関係はjest.mock()、jest.spyOn()、mockImplementation()でモック化し、テスト間でリセットして状態の漏洩を防ぎます。非同期コードはPromise、async/await、resolves/rejectsマッチャーで処理し、設定...

npx skills add https://github.com/github/awesome-copilot --skill javascript-typescript-jest

Test Structure

  • Name test files with .test.ts or .test.js suffix
  • Place test files next to the code they test or in a dedicated __tests__ directory
  • Use descriptive test names that explain the expected behavior
  • Use nested describe blocks to organize related tests
  • Follow the pattern: describe('Component/Function/Class', () => { it('should do something', () => {}) })

Effective Mocking

  • Mock external dependencies (APIs, databases, etc.) to isolate your tests
  • Use jest.mock() for module-level mocks
  • Use jest.spyOn() for specific function mocks
  • Use mockImplementation() or mockReturnValue() to define mock behavior
  • Reset mocks between tests with jest.resetAllMocks() in afterEach

Testing Async Code

  • Always return promises or use async/await syntax in tests
  • Use resolves/rejects matchers for promises
  • Set appropriate timeouts for slow tests with jest.setTimeout()

Snapshot Testing

  • Use snapshot tests for UI components or complex objects that change infrequently
  • Keep snapshots small and focused
  • Review snapshot changes carefully before committing

Testing React Components

  • Use React Testing Library over Enzyme for testing components
  • Test user behavior and component accessibility
  • Query elements by accessibility roles, labels, or text content
  • Use userEvent over fireEvent for more realistic user interactions

Common Jest Matchers

  • Basic: expect(value).toBe(expected), expect(value).toEqual(expected)
  • Truthiness: expect(value).toBeTruthy(), expect(value).toBeFalsy()
  • Numbers: expect(value).toBeGreaterThan(3), expect(value).toBeLessThanOrEqual(3)
  • Strings: expect(value).toMatch(/pattern/), expect(value).toContain('substring')
  • Arrays: expect(array).toContain(item), expect(array).toHaveLength(3)
  • Objects: expect(object).toHaveProperty('key', value)
  • Exceptions: expect(fn).toThrow(), expect(fn).toThrow(Error)
  • Mock functions: expect(mockFn).toHaveBeenCalled(), expect(mockFn).toHaveBeenCalledWith(arg1, arg2)

githubのその他のスキル

debugging-workflows
github
GitHubのエージェンティックワークフローをデバッグするためのガイド - ログの分析、実行の監査、問題のトラブルシューティング
go-codemod
github
gh aw fix コマンド用のGoコードモッドを実装およびテストする。
acreadiness-policy
github
ユーザーがAgentRCポリシーを選択、作成、または適用するのを支援します。ポリシーは、関連性のないチェックを無効にしたり、影響度/レベルを上書きしたり、設定することで、レディネススコアリングをカスタマイズします。
ai-ready
github
あらゆるリポジトリをAI対応にします。コードベースを分析し、AGENTS.md、copilot-instructions.md、CIワークフロー、Issueテンプレートなどを生成します。PRレビューを解析し…
create-oo-component-documentation
github
オブジェクト指向コンポーネント向けに、業界のベストプラクティスとアーキテクチャ文書化標準に従った、包括的で標準化されたドキュメントを作成します。
dependabot
github
DependabotはGitHubに組み込まれた依存関係管理ツールであり、3つの主要機能を備えています。
doublecheck
github
AI出力のための3層検証パイプライン。検証可能な主張を抽出し、ウェブ検索で支持または反証する情報源を見つけ、敵対的レビューを実行…
foundry-agent-sync
github
ローカルのJSONマニフェストから、REST APIを介してAzure AI Foundry内でプロンプトベースのAIエージェントを直接作成および同期します。スキャフォールディングスキルとは異なり、単に…