What are some tools that can be used for JavaScript testing?

TL;DR

Common choices include Jest, Vitest, Mocha, Jasmine, and Node's built-in test runner for unit or integration tests, plus Playwright and Cypress for browser and end-to-end tests. Testing Library provides user-focused query helpers on top of a runner. The right stack depends on runtime, browser coverage, framework integration, isolation needs, and CI constraints.

Tools for JavaScript testing

Jest

Jest is a popular testing framework originally developed by Facebook and now maintained by the OpenJS Foundation. It is widely used for testing JavaScript applications, especially those built with React.

Ease of use: Jest comes with a lot of built-in features, making it easy to set up and start testing.
Snapshot testing: Jest allows you to capture snapshots of your components and compare them during future test runs.
Mocking: Jest has powerful mocking capabilities, which makes it easy to mock functions, modules, and timers.
Code coverage: Jest provides built-in code coverage reports.

Example of a simple test using Jest:

const sum = (a, b) => a + b;

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

Mocha

Mocha is a flexible testing framework that can be used with various assertion libraries and mocking tools.

Flexibility: Mocha allows you to choose your own assertion library (e.g., Chai) and mocking tools (e.g., Sinon).
Asynchronous testing: Mocha supports returned promises, async tests, and completion callbacks.
Browser support: Mocha can be run in both Node.js and the browser.

Example of a simple test using Mocha and Chai:

const { expect } = require('chai');

describe('Array', () => {
  it('should return -1 when the value is not present', () => {
    expect([1, 2, 3].indexOf(4)).to.equal(-1);
  });
});

Jasmine

Jasmine is a behavior-driven development (BDD) framework for testing JavaScript code. It includes assertions and spies.

Simplicity: Jasmine comes with everything you need to start testing, including an assertion library and mocking tools.
BDD style: Jasmine encourages writing tests in a BDD style, which can make your tests more readable.

Example of a simple test using Jasmine:

describe('A suite', () => {
  it('contains a spec with an expectation', () => {
    expect(true).toBe(true);
  });
});

Cypress

Cypress is an end-to-end testing framework that focuses on real browser interactions.

Real browser testing: Cypress runs tests in the browser, providing a more accurate representation of user interactions.
Time travel: Cypress allows you to go back in time to see what happened at each step of your test.
Automatic waiting: Cypress automatically waits for elements to appear and actions to complete, reducing the need for manual waits.

Example of a simple test using Cypress:

describe('My First Test', () => {
  it('Visits the Kitchen Sink', () => {
    cy.visit('https://example.cypress.io');
    cy.contains('type').click();
    cy.url().should('include', '/commands/actions');
    cy.get('.action-email')
      .type('fake@email.com')
      .should('have.value', 'fake@email.com');
  });
});

Vitest

Vitest is a Vite-native test framework with a Jest-compatible API, TypeScript support, mocking, coverage, and watch mode. It is especially convenient for projects already using Vite.

Playwright

Playwright runs end-to-end tests against Chromium, Firefox, and WebKit. It provides isolated browser contexts, automatic waiting, tracing, and APIs for pages, networks, downloads, and permissions.

Exercises

Beta