Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
ordinaryorange opened this issue Jan 17, 2018 · 7 comments
Open

Comments

@ordinaryorange
Copy link

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
Copy link
Author

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
Copy link
Author

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

@ordinaryorange
Copy link
Author

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
Copy link
Contributor

jods4 commented Feb 23, 2018

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
Copy link
Author

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
Copy link
Author

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
Copy link
Contributor

jods4 commented Feb 25, 2018

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.

  • It ensures aurelia-loader-webpack is your configured Loader. This can easily be done in your own code instead and disabled in config with noWebpackLoader. Note that it must be done quite early and that the module has to be in the main chunk, where the webpack runtime lives (this might change with Webpack 4 because runtime has been moved out).
  • It ensures availability of DLL refs containing modules loaded by Aurelia, if you reference DLLs.
  • It includes everything from includeAll if you use that (ideally you shouldn't).
  • It includes your app entry point defined by an HTML attribute. You can easily disable that by setting option aureliaApp to undefined. Your entry point -- if any -- should then be referenced from code.

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants