我使用Chai的Expect库测试我的React项目(测试实用程序)并使用Karma(测试运行器)运行测试。
我的工作项目目录结构如下所示: app - >组件 - >按钮 - > __test - > test.jsx
Karma在上面找到测试并运行成功没有问题。
有问题的目录结构如下所示: app - >组件 - >清单 - > ListHeader - > __test - > test.jsx
如果Karma位于组件的子目录中,则它不会接受测试。
我已设置autoWatch=true
,在karma.config
中添加了路径,并在互联网上查找线索/提示/解决方案,但没有运气。如果它有帮助,我已添加了karma.config
文件。
感谢您抽出宝贵时间来研究这个问题!
const webpack = require('webpack')
const argv = require('yargs').argv
const path = require('path')
const aliases = require('./webpack/alias')
const config = require('./webpack/settings')
const loaders = require('./webpack/loaders')
const preloaders = require('./webpack/preloaders')
const karmaConfig = (config) => {
config.set({
// only use PhantomJS for our 'test' browser
browsers: ['PhantomJS'],
// just run once by default unless --watch flag is passed
singleRun: !argv.watch,
// Enable or disable colors in the output (reporters and logs)
colors: true,
// which karma frameworks do we want integrated
frameworks: ['mocha', 'chai', 'sinon'],
// displays tests in a nice readable format
reporters: ['spec'],
// include some polyfills for babel and phantomjs
files: [
'./node_modules/babel-polyfill/dist/polyfill.js',
'./node_modules/phantomjs-polyfill/bind-polyfill.js',
'./app/**/**/__test/test.jsx', // specify files to watch for tests
'./app/**/**/__test/test.js', // specify files to watch for tests
'./app/**/**/**/__test/test.jsx', // specify files to watch for tests
'./app/**/**/**/__test/test.js' // specify files to watch for tests
],
preprocessors: {
// these files we want to be precompiled with webpack
// also run tests throug sourcemap for easier debugging
['./app/**/**/__test/*']: ['webpack', 'sourcemap']
},
// A lot of people will reuse the same webpack config that they use
// in development for karma but remove any production plugins like UglifyJS etc.
// I chose to just re-write the config so readers can see what it needs to have
webpack: {
devtool: 'inline-source-map',
resolve: {
// allow us to import components in tests like:
// import Example from 'components/Example';
root: path.resolve(__dirname, './app'),
// allow us to avoid including extension name
extensions: ['', '.js', '.jsx'],
// required for enzyme to work properly
alias: aliases
},
module: {
// don't run babel-loader through the sinon module
noParse: [
/sinon(\\|\/)pkg(\\|\/)sinon\.js/
],
// run babel loader for our tests
// preLoaders: preloaders,
loaders: loaders,
},
// required for enzyme to work properly
externals: {
'jsdom': 'window',
'cheerio': 'window',
'react-dom/server': 'window',
'text-encoding': 'window',
'react/addons': true,
'react/lib/ExecutionEnvironment': true,
'react/lib/ReactContext': 'window'
},
},
webpackMiddleware: {
noInfo: true,
stats: {
colors: true,
chunks: false
}
},
// tell karma all the plugins we're going to be using to prevent warnings
plugins: [
'karma-*'
],
autoWatch: true
})
}
module.exports = karmaConfig
答案 0 :(得分:0)
这是globbing中的一个已知问题:
最后,主要原因似乎是我在karma.config中使用了一个glob模式,它在一个文件夹中包含一个双星号(* /),而且深度超过了第二级。
然后设法通过直接使用node-glob复制错误,以生成相同的错误。
最后,使用glob.sync路由,并自己构建URL数组解决了这个问题。希望这能让作者了解他能做些什么来解决问题。干杯
使用jsdom和glob作为替代方案。例如:
const glob = require('glob');
const jsdom = require('jsdom');
const chai = require('chai');
global.document = jsdom.jsdom();
global.window = document.defaultView;
global.navigator = window.navigator || {};
global.Node = window.Node;
global.addEventListener = window.addEventListener;
global.MouseEvent = window.MouseEvent;
global.KeyboardEvent = window.KeyboardEvent;
global.Event = window.Event;
global.btoa = window.btoa;
global.FormData = window.FormData;
global.FileReader = window.FileReader;
global.File = window.File;
window.beforeEach = global.beforeEach;
window.afterEach = global.afterEach;
window.before = global.before;
window.after = global.after;
window.mocha = true;
<强>参考强>