Jest setup with JavaScript

# jest setup
npm i -D @testing-library/react jest @testing-library/jest-dom
npm i -D jest-environment-jsdom
npm i -D @babel/preset-env @babel/preset-react

# create .babelrc
{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": []
}

# create file mocks/style_mock.js
module.exports = "";

# create file mocks/file_mock.js
module.exports = "";

# create file src/setupTests.ts
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import "@testing-library/jest-dom";

# create file jest.config.js
module.exports = {
  testEnvironment: "jsdom",
  setupFilesAfterEnv: ["<rootDir>/src/setupTests.js"],
  globals: {
    APP_NAME: "Demo",
  },
  collectCoverage: true,
  collectCoverageFrom: ["src/**/*.js", "src/**/*.jsx"],
  coverageDirectory: "<rootDir>/coverage/",
  coveragePathIgnorePatterns: [
    "<rootDir>/src/index.js",
    "<rootDir>/src/reportWebVitals.js",
  ],
  moduleNameMapper: {
    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
      "<rootDir>/mocks/file_mock.js",
    "\\.(css|less)$": "<rootDir>/mocks/style_mock.js"
  },
};

# package.json
 "scripts": {
    ...
    "test": "jest",
    "test:coverage": "jest --coverage"
  }