Karma Config: Web
Generates a Karma configuration for testing using Puppeteer.
Quickstart
The files option specifies the test files to run:
// karma.conf.js:
const getKarmaConfig = require('@wildpeaks/karma-config-web');
module.exports = function(config) {
const karmaConfig = getKarmaConfig({
files: 'src/**/*.spec.js'
});
config.set(karmaConfig);
};You can also use several patterns:
// karma.conf.js:
const getKarmaConfig = require('@wildpeaks/karma-config-web');
module.exports = function(config) {
const karmaConfig = getKarmaConfig({
files: [
'test/*.test.js',
'src/**/*.spec.js'
]
});
config.set(karmaConfig);
};Use a Webpack 4 configuration to handle more filetypes:
// karma.conf.js:
const getKarmaConfig = require('@wildpeaks/karma-config-web');
module.exports = function(config) {
const karmaConfig = getKarmaConfig({
files: 'src/**/*.spec.js',
webpack: {
module: {
rules: [
//...
]
}
// ...
}
});
config.set(karmaConfig);
};The Webpack Config Generator makes it easy to support Typescript, CSS, and images:
// karma.conf.js
const getKarmaConfig = require('@wildpeaks/karma-config-web');
const getWebpackConfig = require('@wildpeaks/webpack-config-web');
module.exports = function(config) {
const webpackConfig = getWebpackConfig({
mode: 'development',
skipPostprocess: true
});
const karmaConfig = getKarmaConfig({
files: 'src/**/*.spec.ts',
webpack: webpackConfig
});
config.set(karmaConfig);
};Additional browsers
The package only comes with Puppeteer (headless Chrome) because it's cross-platform and headless (so you don't see the browser opening and closing when Karma runs the tests).
However, Karma supports other browsers, such as:
You can also use paid services like BrowserStack and Sauce Labs to run tests in a lot of desktop and mobile browsers.
Add additional launchers in the dependencies of your package.json, example:
{
"devDependencies": {
"karma-edge-launcher": "...",
"karma-firefox-launcher": "...",
"karma-ie-launcher": "..."
}
}Then use property browsers in karma.conf.js:
const getKarmaConfig = require('@wildpeaks/karma-config-web');
module.exports = function(config) {
const karmaConfig = getKarmaConfig({
files: 'src/**/*.spec.ts'
});
karmaConfig.browsers = ['ChromeHeadless', 'Firefox', 'IE', 'Edge'];
config.set(karmaConfig);
};