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

Changelog

Source

29.2.0

Features

[@jest/cli, jest-config] A seed for the test run will be randomly generated, or set by a CLI option (#13400)
[@jest/cli, jest-config] --show-seed will display the seed value in the report, and can be set via a CLI flag or through the config file (#13400)
[jest-config] Add readInitialConfig utility function (#13356)
[jest-core] Allow testResultsProcessor to be async (#13343)
[@jest/environment, jest-environment-node, jest-environment-jsdom, jest-runtime] Add getSeed() to the jest object (#13400)
[expect, @jest/expect-utils] Allow isA utility to take a type argument (#13355)
[expect] Expose AsyncExpectationResult and SyncExpectationResult types (#13411)

Fixes

[babel-plugin-jest-hoist] Ignore TSTypeQuery when checking for hoisted references (#13367)
[jest-core] Fix detectOpenHandles false positives for some special objects such as TLSWRAP (#13414)
[jest-mock] Fix mocking of getters and setters on classes (#13398)
[jest-reporters] Revert: Transform file paths into hyperlinks (#13399)
[@jest/types] Infer type of each table correctly when the table is a tuple or array (#13381)
[@jest/types] Rework typings to allow the *ReturnedWith matchers to be called with no argument (#13385)

Chore & Maintenance

[*] Update @babel/* deps, resulting in slightly different stack traces for each (#13422)

Performance

[jest-runner] Do not instrument v8 coverage data if coverage should not be collected (#13282)

The README file is missing

FAQs

What is jest-environment-jsdom?

Is jest-environment-jsdom popular?

Is jest-environment-jsdom well maintained?

Last updated on 14 Oct 2022

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install