vercel / next.js

The React Framework
https://nextjs.org
MIT License
124.95k stars 26.69k forks source link

Jest fails to import ramda #52541

Open pago opened 1 year ago

pago commented 1 year ago

Verify canary release

Provide environment information

➜  workspace git:(master) ✗ npx next info

    Operating System:
      Platform: linux
      Arch: x64
      Version: #22 SMP Tue Jan 10 18:39:00 UTC 2023
    Binaries:
      Node: 16.17.0
      npm: 8.15.0
      Yarn: 1.22.19
      pnpm: 7.1.0
    Relevant Packages:
      next: 13.4.10-canary.3
      eslint-config-next: N/A
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 4.9.4
    Next.js Config:
      output: N/A

Which area(s) of Next.js are affected? (leave empty if unsure)

Jest (next/jest)

Link to the code that reproduces this issue or a replay of the bug

https://codesandbox.io/p/sandbox/github/vercel/next.js/tree/canary/examples/reproduction-template?file=%2Fpackage.json%3A1%2C1

To Reproduce

Run npm test in the console

Describe the Bug

When importing ramda in a test or from a file under test, the import fails due to attempting to load ramda/es/[filename].js. Jest is unable to process the ES Module syntax used within the ramda/es directory.

This issue is a regression, most likely introduced through https://github.com/vercel/next.js/pull/50900 by @timneutkens The modularizeImports configuration option specified there seems to be passed through to the SWC plugin in next/jest. However, SWC is also configured to ignore node_modules during processing, therefore the test fails.

 FAIL  test/example.spec.js
  ● Test suite failed to run

    Jest encountered an unexpected token

    Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax.

    Out of the box Jest supports Babel, which will be used to transform your files into valid JS based on your Babel configuration.

    By default "node_modules" folder is ignored by transformers.

    Here's what you can do:
     • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/ecmascript-modules for how to enable it.
     • If you are trying to use TypeScript, see https://jestjs.io/docs/getting-started#using-typescript
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/configuration
    For information about custom transformations, see:
    https://jestjs.io/docs/code-transformation

    Details:

    /project/home/pago/workspace/node_modules/ramda/es/sum.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){import add from "./add.js";
                                                                                      ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      3 | test("works", () => {
      4 |   expect(sum([21, 21])).toEqual(42);
    > 5 | });
        |              ^
      6 |

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1496:14)
      at Object.<anonymous> (test/example.spec.js:5:53)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.663 s, estimated 1 s
Ran all test suites.

Expected Behavior

The test should be exected correctly.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

NEXT-1429

michalstrzelecki commented 1 year ago

I can confirm the bug exists in the newest release - "13.4.10".

trevans24 commented 1 year ago

Any word on working to fix this and confirming it is still here in "13.4.12"

AliZaib-Emumba commented 1 year ago

Had the same problem. I replaced the import from e.g. import {anyPass} from 'ramda' to import R from 'ramda' and used it where required as R.anyPass(...)

and the tests started to work fine.

behnamazimi commented 1 year ago

I have the same issue. Next v13.4.12

michalstrzelecki commented 1 year ago

You have to add ramda package to transpilePackages in the next config.

AliZaib-Emumba commented 1 year ago

You have to add ramda package to transpilePackages in the next config.

This is the best solution to any package causing such problem.

sentience commented 11 months ago

Confirmed issue still present in Next v13.5.4.

doriansmiley commented 3 months ago

I confirmed adding ramda package to transpilePackages in the next config worked. This is the best answer.