I have been encountering an issue while trying to utilize karma-webpack for compiling my typescript tests in conjunction with karma.
Lately, my tests have ceased running. When inspecting the developer console, I come across messages like the following, for each file containing my test cases:
Script from “http://localhost:9876/base/tests/testFile.ts?[HASH]” was blocked due to an invalid MIME type
There are script tags that look something like this which are autogenerated by karma:
<script type="text/javascript" src="/base/tests/testFile.ts?[HASH]" crossorigin="anonymous"></script>
(Note, [HASH] corresponds to a timestamp)
Upon examining the files connected to the error messages, it appears that the compilation is indeed successful - each file includes the JavaScript output produced by the typescript compiler, along with all the webpack-related components.
This is how my karma configuration is set up:
module.exports = function (config) {
config.set({
plugins: [
require('karma-firefox-launcher'),
require('karma-webpack'),
require('karma-tap')
],
basePath: '',
frameworks: ['tap'],
files: ['tests/**/*.ts'],
preprocessors: {
'tests/**/*.ts': ['webpack']
},
webpack: {
module: {
rules: [
{
test: /\.tsx?$/,
exclude: /node_modules/,
use: [
"babel-loader",
"ts-loader"
]
}
]
},
resolve: {
extensions: [".webpack.js", ".web.js", ".js", ".ts", ".tsx", ".css"]
},
node: {
fs: 'empty'
}
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Firefox'],
singleRun: false
});
};
I attempted switching from Firefox to Chromium but encountered a similar problem, indicating that the issue isn't specific to any particular browser.
How can I prevent the scripts from being blocked and ensure that my tests run smoothly once again?
Versions of packages used:
"karma": "1.4.1",
"karma-firefox-launcher": "1.0.0",
"karma-tap": "3.1.1",
"karma-webpack": "2.0.2",
"ts-loader": "2.0.0",
"typescript": "2.2.0",
"webpack": "2.2.1",