gtsop / babel-jest-boost

🐠 🃏 🚀 - Brings tree-shaking to Jest, speeding up your test runs, using Babel
GNU Affero General Public License v3.0
9 stars 1 forks source link

How to use this lib? #6

Open OZZlE opened 6 days ago

OZZlE commented 6 days ago

Our jest.config.ts:

import type { Config } from "jest";

// Add any custom config to be passed to Jest
const config: Config = {
  preset: "ts-jest",
  testEnvironment: "jest-environment-jsdom",
  transform: {
    "^.+\\.(js|jsx|ts|tsx)$": "ts-jest",
  },
  coverageProvider: "v8",
  collectCoverage: true,
  roots: ["./src"],
  testTimeout: 20000,
  moduleDirectories: ["node_modules", "src"],
  moduleNameMapper: {
    "^~(.*)$": "<rootDir>/src/$1",
  },
  collectCoverageFrom: ["./src/**/*.ts", "./src/**/*.tsx"],
  coveragePathIgnorePatterns: [".*types.*", ".*d.ts", "main.tsx"],
  setupFilesAfterEnv: ["<rootDir>/jest.setup.ts"],
};
export default config;

You seem to STILL be using require for some reason?

I tried this without luck:

// import type { Config } from "jest";
import { jestConfig } from "@gtsopanoglou/babel-jest-boost/config";
const babelJestBoostPluginPath = import('@gtsopanoglou/babel-jest-boost/plugin');

// Add any custom config to be passed to Jest
const config: typeof jestConfig = {
  modulePaths: [],
  preset: "ts-jest",
  testEnvironment: "jest-environment-jsdom",
  transform: {
    "^.+\\.(js|jsx|ts|tsx)$": "ts-jest",
  },
  coverageProvider: "v8",
  collectCoverage: true,
  roots: ["./src"],
  testTimeout: 20000,
  moduleDirectories: ["node_modules", "src"],
  moduleNameMapper: {
    "^~(.*)$": "<rootDir>/src/$1",
  },
  collectCoverageFrom: ["./src/**/*.ts", "./src/**/*.tsx"],
  coveragePathIgnorePatterns: [".*types.*", ".*d.ts", "main.tsx"],
  setupFilesAfterEnv: ["<rootDir>/jest.setup.ts"],
  plugins: [
    [
      babelJestBoostPluginPath,
      { jestConfig, /* babel-jest-boost options */ }
    ]
  ]
};
export default config;
gtsop-d commented 5 days ago

Hello @OZZlE , this library assumes you have a transformer file setup. You are correct that the instructions should be enhanced to help users without such a file. Here is a walk through:

  1. This plugin works on top of babel-jest (thus the name babel-jest-boost).

If you take a look at the babel-jest configuration you will see that you need to add a "transform" key to your jest.config.js https://www.npmjs.com/package/babel-jest

"transform": {
  "\\.[jt]sx?$": "babel-jest"
},

This tells jest to use babel-jest to transpile the javascript.

  1. Since many people use extra configuration on this step, it is common to declare a custom file to handle this logic

For instance:

"transform": {
  "\\.[jt]sx?$": "<rootDir>/config/jest/babelTransform.js"
}

And the contents of babelTransform.js can be:

const { jestConfig } = require('@gtsopanoglou/babel-jest-boost/config');
const babelJest = require('babel-jest').default;

module.exports = babelJest.createTransformer({
  plugins: [
    [
      require.resolve('@gtsopanoglou/babel-jest-boost'),
      {
        jestConfig,
        importIgnorePatterns: [

        ],
      },
    ],
  ],
  babelrc: false,
  configFile: false,
});
gtsop-d commented 5 days ago

I will have a look into changing the default export of this plugin such that you can use a simple:

"transform": {
  "\\.[jt]sx?$": "babel-jest-boost"
},

However i expect most people to need to add some ignore patterns, so it probably won't be heavily used. It will be a good step towards initial integration though.