4

I have a react application created using "create react app rewired". I've installed ts-jest and want to be able to customize Jest. I read the documentation from ts-jest and executed npx ts-jest config:init at the root level of my project to create the initial configuration file. To test that jest is indeed using that configuration file, I wrote the following line console.log(window); in a sample test file and modified the configuration such that testEnvironment is set to "node".

I am expecting the test to fail due to window being undefined, but I am getting the window object back. I tried renaming the file to jest.config.ts and I got the same result.

I did a global search across all the files to see if there's another configuration file somewhere that is overriding my configurations, but there was none found.

What am I doing wrong? I know jest comes pre-packaged with create-react-app (CRA). I would imagine that create-react-app-rewired would only include some wrapper above CRA so where is it getting its configurations from?

Improve this question

1 Answer 1

Reset to default
7

I've come to realize that create-react-app-rewired package had nothing to do with this issue since it is simply a wrapper package that exposes a configure-overrides.js file to allow developers to modify the webpack configurations managed by create-react-app.

The jest.config.ts or jest.config.js config file I created had no effect because create react app (CRA) will generate and use its own jest config file underneath the hood.

I discovered this by happenstance while researching on another issue. A comment by dstapleton92 on GitHub helped me draw this conclusion.

Create React App supports overriding SOME of the values via the "jest" property in package.json file. Upon inspecting the jest config factory function in CRA, testEnvironment property is hard coded to "jsdom" and the key is not exposed as part of the list of overridable properties.

This is why the attempts I made were not successful.

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

Curiously, the transformIgnorePatterns isn't functioning correctly for me, even though the source code (and my local version) says it should work otherwise.
Turns out it was because of react-app-rewired, which takes over the handling of the jest section of package.json. And, unlike CRA, it performs a concatenation instead of replacement. So it was retaining the original ignore pattern for transformIgnorePatterns rather than overwriting like CRA would

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.