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-cli 11.0.0, babel-jest 11.0.0 (pre-releases 0.9 to 0.10)

• New implementation of node-haste and rewrite of internal module loading and resolution. Fixed both startup and runtime performance. #599
• Jasmine 2 is now the default test runner. To keep using Jasmine 1, put testRunner: "jasmine1" into your configuration.
• Added jest-util, jest-mock, jest-jasmine1, jest-jasmine2, jest-environment-node, jest-environment-jsdom packages.
• Added babel-jest-preset and babel-jest as packages. babel-jest is now being auto-detected.
• Added babel-plugin-jest-hoist which hoists jest.unmock, jest.mock and the new jest.enableAutomock and jest.disableAutomock API.
• Improved babel-jest integration and react-native testing.
• Improved code coverage reporting when using babel-jest.
• Added the jest.mock('moduleName', moduleFactory) feature. jest.mock now gets hoisted by default. jest.doMock was added to explicitly mock a module without the hoisting feature of babel-jest.
• Updated jsdom to 8.3.x.
• Improved responsiveness of the system while using --watch.
• Clear the terminal window when using --watch.
• By default, --watch will now only runs tests related to changed files. --watch=all can be used to run all tests on file system changes.
• Debounce --watch re-runs to not trigger test runs during a branch switch in version control.
• Added jest.fn() and jest.fn(implementation) as convenient shortcuts for jest.genMockFunction() and jest.genMockFunction().mockImplementation().
• Added an automock option to turn off automocking globally.
• Added a "no tests found" message if no tests can be found.
• Jest sets process.NODE_ENV to test unless otherwise specified.
• Fixed moduleNameMapper config option when used with paths.
• Fixed an error with Jasmine 2 and tests that throw 'string errors'.
• Fixed issues with unmocking symlinked module names.
• Fixed mocking of boolean values.
• Fixed mocking of fields that start with an underscore ("private fields").
• Fixed unmocking behavior with npm3.
• Fixed and improved --onlyChanged option.
• Fixed support for running Jest as a git submodule.
• Improved verbose logger output
• Fixed test runtime error reporting and stack traces.
• Improved toBeCalled Jasmine 2 custom matcher messages.
• Improved error reporting when a syntax error occurs.
• Renamed HasteModuleLoader to Runtime.
• Jest now properly reports pending tests disabled with xit and xdescribe.
• Removed preprocessCachingDisabled config option.
• Added a testEnvironment option to customize the sandbox environment.
• Added support for @scoped/name npm packages.
• Added an integration test runner for Jest that runs all tests for examples and packages.