Similar to the standard
jest-environment-jsdom
, but exposesjsdom
so that you can reconfigure it from your test suites.
For more information, see this discussion in the Jest repository.
Install the package with yarn
:
yarn add --dev jest-environment-jsdom-global jest-environment-jsdom
or npm
:
npm install --save-dev jest-environment-jsdom-global jest-environment-jsdom
Then, add it to your Jest configuration:
"jest": {
"testEnvironment": "jest-environment-jsdom-global"
}
For more information, see the Jest documentation on testEnvironment
.
You can access the jsdom
object globally in your test suite. For example, here's a test that changes the URL for your test environment (using reconfigure
):
describe("test suite", () => {
it("should not fail", () => {
jsdom.reconfigure({
url: "https://www.example.com/"
});
});
});
Jest's browser environment is based on JSDOM. JSDOM used to allow you to use Object.defineProperty
to update certain properties on window
; in particular, you could change parts of window.location
, or window.top
, as you need to.
However, in recent versions, JSDOM's API has changed; the preferred way to mock window.location
and its child properties is to use reconfigure
. Jest is using version 11 of JSDOM as of Jest 22; as a result, tests that used Object.defineProperty
may no longer work on certain properties of window
.
Currently, Jest does not expose the JSDOM reconfigure
method inside test suites. The jest-environment-jsdom-global
package is meant to solve this problem: it adds jsdom
as a global, so you can reconfigure it within your tests.
In your test, you can set the URL using:
jsdom.reconfigure({
url: "https://www.example.com/"
});
You need to provide a full URL, not just the hash. Similarly to above, you can do:
jsdom.reconfigure({
url: "https://www.example.com/#myHash"
});