用酶测试：mount()中的意外标记

Question

我想在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遇到一个意外的标记 const component = mount()

我努力让自己像 文档 但我看不到我的错误。

观察：我按照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"
},

确保你安装了 拐子 包先