Support for spread operator and decorartors

[asierba]

Hi,

I'm trying to get code coverage with instanbul. I am using karma and webpack.

In my code base I am using es2015 plus some other features like decorators. So I am setting esModules to true. This is my webpack loader settings for istanbul-instrumenter-loader.

{
            test: /\.js$/,
            use: {
              loader: 'istanbul-instrumenter-loader',
              query: { esModules: true }
            },
            include: path.resolve('src/')
          }

When I run karma, I am getting errors like the following:

ERROR in index.js
Module build failed: SyntaxError: Unexpected token (13:2)

These errors are due to the use of spread operator or the decortator in js.

Things like this:

    analyticsEvents.push({
          ...data,
          event,
          eventCallback
        });

  @bindable columnId;
  @bindable columnLabel;
  @bindable onColumnSorted;

I understand the decorator syntax or the spread operator are not part of es2015.

This why I am using this settings in my .babelrc:

{
  "presets": ["es2015", "stage-0"],
  "plugins": ["transform-decorators-legacy"]
}

Is istanbul-instrumenter-loader reading the babel settings or is it independ of that? Maybe there is some config setting I am missing? Any idea how I can make this work?

[michael-ciniawsky]

https://github.com/webpack-contrib/istanbul-instrumenter-loader#with-babel

{
   test: /\.js$/,
   use: { 
      loader: 'babel-loader'
   }
},
{
   test: /\.js$/,
   use: {
       loader: 'istanbul-instrumenter-loader',
       query: { esModules: true }
   },
   enforce: 'post', // <=
}

You will also need to disable ES Modules => CJS transpilation in babel-preset-es2015 I think it was

presets: [
   ["es2015", { modules: false }]
]

babel-preset-env ('Autoprefixer' for JS) is also something to take a look at, don't use stage-0 or the like in production code