Allow customization of Jest: transformIgnorePatterns

[amandapouget]

There are a ton of issues about this, and after two hours of reading through them all, I still wasn't able to get a sense of the state of things.

• It seems that some Jest config options are now available: Make coverage and snapshot Jest options overridable in package.json #1830
• Please make transformIgnorePatterns also available.

We have a case where we have local libraries that are brought into node_modules, but then Jest stumbles whenever we import them, because it is not pre-processing the React components in node_modules. Transpiling our components before export is not an option because the constant transpiling every time one makes a change is a serious drag on development.

Some discussion threw out symlinks as a solution or workaround, but another developer on our team sunk many hours into that before finally getting stuck again.

There has to be a simple way to make LibraryA/MyReactComponent go into MyApp/node_modules, such that MyApp/src/MyComponent can import MyReactComponent during tests without any problems.

It would seem to be a common use case.

[gaearon]

Could you explain more about how transformIgnorePatterns would help? Have you verified (e.g. by manually changing node_modules/react-scripts/utils/createJestConfig) that this particular option would help? What did you set it to?

Is this related to #607?

[amandapouget]

Yes. I manually changed the `transformIgnorePatterns` to just an empty array, as a test case: ``` transformIgnorePatterns: [ // '[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$' ], ``` I also had to change: node_moldules/jest-config/build/defaults: ``` transformIgnorePatterns: [], // removed NODE_MODULES_REGEXP ``` It ran a lot slower, obviously, since that caused it to preprocess EVERYTHING in the node_modules folder. But it finally ran without any “UnexpectedToken <“ errors. With the ability to customize this, I could add to package.json a regular expression that would cause it to pre-process everything in node_modules except the subfolder containing my local libraries. As it stands, the createJestConfig requires Jest to skip pre-processing everything in node_modules, which puts us in the position of constantly having to transpile… To get an idea of the size of the problem, we have 10 different local libraries. We were having to transpile to export every time we changed one line of code. I basically listened to my computer whirr all day long, and saw it eat through 25% of a brand new solid state drive in three months (because of the near constant writing and re-writing to disk) before we finally said enough to the transpiling. But now we’re in a position where we can’t run a Jest test on anything that imports anything that ultimately imports a React component from another library.

…

On Jun 14, 2017, at 7:07 PM, Dan Abramov ***@***.***> wrote: Could you explain more about how transformIgnorePatterns would help? Have you verified (e.g. by manually changing node_modules/react-scripts/utils/createJestConfig) that this particular option would help? What did you set it to? Is this related to #607 <#607>? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#2537 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AMQpjMHaavuyI9I2e2jQ8p6STygdw5O9ks5sEGemgaJpZM4N6iYN>.

[gaearon]

Is there any chance you could share what was the issue with symlinks?

[amandapouget]

Unfortunately, no. The person who went down the long path there is no longer on the project… Could you point me toward good documentation for how to use symlinks to solve this problem?

…

On Jun 14, 2017, at 7:48 PM, Dan Abramov ***@***.***> wrote: Is there any chance you could share what was the issue with symlinks? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#2537 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AMQpjBLCw8A-H_VC4wN60OzCUmfL8gJoks5sEHFRgaJpZM4N6iYN>.

[gaearon]

I’m not entirely sure myself. Unfortunately I’m overloaded with React work right now and can’t look at this in very close future, but this feedback is helpful. We know sharing components between apps is pretty important. If you could describe your setup in more detail (how many apps, how many components they share, your folder layout) this would help for future work.

[amandapouget]

``` Foo - node_modules - - Bar - - - MyUntranspiledReactComponent - src - - MyJestTestedComponentWhichImportsMyUntranspiledReactComponent ** Jest configuration with create-react-app prevents you from transforming files in node_modules via customizing transformIgnorePatterns, so “UnexpectedToken <“ is thrown.** Bar - src - - MyUntranspiledReactComponent ** Does not transpile when copied to Foo/node_modules because constantly transpiling in development is not possible given the volume of folders. ** We have approximately 20+ libraries encompassing several hundred modules all following this structure. Many of the libraries depend on each other as well, compounding the file-transpile-and-copy problem. Symlinks (to avoid copying) or being able to use Jest transformIgnorePatterns (to avoid transpiling before copying to Foo/node_modules) would both be helpful solutions.

…

On Jun 14, 2017, at 7:52 PM, Dan Abramov ***@***.***> wrote: I’m not entirely sure myself. Unfortunately I’m overloaded with React work right now and can’t look at this in very close future, but this feedback is helpful. We know sharing components between apps is pretty important. If you could describe your setup in more detail (how many apps, how many components they share, your folder layout) this would help for future work. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#2537 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AMQpjK7jpo0fNTew4IshlmNR-78L_RMMks5sEHJZgaJpZM4N6iYN>.

[gaearon]

I see, thanks. Again, we don't have any immediate solution to this, but I feel free to participate in #1492.

[adrianblynch]

I have the same issue with an ejected app. Components in node_modules that need to be transpiled by Jest/Babel.

I ended up changing transformIgnorePatterns to:

["/node_modules/(?!(our-react-components-.*?\\.js$))"]

Now JS files in our-react-components-* folders in node_modules are being transpiled.

I understand the discussion is around a non-ejected app, I just wanted to give a solution to those that don't mind ejecting.

[SunLn]

Thanks a lot.
@adrianblynch, you really help me .

[gaearon]

I think #1333 is the first step here. It might not be sufficient for your particular use case but we'll implement it first and can then take feedback on how to expand it.

[michaeldewolf85]

@gaearon This isn't the production domain so while I agree with all the methodology, why wouldn't we let developers supply their own test config if they want/need to? I'm happy to submit a patch if it's worthwhile.