karma-webpack: webpack@5.0.0-beta.28 Cannot find plugin "karma-webpack"

  • Operating System:
  • Node Version: v12.18.3
  • NPM Version: v6.14.8
  • webpack Version: 5.0.0-beta.28
  • karma-webpack Version: 4.0.2

Expected Behavior

Works fine just like with webpack 4.

Actual Behavior


17 09 2020 10:09:41.335:ERROR [plugin]: Cannot find plugin "karma-webpack".
  Did you forget to install it?
  npm install karma-webpack --save-dev
17 09 2020 10:09:41.340:ERROR [preprocess]: Can not load "webpack", it is not registered!
  Perhaps you are missing some plugin?
17 09 2020 10:09:41.361:ERROR [karma-server]: Error during file loading or preprocessing
TypeError: process is not a function
    at executeProcessor (/frontend/node_modules/karma/lib/preprocessor.js:47:11)
    at runProcessors (/frontend/node_modules/karma/lib/preprocessor.js:60:23)
    at FileList.preprocess [as _preprocess] (/frontend/node_modules/karma/lib/preprocessor.js:134:11)
    at async Promise.all (index 0)
    at async /frontend/node_modules/karma/lib/file-list.js:90:11
    at async Promise.all (index 8)
17 09 2020 10:09:41.376:ERROR [karma-server]: Error: Found 2 load errors
    at Server.<anonymous> (/frontend/node_modules/karma/lib/server.js:213:27)
    at Object.onceWrapper (events.js:421:28)
    at Server.emit (events.js:327:22)
    at emitListeningNT (net.js:1347:10)
    at processTicksAndRejections (internal/process/task_queues.js:83:21)
npm ERR! Test failed.  See above for more details.

Code

var webpack = require('webpack');
var path = require('path');

module.exports = function (config) {
  config.set({
    basePath: '',
    browsers: ['PhantomJS'],
    browserNoActivityTimeout: 30000,
    singleRun: false,
    frameworks: ['es6-shim', 'mocha', 'chai'],
    files: [
      'tests.webpack.js'
    ],
    plugins: [
      'karma-mocha',
      'karma-chai',
      'karma-spec-reporter',
      'karma-phantomjs-launcher',
      'karma-babel-preprocessor',
      'karma-sourcemap-loader',
      'karma-es6-shim',
      'karma-webpack',
    ],
    preprocessors: {
      'tests.webpack.js': ['webpack', 'sourcemap']
    },
    reporters: ['spec'],
    specReporter: {
      suppressErrorSummary: true,  // do not print error summary
      suppressFailed: false,  // do not print information about failed tests
      suppressPassed: false,  // do not print information about passed tests
      suppressSkipped: true,  // do not print information about skipped tests
      showSpecTiming: false // print the time elapsed for each spec
    },
//    reporters: ['dots', 'coverage'],
    coverageReporter: {
      type: 'html',
      dir: 'coverage/',
      instrumenterOptions: {
        istanbul: { noCompact: true }
      }
    },
    logLevel: config.LOG_ERROR,
    client: {
      captureConsole: true, // set to true to be able to debug tests
    },
    webpack: {
      devtool: 'inline-source-map',
      module: {
        rules: [
          {
            test: /\.jsx?$/,
            use: {
              loader: 'babel-loader',
              options: {
                plugins: ['transform-object-rest-spread']
              }
            },
            exclude: /(node_modules|bower_components)/,
          },
        ]
      },
      resolve: {
        modules: [path.resolve('./src'), 'node_modules'],
        extensions: ['.js', '.jsx']
      },
      watch: true,
      plugins: [
        new webpack.LoaderOptionsPlugin({
          babel: {
            presets: ['react', 'es2015', 'airbnb'],
            plugins: ['istanbul']
          }
        }),
        new webpack.ProvidePlugin({
          $: 'jquery',
          jQuery: 'jquery'
        })
      ],
      externals: {
        'cheerio': 'window',
        'react/addons': true,
        'react/lib/ExecutionEnvironment': true,
        'react/lib/ReactContext': true
      }
    },
    webpackServer: {
      noInfo: true
    }
  });
};

