React-markdown + typescript + jest

Get Help and Help Others
7

There is too much config involved, when trying to switch to vitest. I can manage to run vitest as cli by changing cli/src/commands/testHandler.js , but both web and api side have jest.config.js with redwood presets and they are going bit too deep - calling another jest.setup.js with beforeAll etc for scenarios etc. I assume.

Now I also tried swc and esbuild as transformers. I think swc is better supported. @swc/jest – SWC
We can keep the jest configs, but speed up the transformers.The config could be as easy as:

const config = {
  rootDir: '../',
  preset: '@redwoodjs/testing/config/jest/web',
  "transform": {
    "^.+\\.tsx?$": "@swc/jest"
  }
}

But since neither swc nor esbuild pickup tsconfig properly (vite is normally doing it for esbuild), paths are not properly recognised. I had to do moduleNameMapping to copy the paths from tsconfig to jest.config. However there were new issues appearing i.e. the magic Cell imports would not be recognised. Meaning “src/components/PostCell” would not lead to “src/components/PostCell/PostCell”. Afterwards I was facing the next issue with path resolving.

const config = {
  rootDir: '../',
  preset: '@redwoodjs/testing/config/jest/web',
  moduleNameMapper: {
    '^src/(.*)(/.*Cell)': ['<rootDir>/web/src/$1$2$2'],
    '^src/(.*)(/.*Layout)': ['<rootDir>/web/src/$1$2$2'],
    '^src/(.*)': [
      '<rootDir>/web/src/$1',
      '<rootDir>/.redwood/types/mirror/web/src/$1',
      '<rootDir>/api/src/$1',
      '<rootDir>/.redwood/types/mirror/api/src/$1',
    ],
    '$api/(.*)': ['<rootDir>/api/$1'],
    '^types/(.*)': ['./types/$1', '<rootDir>/types/$1'],
    '@redwoodjs/testing': ['<rootDir>/node_modules/@redwoodjs/testing/web'],
  },
  transform: {
    '^.+\\.tsx?$': '@swc/jest',
  },
}

So unfortunately we are still facing the issue of not being able to test ESM modules. I would be really happy to hear how to solve this, since there are quite some libraries who are esm only already, and currently this does not allow me to test my web side or use certain libraries on api side.
Its a guess, but removing all the tsconfig path magic might open the way to use swc as well as packages/workspaces (another obstacle to share i.e. zod validations on web and api side…).

Hoping to hear some ideas on the ESM issue :confused: