question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. ItĀ collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

babel-jest doesn't transform my component file

See original GitHub issue

šŸ› Bug Report

I use Jest, Babel-Jest, Enzyme, Enzyme-adapter-react-16 test my components, our repo use lerna monorepo and yarn workspaces.

When babel-jest process my component file(ie: ā€˜lib/components/accordion/index.js’), babelOptions doesn’t have @babel/preset-env and @babel/preset-react.

Jest report error: ā€˜Jest encountered an unexpected token’, detail message is:

/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import classNames from 'classnames';
                                                                                         ^^^^^^

SyntaxError: Cannot use import statement outside a module

  1 | import React from 'react'
  2 | import { shallow } from 'enzyme'
> 3 | import AtAccordion from '../../lib/components/accordion'
    | ^
  4 |
  5 | describe('AtAccordion Component', () => {
  6 |   it('render initial AtAccordion', () => {

  at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1086:14)
  at Object.<anonymous> (packages/taro-ui/test/components/accordion.test.js:3:1)

There is my config:

babel.config.json on project root
{
  "babelrcRoots": [
    "packages/*"
  ],
  "overrides": [
    {
      "include": "packages/taro-ui-docs/**",
      "presets": [
        [
          "@babel/preset-env",
          {
            "spec": true,
            "modules": false,
            "targets": {
              "browsers": [
                "ie >= 9",
                "Chrome >= 21",
                "Firefox >= 1",
                "Edge >= 13",
                "last 3 versions"
              ]
            },
            "loose": false,
            "forceAllTransforms": true,
            "useBuiltIns": "entry",
            "corejs": "3.6"
          }
        ],
        "@babel/preset-react"
      ],
      "plugins": [
        "@babel/plugin-syntax-dynamic-import",
        "@babel/plugin-proposal-class-properties"
      ]
    },
    {
      "include": "packages/taro-ui/test/**",
      "presets": [
        [
          "@babel/preset-env",
          {
            "debug": false,
            "targets": {
              "node": true
            },
            "modules": "commonjs",
            "forceAllTransforms": true
          }
        ],
        "@babel/preset-react"
      ],
      "plugins": [
        "@babel/plugin-transform-modules-commonjs",
        [
          "@babel/plugin-proposal-class-properties",
          {
            "loose": true
          }
        ]
      ]
    }
  ]
}
jest.config.js on project root
// path: jest.config.js
module.exports = {
  verbose: true,
  rootDir: __dirname,
  projects: ['<rootDir>/packages/*/jest.config.js']
}
jest.config.js on package taro-ui
// path: packages/taro-ui/jest.config.js
const pack = require('./package.json')
module.exports = {
  verbose: true,
  displayName: pack.name,
  name: pack.name,
  rootDir: '../..',
  testMatch: [
    `<rootDir>/packages/${pack.name}/test/**/*.test.js`,
    `<rootDir>/packages/${pack.name}/test/**/test.js`
  ],
  transform: {
    '^.+\\.jsx?$': [
      'babel-jest',
      {
        rootMode: 'upward'
      }
    ]
  },
  transformIgnorePatterns: [
    '<rootDir>/node_modules/(?!(@tarojs/api|@tarojs/components)/)'
  ],
  moduleNameMapper: {
    '@tarojs/components': '<rootDir>/node_modules/@tarojs/components/h5/react'
  },
  setupFilesAfterEnv: [
    `<rootDir>/packages/${pack.name}/test/setup/setupEnzyme.js`
  ],
  coverageDirectory: `<rootDir>/packages/${pack.name}/coverage`
}
setupEnzyme.js on package taro-ui
// path: packages/taro-ui/test/setup/setupEnzyme.js
import Enzyme from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'
Enzyme.configure({
  adapter: new Adapter()
})
accordion.test.js on package taro-ui
// path: packages/taro-ui/test/components/accordion.test.js
import React from 'react'
import { shallow } from 'enzyme'
import AtAccordion from '../../lib/components/accordion'
describe('AtAccordion Component', () => {
  it('render initial AtAccordion', () => {
    const component = shallow(<AtAccordion />)
    expect(component).toMatchSnapshot()
  })
  // ... more comments
})

There is my terminal outputs:

Jest error message
 FAIL   taro-ui  packages/taro-ui/test/components/accordion.test.js
  ā— Test suite failed to run
    Jest encountered an unexpected token
    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html
    Details:
    /Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import classNames from 'classnames';
                                                                                  ^^^^^^
    SyntaxError: Cannot use import statement outside a module
      1 | import React from 'react'
      2 | import { shallow } from 'enzyme'
    > 3 | import AtAccordion from '../../lib/components/accordion'
        | ^
      4 |
      5 | describe('AtAccordion Component', () => {
      6 |   it('render initial AtAccordion', () => {
      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1086:14)
      at Object.<anonymous> (packages/taro-ui/test/components/accordion.test.js:3:1)
Jest debug output
{
  "configs": [
    {
      "automock": false,
      "browser": false,
      "cache": false,
      "cacheDirectory": "/private/var/folders/g6/zyb7hl6x40784yndwsl_qfnh0000gn/T/jest_dx",
      "clearMocks": false,
      "coveragePathIgnorePatterns": [
        "/node_modules/"
      ],
      "cwd": "/Users/hagongyi/Projects/GitHub/taro-ui",
      "detectLeaks": false,
      "detectOpenHandles": false,
      "displayName": {
        "color": "white",
        "name": "taro-ui"
      },
      "errorOnDeprecated": false,
      "extraGlobals": [],
      "forceCoverageMatch": [],
      "globals": {},
      "haste": {
        "computeSha1": false,
        "providesModuleNodeModules": [],
        "throwOnModuleCollision": false
      },
      "moduleDirectories": [
        "node_modules"
      ],
      "moduleFileExtensions": [
        "js",
        "json",
        "jsx",
        "ts",
        "tsx",
        "node"
      ],
      "moduleNameMapper": [
        [
          "@tarojs/components",
          "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@tarojs/components/h5/react"
        ]
      ],
      "modulePathIgnorePatterns": [],
      "name": "taro-ui",
      "prettierPath": "prettier",
      "resetMocks": false,
      "resetModules": false,
      "restoreMocks": false,
      "rootDir": "/Users/hagongyi/Projects/GitHub/taro-ui",
      "roots": [
        "/Users/hagongyi/Projects/GitHub/taro-ui"
      ],
      "runner": "jest-runner",
      "setupFiles": [],
      "setupFilesAfterEnv": [
        "/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/setup/setupEnzyme.js"
      ],
      "skipFilter": false,
      "snapshotSerializers": [],
      "testEnvironment": "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/jest-environment-jsdom/build/index.js",
      "testEnvironmentOptions": {},
      "testLocationInResults": false,
      "testMatch": [
        "/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/**/*.test.js",
        "/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/**/test.js"
      ],
      "testPathIgnorePatterns": [
        "/node_modules/"
      ],
      "testRegex": [],
      "testRunner": "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/jest-jasmine2/build/index.js",
      "testURL": "http://localhost",
      "timers": "real",
      "transform": [
        [
          "^.+\\.jsx?$",
          "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-jest/build/index.js",
          {
            "rootMode": "upward"
          }
        ]
      ],
      "transformIgnorePatterns": [
        "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/(?!(@tarojs/api|@tarojs/components)/)"
      ],
      "watchPathIgnorePatterns": []
    }
  ],
  "globalConfig": {
    "bail": 0,
    "changedFilesWithAncestor": false,
    "collectCoverage": false,
    "collectCoverageFrom": [],
    "coverageDirectory": "/Users/hagongyi/Projects/GitHub/taro-ui/coverage",
    "coverageProvider": "babel",
    "coverageReporters": [
      "json",
      "text",
      "lcov",
      "clover"
    ],
    "detectLeaks": false,
    "detectOpenHandles": false,
    "errorOnDeprecated": false,
    "expand": false,
    "findRelatedTests": false,
    "forceExit": false,
    "json": false,
    "lastCommit": false,
    "listTests": false,
    "logHeapUsage": false,
    "maxConcurrency": 5,
    "maxWorkers": 3,
    "noStackTrace": false,
    "nonFlagArgs": [
      "./test/components/accordion.test.js"
    ],
    "notify": false,
    "notifyMode": "failure-change",
    "onlyChanged": false,
    "onlyFailures": false,
    "passWithNoTests": false,
    "projects": [
      "/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/jest.config.js"
    ],
    "rootDir": "/Users/hagongyi/Projects/GitHub/taro-ui",
    "runTestsByPath": false,
    "skipFilter": false,
    "testFailureExitCode": 1,
    "testPathPattern": "./test/components/accordion.test.js",
    "testSequencer": "/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@jest/test-sequencer/build/index.js",
    "updateSnapshot": "new",
    "useStderr": false,
    "verbose": true,
    "watch": false,
    "watchAll": false,
    "watchman": true
  },
  "version": "25.3.0"
}
Full terminal outputs(with some console.log on babel-jest/build/index.js file)
~/Projects/GitHub/taro-ui [test-fix +0 ~2 -0 !]> yarn jest --no-cache ./test/components/accordion.test.js
yarn run v1.22.4
$ /Users/hagongyi/Projects/GitHub/taro-ui/node_modules/.bin/jest --no-cache ./test/components/accordion.test.js
 FAIL   taro-ui  packages/taro-ui/test/components/accordion.test.js
  ā— Test suite failed to run
    Jest encountered an unexpected token
    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html
    Details:
    /Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import classNames from 'classnames';
                                                                                  ^^^^^^
    SyntaxError: Cannot use import statement outside a module
      1 | import React from 'react'
      2 | import { shallow } from 'enzyme'
    > 3 | import AtAccordion from '../../lib/components/accordion'
        | ^
      4 |
      5 | describe('AtAccordion Component', () => {
      6 |   it('render initial AtAccordion', () => {
      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1086:14)
      at Object.<anonymous> (packages/taro-ui/test/components/accordion.test.js:3:1)

fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/setup/setupEnzyme.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/setup/setupEnzyme.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn process ---> filename: /Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/setup/setupEnzyme.js
fn process ---> babelOptions: {"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/setup/setupEnzyme.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]}
fn process ---> END!
fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/components/accordion.test.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/components/accordion.test.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn process ---> filename: /Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/components/accordion.test.js
fn process ---> babelOptions: {"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/test/components/accordion.test.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-transform-modules-commonjs","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-transform-modules-commonjs/lib/index.js"}},{"options":{"loose":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/plugin-proposal-class-properties","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/plugin-proposal-class-properties/lib/index.js"}}],"presets":[{"options":{"debug":false,"targets":{"node":true},"modules":"commonjs","forceAllTransforms":true},"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-env","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-env/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"@babel/preset-react","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/@babel/preset-react/lib/index.js"}},{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]}
fn process ---> END!
fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[],"presets":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn loadBabelConfig ---> babelConfig: {"options":{"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[],"presets":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]},"config":"/Users/hagongyi/Projects/GitHub/taro-ui/babel.config.json"}
fn process ---> filename: /Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js
fn process ---> babelOptions: {"babelrcRoots":["packages/*"],"cwd":"/Users/hagongyi/Projects/GitHub/taro-ui","rootMode":"upward","caller":{"name":"babel-jest","supportsDynamicImport":false,"supportsStaticESM":false},"compact":false,"sourceMaps":"both","filename":"/Users/hagongyi/Projects/GitHub/taro-ui/packages/taro-ui/lib/components/accordion/index.js","babelrc":false,"configFile":false,"passPerPreset":false,"envName":"test","root":"/Users/hagongyi/Projects/GitHub/taro-ui","plugins":[],"presets":[{"dirname":"/Users/hagongyi/Projects/GitHub/taro-ui","file":{"request":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js","resolved":"/Users/hagongyi/Projects/GitHub/taro-ui/node_modules/babel-preset-jest/index.js"}}]}
fn process ---> END!
Test Suites: 1 failed, 1 total Tests: 0 total Snapshots: 0 total Time: 7.55s Ran all test suites matching /.\/test\/components\/accordion.test.js/i. error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

To Reproduce

Steps to reproduce the behavior:

  1. clone repo(in the below).

  2. install dependencies, just run yarn install

  3. build components, run yarn build:component

  4. run yarn jest --debug --no-cache ./test/components/accordion.test.js

Expected behavior

When process component file, babelOptions have @babel/preset-env and @babel/preset-react.

Link to repl or repo (highly encouraged)

Sorry about that, no minimal repo.

https://github.com/Garfield550/taro-ui/tree/test-fix

envinfo

  System:
    OS: macOS 10.15.4
    CPU: (4) x64 Intel(R) Core(TM) i7-5557U CPU @ 3.10GHz
  Binaries:
    Node: 13.12.0 - /usr/local/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6

github_iconTop GitHub Comments

2reactions
SimenBcommented, Apr 15, 2020

You have an error in your configuration. You can install @babel/cli and see that your component isn’t transformed:

$ cd packages/taro-ui
$ yarn add @babel/cli
$ yarn babel --root-mode upward ./lib/components/accordion/index.js

You can see from the output import is not transpiled. This diff fixes it

diff --git i/babel.config.json w/babel.config.json
index ad4be72..db68e79 100644
--- i/babel.config.json
+++ w/babel.config.json
@@ -34,7 +34,7 @@
       ]
     },
     {
-      "include": "packages/taro-ui/test/**",
+      "include": "packages/taro-ui/**",
       "presets": [
         [
           "@babel/preset-env",

Which makes sense, as you’ve not told babel to transpile any files in packages/taro-ui/lib. Not sure if that’s correct or not for you, but your issue is that you’ve misconfigured Babel - it’s not a bug in Jest (or Babel for that matter, it’s doing what you ask it to do).

0reactions
github-actions[bot]commented, May 11, 2021

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please note this issue tracker is not a help forum. We recommend using StackOverflow or our discord channel for questions.

Read more comments on GitHub >

github_iconTop Results From Across the Web

babel-jest doesn't handle ES6 within modules - Stack Overflow
Here is an example config file which tells babel to transpile modules ... Then, when running your Jest tests on the command line...
Read more >
Configuring Jest
To read TypeScript configuration files Jest requires ts-node . Make sure it is installed in your project. The configuration also can be storedĀ ......
Read more >
Unit Testing - Gatsby
Unit testing is a great way to protect against errors in your code before you ... The transform section tells Jest that all...
Read more >
babel/plugin-transform-classes
For this reason, the "mixin pattern" doesn't work: class Foo extends mixin(Array) {} function mixin(Super) { return class extends Super { mix() {}...
Read more >
How to configure Jest testing framework for Laravel Mix
Now, this is a file that babel-jest will pick up automatically when doing transformations. However, this won't work because while WebpackĀ ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found