Question

我已经为我的Aurelia项目使用Jasmine + Karma + Webpack设置了单元测试。该项目有25个spec文件（和大约385个测试用例）。但是，当我添加一个新的规范文件时，以前可以正常工作的一些旧测试用例开始失败。仅当我删除文件或注释掉文件内容时，才会恢复旧的行为。

从Google的基本搜索看来，我应该增加茉莉花的maximumSpecCallbackDepth选项。测试配置如下所示。我正在使用以下版本的依赖项：

"jasmine": "^3.3.0",
"karma": "^3.1.1",
"karma-chrome-launcher": "^2.2.0",
"karma-coverage-istanbul-reporter": "^2.0.4",
"karma-firefox-launcher": "^1.1.0",
"karma-jasmine": "^2.0.0",
"karma-jasmine-html-reporter": "^1.4.0",
"karma-mocha-reporter": "^2.2.5",
"karma-slimerjs-launcher": "^1.1.0",
"karma-sourcemap-loader": "^0.3.7",
"karma-tfs-reporter": "^1.0.1",
"karma-webpack": "^3.0.5",

有什么办法可以纠正它？

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配置

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"
      })
    ]
};

karma-bundle.js

import 'aurelia-polyfills';
import 'aurelia-loader-webpack';

Error.stackTraceLimit = Infinity;

var testModuleContexts = loadTestModules();
runTests(testModuleContexts);

function loadTestModules() {
    var srcContext = require.context('../src', true, /\.ts$/im);
    var testContext = require.context('./', true, /\.spec\.[tj]s$/im);
    return [srcContext, testContext];
}

function runTests(contexts) {
    contexts.forEach(requireAllInContext);
}

function requireAllInContext(requireContext) {
    return requireContext.keys().map(requireContext);
}

添加新的规范文件会触发旧测试用例的失败

0 个答案: