Closed SaurabhHarwande closed 3 years ago
matthieu-foucault
commented
5 years ago Thanks for the bug report!
Does the "alternative usage" described in the README work for you? (have a single .js file as your test entry point, and have that file load all tests using require.context)
SaurabhHarwande
commented
5 years ago Same results with the alternative approach. Just the error is a bit different as different file is used.
ℹ ｢wdm｣: Compiled successfully.
05 02 2019 01:26:14.122:INFO [karma-server]: Karma v4.0.0 server started at http://0.0.0.0:9876/
05 02 2019 01:26:14.124:INFO [launcher]: Launching browsers Firefox with concurrency unlimited
05 02 2019 01:26:14.129:INFO [launcher]: Starting browser Firefox
05 02 2019 01:26:15.734:INFO [Firefox 65.0.0 (Linux 0.0.0)]: Connected on socket yvLS_AvvRvYoEU88AAAA with id 24325332
Firefox 65.0.0 (Linux 0.0.0) ERROR
{
"message": "ReferenceError: require is not defined\nat /home/saurabh/DevEnv/SticyNotes/vuejs-template/src/test/main_test.js:1:7\n\n@/home/saurabh/DevEnv/SticyNotes/vuejs-template/src/test/main_test.js:1:7\n",
"str": "ReferenceError: require is not defined\nat /home/saurabh/DevEnv/SticyNotes/vuejs-template/src/test/main_test.js:1:7\n\n@/home/saurabh/DevEnv/SticyNotes/vuejs-template/src/test/main_test.js:1:7\n"
}
Firefox 65.0.0 (Linux 0.0.0): Executed 0 of 0 ERROR (0.565 secs / 0 secs)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.It seems that the file is not transpiled at all, it is passed on as is. Error is require is not defined. main_test.js is the single entrypoint for my testfiles.
I have checked and rechecked the configurations but they seem fine to me.
QXD-me
commented
5 years ago I think I'm getting the same issue, any updates? Or is there anything I can do to help diagnose the issue?
mipatterson
commented
5 years ago I was having a similar issue where the console was reporting the following:
Chrome 72.0.3626 (Windows 10.0.0): Executed 0 of 0 ERROR (0.072 secs / 0 secs)
After about 4 days of playing around with config changes, I found that my issue stemmed from the use of splitChunks. I disabled splitChunks by setting it to undefined after importing webpack.config.js into my karma configuration and my issues went away:
function buildWebpackConfig() {
const webpackArgs = {
mode: "development"
};
const webpackConfig = require("../../webpack.config")(undefined, webpackArgs);
webpackConfig.mode = "development";
webpackConfig.optimization.splitChunks = undefined;
return webpackConfig;
}Thanks for the reply, though that looks like a different issue from mine. I was getting the "unrecognised file type ts" bit.
I did figure mine out though, the issue was I was requiring the config wrong, so none of the loaders were being applied. I don't have access to code right now but the fix was something like:
const config = require("config")
Becomes
const config = require("config")()[0]
(The config is exporting an array, though I will soon change it so the [0] bit isn't necessary)
matthieu-foucault
commented
5 years ago @mipatterson splitChunks is indeed not supported by karma-webpack v4. Version 5, still in alpha, is fixing that issue.
@QXD-me It looks like your issue is related to #390 / #391. I shall fix that ASAP.
JBSK
commented
5 years ago Has this issue been fixed? i seem to have the same problem. webpack.config.js
const path = require('path');
const fs = require('fs');
const NodemonWebpack = require('nodemon-webpack-plugin');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const nodeExternals = require('webpack-node-externals');
module.exports = {
// the main source code file
entry: './src/index.ts',
target: "node",
node: {
__dirname: true
},
output: {
// the output file name
filename: 'index.js',
// the output path
path: path.resolve(__dirname, 'build')
},
module: {
rules: [
{
test: /\.tsx?$/,
use: 'ts-loader',
}
]
},
plugins: [
new NodemonWebpack()
],
resolve: {
extensions: ['.tsx', '.ts', '.js'],
plugins: [new TsconfigPathsPlugin({
configFile: "tsconfig.json"
})]
},
externals: [nodeExternals()]
};
// Get node modules
function getNodeModules() {
const nodeModules = {};
fs.readdirSync('node_modules')
.filter(function (x) {
return ['.bin'].indexOf(x) === -1;
})
.forEach(function (mod) {
nodeModules[mod] = 'commonjs ' + mod;
});
return nodeModules;
}
webpack.test..config.js
const webpack = require('webpack');
module.exports = {
devtool: 'inline-source-map',
mode: 'development',
resolve: {
extensions: ['.js', '.ts']
},
module: {
rules: [
{
test: /\.ts$/,
use: 'ts-loader',
exclude: /node_modules/
},
{
test: /\.js$/,
use: 'babel-loader',
exclude: /node_modules/
}
]
},
}karma.conf.js
var webpackConfig = require('./webpack.test.config.js');
webpackConfig.entry = undefined;
webpackConfig.mode = "development";
module.exports = (config) => {
config.set({
browsers: ["PhantomJS"],
frameworks: ["mocha", "chai"],
plugins: [
"karma-typescript",
"karma-mocha",
"karma-mocha-reporter",
"karma-chai",
"karma-phantomjs-launcher",
"karma-webpack"
],
reporters: ["progress", "mocha"],
files: [
"src/test.ts"
],
preprocessors: {
"src/test.ts": ["webpack"],
},
webpack: webpackConfig
})
};
This results in the following error: { "message": "SyntaxError: Unexpected token ')'\nat src/test.js:99:0", "str": "SyntaxError: Unexpected token ')'\nat src/test.js:99:0" }
It does not seem to recognize the arrow functions in my file, which leads me to believe that it is not transpiling it properly
mdblr
commented
5 years ago Is any one aware of issues with mini-css-extract-plugin? I see that the package is used above from the logs the op attached (edit for clarity). In my project, I use it too and I believe it is the cause of why I am experiencing the above issue, i.e. the tests aren't compiled and Karma logs Executed 0 of 0 ERROR.
When I opened the browser in debug, the source did not include my test bundles. Disabling mini-css-extract-plugin solved this.
I am trying to find more information still. Has anyone else seen or hear of an issue like this with that package and karma-webpack?
liorbd
commented
4 years ago @SaurabhHarwande @mdblr Same issue for me on karma-webpack v3.
I fixed it by update to karma-webpack v4.0.2.
devlinjunker
commented
4 years ago @SaurabhHarwande @mdblr Same issue for me on
karma-webpackv3. I fixed it by update tokarma-webpackv4.0.2.
@liorbd saved the day!
codymikol
commented
3 years ago Closing this as it sounds like it is fixed in 4.0.2 and we are now on 5.0.0
I have setup a VueJS project with webpack. Test files are written in typescript. The project by itself work fine.
webpack --config config/webpack.config.dev.jscompiles the project successfully the ts files are transpiled to js. Now I have defined a karma.config.js as follows:The webpack config is quite big. Here is the config for typescript:
running
karma start ./config/karma.config.js --single-rungives the following error:The complete code is in this repository pasting all of it here would just make it difficult to read. https://gitlab.com/saurabh-harwande-repos/vuejs-template