jest-environment-jsdom

What is jest-environment-jsdom?

The jest-environment-jsdom package is a custom environment for Jest that allows you to simulate a browser-like environment using jsdom. This is useful for testing web applications without running them in an actual browser. It provides a simulated DOM API that you can interact with in your tests.

What are jest-environment-jsdom's main functionalities?

Simulating browser environment for testing

This feature allows you to simulate browser-like interactions such as clicking a button and then asserting the expected outcome, all within a Node.js environment.

test('simulates a click event', () => {
  document.body.innerHTML = '<button id="button">Click me</button>';
  const button = document.getElementById('button');
  button.addEventListener('click', () => {
    button.innerHTML = 'Clicked';
  });
  button.click();
  expect(button.innerHTML).toBe('Clicked');
});

Testing DOM manipulation

You can test DOM manipulation by creating, modifying, and removing elements, and then asserting that these changes have taken place as expected.

test('adds a new div to the body', () => {
  const div = document.createElement('div');
  div.id = 'new-div';
  document.body.appendChild(div);
  expect(document.getElementById('new-div')).not.toBeNull();
});

Mocking global variables

The package allows you to mock global variables such as localStorage, which is useful for testing code that interacts with browser APIs that are not available in Node.js.

test('mocks a global variable', () => {
  global.localStorage = {
    getItem: jest.fn().mockReturnValue('mockValue')
  };
  expect(global.localStorage.getItem('key')).toBe('mockValue');
});

Other packages similar to jest-environment-jsdom

jest-environment-node

This package is similar to jest-environment-jsdom but is intended for testing Node.js applications. It does not simulate a browser environment and is therefore not suitable for testing browser-specific code.

karma

Karma is a test runner that works with any framework and allows you to run tests in real browsers. Unlike jest-environment-jsdom, which simulates a browser environment, Karma actually runs tests in real browsers, which can be more accurate but also slower and more complex to set up.

mocha-jsdom

This package integrates jsdom with Mocha, another testing framework. It provides similar functionality to jest-environment-jsdom but is designed to work with Mocha instead of Jest.

enzyme

Enzyme is a testing utility for React that makes it easier to assert, manipulate, and traverse your React Components' output. It can be used in conjunction with jest-environment-jsdom to test React components in a simulated browser environment.

README

The README file is missing

Changelog

jest 17.0.0

• Added expect.extend.
• Properly resolve modules with platform extensions on react-native.
• Added support for custom snapshots serializers.
• Updated to Jasmine 2.5.2.
• Big diffs are now collapsed by default in snapshots and assertions. Added --expand (or -e) to show the full diff.
• Replaced scriptPreprocessor with the new transform option.
• Added jest.resetAllMocks which replaces jest.clearAllMocks.
• Fixes for react-native preset.
• Fixes for global built in objects in jest-environment-node.
• Create mock objects in the vm context instead of the parent context.
• .babelrc is now part of the transform cache key in babel-jest.
• Fixes for docblock parsing with haste modules.
• Exit with the proper code when the coverage threshold is not reached.
• Implemented file watching in jest-haste-map.
• --json now includes information about individual tests inside a file.