Karma 忽略 MIME 设置并且测试在 Chrome 中失败

Question

我在尝试运行我的单元测试时遇到以下错误。

Refused to execute script from 'http://localhost:9876/base/tests/test.ts' because its MIME type ('video/mp2t') is not executable.

问题是 karma 使用 Content-Type:video/mp2t 服务于 test.ts 而 Chrome v55+ 拒绝执行脚本。

我在 karma.conf.js 中设置 mime 属性是这样的：

mime: {
  'text/x-typescript': ['ts', 'tsx'],
  'text/losingmyf@#kingmime': ['js']
}

Karma 在测试时没有使用任何一种 MIME 类型运行。在此处设置后，是否有任何可能会更改 MIME 设置的内容？

karma.conf.js

module.exports = function (config) {
  const webpackConfig = require("./webpack.config")({ mode: 'test' });

  var appBase = 'app/';
  var appAssets = '/base/app/'; // component assets fetched by Angular's compiler

  const configuration = {
      basePath: '',
      frameworks: ["jasmine"],
      files: [
          { pattern: './dist-test/pretest.bundle.js', watched: false, served: true },
          { pattern: './tests/test.ts', watched: false },
          { pattern: appBase + '**/*.png', included: false, watched: false }
      ],
      preprocessors: {
          './tests/test.ts': ['webpack', 'sourcemap']
      },
      mime: {
          'text/x-typescript': ['ts', 'tsx'],
          'text/losingmyf@#kingmime': ['js']
      },

      // Proxied base paths for loading assets
      proxies: {
          // required for component assets fetched by Angular's compiler
          "/app/": appAssets,
          "/ClientSrc/app/": appAssets
      },

      exclude: [],
      // reporters: ['progress', 'kjhtml', 'dots', 'trx'],
      reporters: ['progress', 'kjhtml'],

      trxReporter: { outputFile: 'test-results.trx' },

      webpack: webpackConfig,
      webpackMiddleware: {
          stats: 'errors-only'
      },

      client: {
          // Set false to leave Jasmine Spec Runner output visible in browser
          clearContext: true
      },

      coverageIstanbulReporter: {
          reports: ['html', 'lcovonly'],
          fixWebpackSourcePaths: true
      },

      port: 9876,
      colors: true,
      logLevel: config.LOG_INFO,
      autoWatch: true,
      browsers: [
          "Chrome"
          // , "ChromeNoSandbox"
          // , "Firefox"
          // , "IE"
      ],

      // customLaunchers: {
      //     ChromeNoSandbox: {
      //         base: 'Chrome',
      //         flags: ['--no-sandbox']
      //     }
      // },

      singleRun: false,
      concurrency: Infinity
  };

  console.log('before', config.mime); // undefined

  config.set(configuration);

  console.log('after', config.mime); // same as mime setting above
};

我的webpack.config也有这套：

"resolve": {
  "extensions": [
    ".ts",
    ".js"
  ]
...

Answer 1

经过数小时的调试 karma 后，我找到了一个名为 mime 的包，karma 使用该包为文件设置 Content-Type。

我安装的版本是1.3.5。我将软件包更新到 1.3.6 版本，我的问题已解决。

我后来在 karma 的 github 页面上发现了这个@ https://github.com/karma-runner/karma/issues/2702 的问题。可能应该先从那里开始:)

Karma 忽略 MIME 设置并且测试在 Chrome 中失败

Karma is ignoring mime setting and tests fail in Chrome

karma-runner

webpack

karma-webpack

karma.conf.js