The very same config works just fine with webpack 4.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 3
  • Comments: 17 (3 by maintainers)

Most upvoted comments

I tried installing the alpha version but got an error with webpack 5.1.0 as well:

webpack 5.1.0 compiled successfully in 2956 ms
13 10 2020 22:25:26.394:ERROR [karma-server]: Error during file loading or preprocessing
TypeError [ERR_INVALID_ARG_TYPE]: The "data" argument must be of type string or an instance of Buffer, TypedArray, or DataView. Received undefined
    at Hash.update (internal/crypto/hash.js:84:11)
    at Object.sha1 (/home/thijs/projects/videojs-wavesurfer/node_modules/karma/lib/utils/crypto-utils.js:9:8)
    at runProcessors (/home/thijs/projects/videojs-wavesurfer/node_modules/karma/lib/preprocessor.js:70:26)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at FileList.preprocess [as _preprocess] (/home/thijs/projects/videojs-wavesurfer/node_modules/karma/lib/preprocessor.js:134:5)
    at async Promise.all (index 0)
    at /home/thijs/projects/videojs-wavesurfer/node_modules/karma/lib/file-list.js:90:11
    at async Promise.all (index 12)

Just a gentle follow up. Any luck with it? 😃

Thank you! I’ve put a note to test this out tomorrow and provide a fix

On Thu 17 Sep 2020 at 11:24, Aleksandr Zakharov notifications@github.com wrote:

  • Operating System:

  • Node Version: v12.18.3

  • NPM Version: v6.14.8

  • webpack Version: 5.0.0-beta.28

  • karma-webpack Version: 4.0.2

Expected Behavior

Works fine just like with webpack 4.

Actual Behavior

17 09 2020 10:09:41.335:ERROR [plugin]: Cannot find plugin ā€œkarma-webpackā€.

Did you forget to install it?

npm install karma-webpack --save-dev

17 09 2020 10:09:41.340:ERROR [preprocess]: Can not load ā€œwebpackā€, it is not registered!

Perhaps you are missing some plugin?

17 09 2020 10:09:41.361:ERROR [karma-server]: Error during file loading or preprocessing

TypeError: process is not a function

at executeProcessor (/frontend/node_modules/karma/lib/preprocessor.js:47:11)

at runProcessors (/frontend/node_modules/karma/lib/preprocessor.js:60:23)

at FileList.preprocess [as _preprocess] (/frontend/node_modules/karma/lib/preprocessor.js:134:11)

at async Promise.all (index 0)

at async /frontend/node_modules/karma/lib/file-list.js:90:11

at async Promise.all (index 8)

17 09 2020 10:09:41.376:ERROR [karma-server]: Error: Found 2 load errors

at Server.<anonymous> (/frontend/node_modules/karma/lib/server.js:213:27)

at Object.onceWrapper (events.js:421:28)

at Server.emit (events.js:327:22)

at emitListeningNT (net.js:1347:10)

at processTicksAndRejections (internal/process/task_queues.js:83:21)

npm ERR! Test failed. See above for more details.

Code

var webpack = require(ā€˜webpack’);

var path = require(ā€˜path’);

