aurelia / webpack-plugin

A plugin for webpack that enables bundling Aurelia applications.
MIT License
90 stars 36 forks source link

Karma test run fails unless entry: is specified in webpack config #134

Open ordinaryorange opened 6 years ago

ordinaryorange commented 6 years ago

I'm submitting a bug report

Versions -> webpack-plugin 2.0.0-rc.5 Windows 10 Node 8.9.4 NPM 5.6.0 Webpack 3.10.0 Karma 2.0.0 Karma-webpack 2.0.9 Chrome 63.0.3239.132 Typescript 2.6.2

Current behavior: Bare bores webpack.config just for test running. Without plugins:[ new AureliaPlugin()] in the webpack config tests execute as expected. But once the preceeding plugin is defined I receive error TypeError: request.replace is not a function after running karma start The webpack config above does not have an entry: defined. (as it does not need it for Karma).

However if I add and entry: with any string (other than an empty string - these error still), such as the path of the only test spec file, or "ImaRandomString". Then the error goes away and tests run again.

But webpack then tries to emit a main module in addition to the spec test, and also spams the console with ERROR in multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry ./test/specs.ts Module not found: Error: Can't resolve 'aurelia-webpack-plugin/runtime/empty-entry' in [my project]

I've tried removing the entry: in the webpack config, and specifying some options in the AureliaPlugin ctor but all attempts still yeild the original error and no tests nun.

Expected/desired behavior: It appears webpack-plugin in dependant on the entry: config setting in the webpack.config API and should not be ?

ordinaryorange commented 6 years ago

Actually, take a raincheck on that. I've just spun up another test project to test karma (now there's a circular reference....) and I'm not getting the above scenario. I'll come back with more information once I offload some expletives.

ordinaryorange commented 6 years ago

Status update. I've a repo here which sows the problem. My last comment was a false negative somehow.

ordinaryorange commented 6 years ago

Further testing provides evidence that this is indeed an issue with webpack-plugin. If I comment out //entry:'test1.spec.ts', and

 // plugins:[ 
      //   //need {aureliaApp:undefined} as we have only a basic test project wihtout any main app
      //   new AureliaPlugin({aureliaApp:undefined}), 
      //   ]

from the webpack.config file. And then comment out the async test in the spec, and the import statements. (So that effectively the only test is a simple expect() without any aurelia dependencies).

Then everything runs just fine.

jods4 commented 6 years ago

We should be able to get this work but it will need a very specific configuration.

aurelia-plugin adds stuff to your entry point so that everything magically works. Obviously with special entry points it won't be as magic ✨

First thing I need to fully understand here is: what does karma do to the webpack config exactly? It must modify it because if webpack would really have no entry point, then the bundle would be empty and do nothing. So what do the resulting entry points look like?

ordinaryorange commented 6 years ago

I'm by no means a Karma, nor a karma-webpack expert. I recall reading somewhere that the entry is passed into webpack somehow from Karma. I'll see if I can dig up the details of exactly how this is done.

ordinaryorange commented 6 years ago

Here is what I have been able to decipher so far. I'm hoping your knowledge of webpack-dev-middleware is better that mine. Looking at the source code for karma-webpack if there is no entry: defined in the webpack.config.js then karma-webpack will add a function that returns an empty object (lines 35 through 39) to the config. I'm assuming this is done to ensure the webpack validations pass when webpack is run. If a entry: is specified in the webpack.config.js then karma-webpack leaves the entry untouched.

Under the hood karma-webpack looks like it uses webpack-dev-middleware to run the webpack process. Again looking through the karma-webpack source, I think the source *.spec.ts files are added to the in memory filesystem of webpack-dev-middleware by karma-webpack, but I have been unable to understand how things get bundled (or entry any entry points specified) from there. Basically the webpack-dev-middleware seems to be able to emit the bundles via this above process when the entry: is a empty object. When string is defined for the entry: then webpack-dev-middleware tries to include this file in the compilation process too. If I set entry:'xxx' webpack will log to the console that it cannot find the file 'xxx', but then everything else seems to compile and emit correctly inside webpack, and then the karma/jasmine processes complete just fine.

If AureliaPlugin is adding to the entry: and it is a function() rather than an object, then maybe that is why the failure occurs ?

jods4 commented 6 years ago

Yes, the failure is because AureliaPlugin tries to setup a few things for you by tweaking your entry points.

Specifically, this is done by calls to addEntry in AureliaPlugin.

The problem is that these things have to be set up for an Aurelia app to work properly and we need to find a way to do it in a way that's compatible with the way Karma runs things.

So, if you set noWebpackLoader: true, aureliaApp: undefined, don't use includeAll nor DLL refs, it should build fine.

To run fine, you would at least need to load aurelia-webpack-loader before any other Aurelia code.