我正在使用 React、JSX、ES6 和 Karma。
有人知道我的代码有什么问题吗?
我正在尝试使用 Karma-Runner 通过此测试但出了点问题:
let React = require("react");
let TestUtils = React.addons.TestUtils;
let expect = require("expect");
/* global describe */
/* global it */
describe("Header", function () {
it("renders without problems", function () {
let component = <Header/>;
let header = TestUtils.renderIntoDocument(component);
expect(header).toExist();
});
});
在$ karma start
命令之后,这是错误:
Module build failed: SyntaxError: /Users/aralroca/react-es6-boilerplate/app/tests/components/header.test.js: Unexpected token (9:20)
7 | describe("Header", function () {
8 | it("renders without problems", function () {
> 9 | let component = <Header/>;
| ^
10 | let header = TestUtils.renderIntoDocument(component);
11 |
12 | expect(header).toExist();
非常感谢。
<小时/>已编辑
karma.conf.js
module.exports = function (config) {
config.set({
browsers: [ process.env.CONTINUOUS_INTEGRATION ? "Firefox" : "Chrome" ],
files: [
"tests.bundle.js"
],
frameworks: ["chai", "mocha"],
plugins: [
"karma-chrome-launcher",
"karma-chai",
"karma-mocha",
"karma-sourcemap-loader",
"karma-webpack"
],
preprocessors: {
"tests.bundle.js": ["webpack", "sourcemap"]
},
reporters: ["dots"],
singleRun: true,
webpack: {
devtool: "inline-source-map",
module: {
loaders: [
{
exclude: /node_modules/,
loader: "babel-loader",
test: /\.jsx?$/
}
]
}
},
webpackMiddleware: {
noInfo: true
}
});
};
最佳答案
如果您想在测试中使用 JSX,您需要连接 karma-babel-preprocessor .
这将在执行前运行 babel 来转译测试。否则,当 karma 运行测试时,ES6 或 JSX 语法将导致错误。
关于javascript - 单元测试 React JSX ES6,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35956667/