karma.conf.js
'use strict';
const path = require('path');
const isDev = !!process.env.DEV;
const reporters = ["mocha", "tfs", "coverage-istanbul"];
if(isDev){
reporters.push("kjhtml");
}
const istanbulReporterConfig = {
reports: isDev? ["html", "cobertura"]:["cobertura"],
dir: path.resolve(__dirname, `coverage${isDev?"/%browser%":""}`),
fixWebpackSourcePaths: true,
'report-config': {
cobertura: {
file: `${isDev?"../":""}cobertura/coverage.xml`
}
}
};
const testDir = path.resolve(__dirname, "tests");
const webpackConfig; // see below for webpackConfig
module.exports = function (config) {
config.set({
basePath: "./",
frameworks: ['jasmine'],
files: [
{ pattern: "./node_modules/whatwg-fetch/fetch.js", watched:false},
{ pattern: 'tests/karma-bundle.js', watched: false }
],
preprocessors: {
'tests/karma-bundle.js': ['webpack', 'sourcemap']
},
webpack: webpackConfig,
reporters: reporters,
tfsReporter: {
outputDir: "testresults",
outputFile: 'testresults.xml'
},
coverageIstanbulReporter: istanbulReporterConfig,
client: {
clearContext: false,
jasmine: {
maximumSpecCallbackDepth: 5,
random: true,
seed: '28344',
}
},
webpackServer: { noInfo: true },
port: 9876,
colors: true,
logLevel: config.LOG_DEBUG,
autoWatch: true,
browsers: isDev? [ 'Chrome', 'Firefox'] : [ "SlimerJS" ],
singleRun: !isDev,
concurrency: Infinity,
})
}
Webpack config
const testDir = path.resolve(__dirname, "tests");
const srcDir = path.resolve(__dirname, "src");
const outDir = path.resolve(__dirname, "dist");
const baseUrl = "/"
const cssRules = [{
loader: "css-loader",
options: {
modules: true,
importLoaders: 1,
localIdentName: "[name]__[local]___[hash:base64:5]"
}
},
{
loader: "postcss-loader",
options: { plugins: () => [ require("autoprefixer")({ browsers: ["last 2 versions"] }) ] }
}
];
const webpackConfig = {
mode: "development",
entry: { app: ["aurelia-bootstrapper"] },
resolve: {
extensions: [".ts", ".js"],
modules: [srcDir, "node_modules", testDir],
symlinks: false
},
output: {
path: outDir,
publicPath: baseUrl,
filename: "[name].[hash].js",
sourceMapFilename: "[name].[hash].bundle.map",
chunkFilename: "[name].[hash].js"
},
devServer: {
contentBase: outDir,
historyApiFallback: true
},
devtool: "inline-source-map",
module: {
rules: [
{ test: /\.css$/i, issuer: [{ not: [{ test: /\.html$/i }] }], use: ["style-loader", ...cssRules] },
{ test: /\.css$/i, issuer: [{ test: /\.html$/i }], use: [ "css-loader" ] },
{ test: /app\.scss$/, loaders: ["style-loader", "css-loader", "sass-loader"] },
{ test: /\.ts$/i,
use:[
{ loader: "istanbul-instrumenter-loader" },
{ loader: "ts-loader", options: { reportFiles: [ srcDir+'/**/*.ts'] } }
],
include: srcDir },
{ test: /\.ts$/i, loader: "ts-loader", include: testDir, options: { reportFiles: [testDir+'/**/*.ts'] } },
{ test: /\.html$/i, loader: "html-loader" },
{ test: /\.(png|gif|jpg|cur)$/i, loader: "url-loader", options: { limit: 8192 } },
{ test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: "url-loader", options: { limit: 10000, mimetype: "application/font-woff2" } },
{ test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: "url-loader", options: { limit: 10000, mimetype: "application/font-woff" } },
{ test: /\.(ttf|eot|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/i, loader: "file-loader" },
{ test: /[\/\\]node_modules[\/\\]bluebird[\/\\].+\.js$/, loader: 'expose-loader?Promise' },
]
},
plugins: [
new AureliaPlugin({aureliaApp: path.resolve(testDir, "./main")}),
new ModuleDependenciesPlugin({ 'aurelia-testing': ['./compile-spy', './view-spy'] }),
new ProvidePlugin({
'Promise': 'bluebird',
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery"
})
]
};