Closed nikolas closed 3 months ago
Hi there! Such tests are present in the repo with Jest 29.7.0 and they work ... hmm can you post some more info about the test and what the Editor.js
component looks like?
Hmmm, that's strange. Here is my code as an example of one of the components it's failing on. I have just disabled these tests for now.
Can you give me instructions on how to reproduce the error? Simply download project and run test script? Also, is it easy to run the project locally and see this RangeEditor
in action? Otherwise could you just provide some brief instructions on how to be able to see it in action :)
@nikolas I was VERY kind and looked in to this a bit and can provide two solutions.
better-react-mathjax
provides both CJS and ESM exports.
First of all the use of ESM modules in Jest is marked as experimental so spending too much time on trouble-shooting this seems inconvenient. What happens is that in the test context, Jest grabs the CJS module of better-react-mathjax
and then treats is like an ESM module. I don't know EXACTLY what happens but it is somehow related to that. It then transforms this file using babel-jest
which you transform ALL code with according to your Jest config and the output is not a file that have the named exports you're looking for. I will not go into detail exactly what happens as it would be too time-consuming but since I AM able to use better-react-mathjax
in a regular Node environment as a CJS module, I'm gonna assume that the problem is not only in this library but also in the combination of how Jest and babel-jest
processes the input. I was trying to get ahold of the transformed code that Jest actually uses when running the test but I was unable to do so.
I also notice that you have MANY files in your code base which contains jsx but which still are named js
which I think is incorrect.
So, the fixes I can provide for this problem:
Turn off the support for ESM and let babel-jest
preprocess all ESM modules into CJS before running the tests. SO starting form the current state of this repo, simply clear the testPathIgnorePatterns
in jest-config.cjs
and then remove the NODE_OPTIONS=--experimental-vm-modules
part of the test
script and all tests pass fine.
An other fix is to ALWAYS import stuff literally from better-react-mathjax/esm
, then all tests pass too.
I would suggest the first fix since the support for ESM modules is still experimental.
I will close this if you don't provide any additional questions :)
Thanks for looking into this - I just opened this ticket on the offchance that there was an issue in this better-react-mathjax package, but it turns out it's my babel/jest setup.
Running tests with jest 29.7.0, better-react-mathjax is throwing this error on my react component tests:
However, everything is working correctly in my production build - it is just the tests that throw this error.