Skip to content
cccskills
FreePublished on GitHub

javascript-typescript-jest

Write JavaScript and TypeScript tests with Jest using consistent structure, dependency mocking, and checks for asynchronous code. Includes guidance for snapshots and React components, focusing on user interactions, accessibility, and choosing appropriate assertions for expected results.

OriginalShow the original description

Best practices for writing JavaScript/TypeScript tests using Jest, including mocking strategies, test structure, and common patterns.

See how to install

Good for

  • Organize Jest test files and test names
  • Replace API or database dependencies with mocks
  • Test asynchronous results and errors
  • Test React interactions and accessibility

Files included (1)

  • SKILL.md2.2 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

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)

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Map an existing codebase into seven documents covering its technology, structure, architecture, conventions, integrations, tests, and concerns. Link findings to file evidence, mark unknowns, and highlight differences between stated plans and the actual implementation.

  • Get oriented in an unfamiliar codebase
  • Prepare documentation for a project handover
  • Compare documented architecture with implementation
github/awesome-copilot40.2KUpdated Oct 17, 2026

Assess a repository’s readiness for AI agents with AgentRC and generate a standalone HTML dashboard. Review scores across nine areas, see prioritized improvements, and optionally apply scoring policies tailored to an organization.

  • Assessing a repository’s readiness for AI agents
  • Prioritizing improvements from assessment results
  • Reviewing scores under an organization’s own policy
github/awesome-copilot40.2KUpdated Oct 17, 2026

Generate coding agent instruction files from a project's actual code using AgentRC. Capture detected languages, frameworks, and conventions in one shared file or split rules by topic and project area, with a preview before writing.

  • Create project instructions for VS Code Copilot
  • Refresh agent rules after project changes
  • Split monorepo instructions by project area
github/awesome-copilot40.2KUpdated Oct 17, 2026

Customize AgentRC readiness assessments to match team or organization standards. Choose or create policies that adjust check importance, disable irrelevant checks, set pass thresholds, and define requirements for automated checks in CI workflows.

  • Set shared readiness standards across an organization
  • Focus assessments on AI tooling
  • Adjust the importance of individual checks
github/awesome-copilot40.2KUpdated Oct 17, 2026

Analyze supplied ad performance data to identify wasted spend, strong campaigns, and next tests. Compare channels, assess whether test differences are meaningful, and produce budget reallocation recommendations with a prioritized action plan.

  • Identify ads and keywords to pause
  • Find campaigns and audiences worth scaling
  • Assess whether A/B test results are meaningful
github/awesome-copilot40.2KUpdated Oct 17, 2026

Turn code files into learning resources by adding comments that explain syntax, programming concepts, and design choices. Adjust explanation depth and repetition to the reader’s knowledge while preserving file structure, encoding, and syntax.

  • Add beginner-friendly explanations to existing code
  • Document the reasoning behind syntax and design choices
  • Adjust comment depth for readers with different experience
github/awesome-copilot40.2KUpdated Oct 17, 2026

See all skills by github

Report a problem with this skill