How can I configure the jsdom instance used by jest?

jestjs jsdom systemjs
user5325596 picture user5325596 · Jan 21, 2016 · Viewed 8.5k times · Source

I've come up against this issue Invalid URL is thrown when requiring systemjs in jest test cases

One of the last comments suggests

"manipulate the jsdom instance to have a valid location / baseURI by setting the referrer config in jsdom."

I'm wondering is there way for me to do that? Can I access the jsdom instance somehow from the jest object?

Answer

Special Character picture Special Character · Jan 18, 2017

I had a similar issue when using a project requiring a url (location.href). You can configure jest with a testURL in your configuration.

Here is what you might put in your package.json (if that is how you configure jest).

"jest": {
    ...other config,
    "testURL": "http://localhost:8080/Dashboard/index.html"
}

testURL Doc

If you need more specific changes to jsdom you can install jsdom yourself and import and configure it separately from jest. Here is an example:

test.js

'use strict';
import setup from './setup';
import React from 'react';
import { mount } from 'enzyme';
import Reportlet from '../components/Reportlet.jsx';

it('Reportlet Renders', () => {
    ...some test stuff
});

setup.js

import jsdom from 'jsdom';
const DEFAULT_HTML = '<html><body></body></html>';

// Define some variables to make it look like we're a browser
// First, use JSDOM's fake DOM as the document
global.document = jsdom.jsdom(DEFAULT_HTML);

// Set up a mock window
global.window = document.defaultView;
global.window.location = "https://www.bobsaget.com/"
// ...Do extra loading of things like localStorage that are not supported by jsdom

Related questions

Mocking `document` in jest

I'm trying to write tests for my web components projects in jest. I already use babel with es2015 preset. I'm facing an issue while loading the js file. I have followed a piece of code where document object has a …

Read More
error 'document' is not defined : eslint / React

I'm building a React app, with create-react-app. I got the following error when running ESLint: 8:3 error 'document' is not defined no-undef. My app runs without error, but I got this ESLint error in 2 files. See one of those .jsx files …

Read More
How to add <canvas> support to my tests in Jest?

In my Jest unit test I am rendering a component with a ColorPicker. The ColorPicker component creates a canvas object and 2d context but returns 'undefined' which throws an error "Cannot set property 'fillStyle' of undefined" if (typeof document == 'undefined') …

Read More