Example with React

[poteirard]

I'm trying to move from react-scripts to SWC.

The building part is fine with webpack but I'm struggling a bit with jest.

this is the config that I've tried so far in the package.json:

{
"jest": {
    "rootDir": "./src",
    "testMatch": ["<rootDir>/**/*.test.{ts,tsx,js,jsx}"],
    "moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"],
    "transform": {
      "^.+\\.tsx?$": ["@swc/ject"]
    },
    "testEnvironment": "node",
    "collectCoverageFrom": [
      "src/components/**/*.{ts,tsx}"
    ]
  },
}

Any clue how to configure it properly?

The error I get in every test is:

SyntaxError: Cannot use import statement outside a module

Thank you

[kdy1]

It seems like a bug of swc/jest.

Can you try module.type="commonjs" like shown below?

https://swc-project.github.io/docs/configuring-swc.html#common-js

[poteirard]

Hey @kdy1 same error 😓

[kdy1]

I'll fix it soon

[kdy1]

I found that it works if rootDir is removed.
Also, if rootDir exists, process is not called.

[kdy1]

Found the root cause.
You need to add "<rootDir>/*.test.{ts,tsx,js,jsx}" if you use rootDir, because <rootDir>/File.tsx does not match **/*.tsx.

I also added an example.

jest/examples/react/package.json

Lines 17 to 37 in 6281cfb

	"jest": {
	"rootDir": "src",
	"testMatch": [
	"<rootDir>/**/*.test.{ts,tsx,js,jsx}",
	"<rootDir>/*.test.{ts,tsx,js,jsx}"
	],
	"moduleFileExtensions": [
	"ts",
	"tsx",
	"js",
	"jsx",
	"json",
	"node"
	],
	"transform": {
	"^.+\\.(t|j)sx?$": [
	"../../.."
	]
	},
	"testEnvironment": "node"
	},

[poteirard]

Hey @kdy1 thanks for your fast reply.

I tried the same config and got this error:

● Validation Error:

  Module ../../.. in the transform option was not found.
         <rootDir> is: /Users/gerard.brull/DEV/react-components/src

  Configuration Documentation:
  https://jestjs.io/docs/configuration.html

[kdy1]

You should use @swc/jest instead of ../../...

Example uses local dependency to check if current version works properly

[poteirard]

ah yes! I'm stupid 😅 sorry about that!

[kdy1]

No problem

[poteirard]

I'm spiking on migrating react-scripts with react-stylegudist to SWC in case someone is interested in this ZopaPublic/react-components#591