[英]How do I apply Chai plugins across bundles in Karma?
I'm running tests using Karma + Mocha + Chai + Webpack. 我正在使用Karma + Mocha + Chai + Webpack运行测试。 I'm want apply multiple Chai plugins to my tests.
我想在我的测试中应用多个Chai插件。 I'm using the Karma config below, which splits my tests into multiple bundles.
我正在使用下面的Karma配置,它将我的测试分成多个捆绑包。
I tried to use karma-chai
to create a global chai
instance, then load code that applied the plugins to the global instance. 我尝试使用
karma-chai
创建一个全局chai
实例,然后加载将插件应用于全局实例的代码。 (See CHAI_CONFIG_PATH
and plugins.config.js
): (参见
CHAI_CONFIG_PATH
和plugins.config.js
):
// karma.config.babel.js
import WEBPACK_CONFIG from '../webpack/webpack.config.test';
const TESTS_PATH = 'src/**/*.test.js';
const CHAI_CONFIG_PATH = 'config/chai/*.js';
export default function(config) {
config.set({
autoWatch: false,
singleRun: !autoWatch,
browsers: ['PhantomJS'],
basePath: '../..',
frameworks: ['mocha', 'chai'],
files: [
require.resolve('babel-polyfill'),
CHAI_CONFIG_PATH
TESTS_PATH
],
preprocessors: {
[require.resolve('babel-polyfill')]: ['webpack'],
[CHAI_CONFIG_PATH]: ['webpack'],
[TESTS_PATH]: ['webpack', 'sourcemap']
},
webpack: WEBPACK_CONFIG,
webpackMiddleware: {
noInfo: true
},
reporters: ['mocha'],
logLevel: config.LOG_INFO
});
}
Apply chai plugins: 应用chai插件:
// config/chai/plugins.config.js
import chaiImmutable from 'chai-immutable';
import chaiEnzyme from 'chai-enzyme';
import chaiSinon from 'chai-sinon';
chai.use(chaiImmutable);
chai.use(chaiEnzyme());
chai.use(chaiSinon);
Vanilla Webpack config: Vanilla Webpack配置:
// webpack.config.tests.js
export default {
module: {
rules: [
BABEL_LOADER,
CSS_LOADER,
CSS_LOADER_GLOBALS,
JSON_LOADER,
MEDIA_FILE_LOADER,
MEDIA_URL_LOADER
]
},
plugins: [
DEFINE_PLUGIN,
EXTRACT_TEXT_PLUGIN
],
devtool: 'inline-source-map'
};
That worked until I added chai-enzyme
. 这有效,直到我加入
chai-enzyme
。 config/chai/plugins.config.js
runs in it's own bundle, which loads enzyme
. config/chai/plugins.config.js
在它自己的bundle中运行,它加载了enzyme
。 My tests are ran in another bundle, which loads enzyme
again. 我的测试是在另一个捆绑中运行,再次加载
enzyme
。 The two enzyme
s aren't the same. 这两种
enzyme
不一样。 chai-enzyme
runs wrap(myShallowWrapper)
on every assertion, but el instanceof ShallowWrapper
is false. chai-enzyme
在每个断言上运行wrap(myShallowWrapper)
,但是el instanceof ShallowWrapper
是假的。
// chai-enzyme/src/wrap.js
export default function wrap (el) {
if (el instanceof ShallowWrapper) {
return new ShallowTestWrapper(el)
}
...
}
I want to keep the bundles separate to make developing tests easier. 我希望将捆绑包分开以使开发测试更容易。 The only fix I found was to import
plugins.config.js
at the top of every test file, but this seems hacky. 我发现的唯一修复是在每个测试文件的顶部导入
plugins.config.js
,但这看起来很糟糕。 Is there a configuration that would let me apply Chai plugins to every bundle? 是否有配置允许我将Chai插件应用于每个捆绑包?
I had a similar problem. 我遇到了类似的问题。 I did not find a perfect solution, but at least a workaround for my case:
我没有找到一个完美的解决方案,但至少我的案例有一个解决方法:
I built my own wrapper around the expect import that needs to be included in any test case anyway. 我围绕期望导入构建了自己的包装器,无论如何都需要包含在任何测试用例中。 That way I can configure all my used chai plugins in a central place:
这样我可以在一个中心位置配置我所有使用过的chai插件:
// my-expect.ts:
import {expect as _expect} from 'chai';
import * as chai from 'chai';
chai.use(require('chai-things'));
chai.use(require('chai-string'));
export const expect = _expect;
In my tests now I simply replace the former import {expect} from 'chai'
by import {expect} from './my-expect'
to use all the plugins I included there: 在我的测试中,我现在简单地
import {expect} from './my-expect'
import {expect} from 'chai'
替换import {expect} from 'chai'
的前import {expect} from 'chai'
以使用我在其中包含的所有插件:
// my_spec.ts
import {expect} from './my-expect';
it('should use chai-things', () => {
expect([5, 7, 9]).to.all.be.above(4);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.