configure react jest scaffold with vite

babel.config.js

module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        targets: {
          esmodules: true,
        },
      },
    ],
    '@babel/preset-react'
  ],
};

jest-transform-stub.js

module.exports = {
    process() {
        return 'module.exports = {};';
    },
    getCacheKey() {
        // The output is always the same.
        return 'stubTransform';
    },
};

package.json

{
  "name": "superduper",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "serve": "vite preview",
    "test:unit": "jest"
  },
  "dependencies": {
    "react": "^17.0.0",
    "react-dom": "^17.0.0"
  },
  "jest": {
    "testEnvironment": "jsdom",
    "setupFilesAfterEnv": ["./setupTests.js"],
    "transform": {
      "^.+\\.jsx?$": "babel-jest",
      "^.+\\.(svg|css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$": "./jest-transform-stub.js"
    }
  },
  "devDependencies": {
    "@babel/preset-env": "^7.16.0",
    "@babel/preset-react": "^7.16.0",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.0.2",
    "@vitejs/plugin-react": "^1.0.0",
    "babel-jest": "^27.3.1",
    "jest": "^27.3.1",
    "vite": "^2.6.4"
  }
}

setupTests.js

import React from 'react'

global.React = React