module.exports = function (config) {

config.set({

basePath: '',

browsers: ['PhantomJS'],

browserNoActivityTimeout: 30000,

singleRun: false,

frameworks: ['es6-shim', 'mocha', 'chai'],

files: [

  'tests.webpack.js'

],

plugins: [

  'karma-mocha',

  'karma-chai',

  'karma-spec-reporter',

  'karma-phantomjs-launcher',

  'karma-babel-preprocessor',

  'karma-sourcemap-loader',

  'karma-es6-shim',

  'karma-webpack',

],

preprocessors: {

  'tests.webpack.js': ['webpack', 'sourcemap']

},

reporters: ['spec'],

specReporter: {

  suppressErrorSummary: true,  // do not print error summary

  suppressFailed: false,  // do not print information about failed tests

  suppressPassed: false,  // do not print information about passed tests

  suppressSkipped: true,  // do not print information about skipped tests

  showSpecTiming: false // print the time elapsed for each spec

},

// reporters: [ā€˜dots’, ā€˜coverage’],

coverageReporter: {

  type: 'html',

  dir: 'coverage/',

  instrumenterOptions: {

    istanbul: { noCompact: true }

  }

},

logLevel: config.LOG_ERROR,

client: {

  captureConsole: true, // set to true to be able to debug tests

},

webpack: {

  devtool: 'inline-source-map',

  module: {

    rules: [

      {

        test: /\.jsx?$/,

        use: {

          loader: 'babel-loader',

          options: {

            plugins: ['transform-object-rest-spread']

          }

        },

        exclude: /(node_modules|bower_components)/,

      },

    ]

  },

  resolve: {

    modules: [path.resolve('./src'), 'node_modules'],

    extensions: ['.js', '.jsx']

  },

  watch: true,

  plugins: [

    new webpack.LoaderOptionsPlugin({

      babel: {

        presets: ['react', 'es2015', 'airbnb'],

        plugins: ['istanbul']

      }

    }),

    new webpack.ProvidePlugin({

      $: 'jquery',

      jQuery: 'jquery'

    })

  ],

  externals: {

    'cheerio': 'window',

    'react/addons': true,

    'react/lib/ExecutionEnvironment': true,

    'react/lib/ReactContext': true

  }

},

webpackServer: {

  noInfo: true

}

});

};

The very same config works just fine with webpack 4.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/ryanclark/karma-webpack/issues/450, or unsubscribe https://github.com/notifications/unsubscribe-auth/AB4ODPKXACNSQSLCWU7RJ2DSGHPVBANCNFSM4RQGXQYA .

@codymikol thanks for the follow up. I have since then gone back to using gulp so didn’t manage to resolve the issue. When I come to revisit this sometime in the future I’ll keep these tips in mind!

@Xezed @charklewis @thijstriemstra

Just want to check in with you all to see if you’ve gotten things working. If not, have you made sure of the following.

  • your plugins list includes karma-webpack (see below)
  • webpack is included as a framework in karma.config.js
  • karma-webpack is at version 5.0.0-alpha.5
  • your specified webpack config has no entry field
  • it should also not have an outputs field

Also @charklewis I notice that your preprocessor is not pointing at tests/index.test.js, this should be the same as files and import all of your tests (which I’m assuming your index.test.js file does)

also specifically for you make sure your karma.config.js plugins list contains webpack, I think that may be why you are getting the 11 11 2020 09:46:37.917:ERROR [plugin]: Cannot find plugin "karma-webpack". error

        plugins: [
            ...
            require('karma-webpack')
        ],

@charklewis I’m having the exact same issue with a very similar karma configuration.

EDIT: The answer to fixing this was just posted on the karma-webpack plugin ==> https://github.com/ryanclark/karma-webpack/commit/2cc549531cb03f9dbb84fd4946050a8d4db5208a

EDIT EDIT: if you change your karma-webpack depedency to "karma-webpack": "https://github.com/ryanclark/karma-webpack.git#next",

it seems to no longer crash, but my tests now don’t actually run. I just get 0/0 ran. Still tinkering on my end though

With that karma-webpack change + adding webpack to the frameworks array in karma.config.js, everything works as exptected. šŸ”

Thank you! I’ve put a note to test this out tomorrow and provide a fix

Anything we can help with @ryanclark?

@Xezed, try to install the latest alpha version of the karma-webpack package:

{
	"karma-webpack": "^5.0.0-alpha.3.0"
}

It helped to me. I know, using the alpha version is risky but as for now, I don’t have any other ideas.

PS: See: https://github.com/ryanclark/karma-webpack/commit/8e69ed3c4ce3ec12ff2d86612f05566a704a9b52