reactjs - 用 enzyme : Unexpected token in mount() 测试

Question

我正在尝试进行 enzyme 测试以进行 react 。

我做了一个简单的测试，安装一个导入组件并检查状态:

import React from 'react';
import { expect } from 'chai';
import { mount } from 'enzyme';

import WorkOutForm  from './workOutForm';

describe('<WorkOutForm>', () => {
    describe('workoutForm component', () => {
      it('should start a new workoutForm with empty state', () => {
        const component = mount(<WorkOutForm />);

        expect(component).toEqual({})
        expect(component.state().tempoGasto).toEqual(null)
        expect(component.state().tipoAtividade).toEqual(null)
        expect(component.state().data).toEqual(null)
        component.unmount()
      })
    })
})

但是当我运行时 npm run test我得到:

Jest encountered an unexpected token const component = mount()

我试着像 doc但我看不到我的错误。

Obs:我按照 Jest 开始，然后运行:

npm i --save babel-jest @babel/core @babel/preset-env --dev

我在根目录中添加了一个 babel.config.js 文件，内容如下:

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

这是我的 webpack:

    module: {
        loaders: [{
            test: /.js[x]?$/,
            loader: 'babel-loader',
            exclude: /node_modules/,
            query: {
                presets: ['es2015', 'react', '@babel/preset-env'],
                plugins: ['transform-object-rest-spread']
            }
        }, {
            test: /\.css$/,
            loader: ExtractTextPlugin.extract('style-loader', 'css-loader')
        }, {
            test: /\.woff|.woff2|.ttf|.eot|.svg*.*$/,
            loader: 'file'
        },



    ]
}

Answer 1

请尝试在您的 package.json jest 配置中添加以下内容:

"transform": {
  "\\.js$": "<rootDir>/node_modules/babel-jest"
},

确保您安装了 babel-jest先打包