Karma: Using native es6 modules (files type='module'), __karma__.start() is launched before modules are loaded

[jehon]

I would like to run native es6 modules in chrome, without any transcoding.

And first things: loading the modules works !!!

in coherence.js (first test suite), I have

import FetchFull from "../../src/fetchfull.js";
describe("Check the coherence of the options when setting some options", function() {
  console.log("in describe...");
  it("should throw an error if setting an invalid value for an option", function() {
    console.log("in it...");

In my browser, I see "in describe..." but never "in it..."

Expected behaviour

I would expect some tests to run
And "in it..." to be show in console

Actual behaviour

It fails with:

13 03 2018 20:51:19.448:INFO [HeadlessChrome 65.0.3325 (Linux 0.0.0)]: Connected on socket a-GEvq6ubUXc2l3uAAAA with id 91625778
HeadlessChrome 65.0.3325 (Linux 0.0.0): Executed 0 of 0 ERROR (0.002 secs / 0 secs)

In the browser console, I see:

Skipping 0 tests
In describe...

Environment Details

• Karma version (output of karma --version): 2.0.0
• Linux
• Chrome 65
• Relevant part of your karma.config.js file

        frameworks: [
            'jasmine',
            'express-http-server'
        ],
        // preprocessors --> nothing

        files: [
            { pattern: 'src/*.js',                type: 'module', included: false },
            { pattern: 'tests/unit/coherence.js', type: 'module' }
        ],

Steps to reproduce the behaviour

This repo reproduce the problem, on the es6 branch:

1. git clone https://github.com/jehon/fetchfull
2. git checkout es6
3. npm install
   3a. npm run test
   3b. npm run test-continuously

[jehon]

My first opignion:

Because I see:

Skipping 0 tests
In describe...

I think that the listing of all the tests is launched before the loading of the module.

If I then run
__karma__.start()

I correctly see the "in it..."
(And some tests fail, but that's another problem)

So I think that the bug (unwanted feature) is that "__karma__.start()" is started too early.

[jehon]

In the karma.conf.js, the file is referenced here:
{ pattern: 'src/*.js', type: 'module', included: false },
And it is really loaded.

And with the PR, it works

[lastmjs]

In case it's helpful, if you load an initial html file instead of an initial js file, you can create a script that is not a module and call window.__karma__.start() there before you include other script tags that have the type="module" attribute set. That's how I'm getting around this issue.

[lastmjs]

And I realized that loading an initial html file relies on html imports, which are a dead spec, and you have to somehow include a polyfill before context.html to get it to work outside of Chrome, so now I'm back to this issue.

[lastmjs]

Looks like https://github.com/karma-runner/karma/pull/2834 should solve the issue once it is merged.

[letsgotomars]

Is this solved? If so can someone please give me an example or something of how to get Karma to work with native ES6 modules?

To be clear I mean Karma support without having to bundle or transpile existing fully functionally native ES6 modules

[mauritslamers]

I managed to get it to work by reading through the merged code. In the configuration file, you can use patterns to indicate the type of script used:

  files: [
    { patterns: 'tests/**/*.js', type: 'module' }
  ]

[CroMarmot]

I managed to get it to work by reading through the merged code. In the configuration file, you can use patterns to indicate the type of script used:

  files: [
    { patterns: 'tests/**/*.js', type: 'module' }
  ]

http://karma-runner.github.io/4.0/config/files.html

pattern instead of patterns worked for me

[thw0rted]

I don't know who on the team is responsible for this, but I'm pretty sure this issue can be closed, since #3072 officially added es6 module support.

(I can't get my actual code to work with it since it relies heavily on node-style module resolution, but that's my own fault...)

[devoto13]

Closing as per above.