首页 文章

在jest测试中，酶.hallow抛出意外的令牌<错误

提问于
浏览 次
1

我目前正在使用以下堆栈设置单元测试：

  • react（v15）组件使用typescript（.tsx）编写

  • 测试设置用jest（v21）和酶（v3）完成

  • 测试文件被写为普通的js文件

不幸的是，由于我不断出现错误，酶似乎出现了问题：

wrapper = enzyme.shallow(<Stepper>bla</Stepper>)
                             ^

SyntaxError: Unexpected token <

  at new Script (vm.js:51:7)
      at Generator.next (<anonymous>)
      at new Promise (<anonymous>)

Test Suites: 1 failed, 1 total

相应的测试文件如下所示：

var React = require('react');
var enzyme = require('enzyme');
var Stepper = require('./Stepper').default;

var wrapper;

describe('Stepper', () => {
  beforeEach(() => {
    wrapper = enzyme.shallow(<Stepper>bla</Stepper>)
  });

  test('has bla', () => {
    expect(wrapper.contains('bla')).toBeTruthy();
  });
});

我在package.json中配置了jest：

"jest": {
  "transform": {
    "^.+\\.(tsx|ts)$": "typescript-babel-jest"
  },
  "moduleFileExtensions": [
    "ts",
    "tsx",
    "js"
  ],
  "testMatch": [
    "<rootDir>/src/**/**/*.test.js"
  ],
  "moduleNameMapper": {
    "\\.(css|scss)$": "identity-obj-proxy"
  },
  "setupTestFrameworkScriptFile": "<rootDir>/setupTests.js"
}

我的setupTests.js文件如下所示：

var enzyme = require('enzyme');
var Adapter = require('enzyme-adapter-react-15');

enzyme.configure({ adapter: new Adapter() });

我的想法可能会导致问题，有没有人知道解决方案？

javascript reactjs typescript enzyme jest

1 回答

  • 0

    你需要你的测试文件由babel转换，因为它包含 jsx . 使用jsx需要导入React并由babel转换文件 .

    目前，您只在 package.json 中定义以 .tsx 或 .ts 结尾的文件 . 添加 .js ，因为您的测试文件在 .js 结束：

    "transform": {
    "^.+\\.(tsx|ts|js)$": "typescript-babel-jest"
  },

    或者，在typescript中编写测试文件，并使用 .tsx 作为文件结尾 .

    回复于

相关问题