build using webpack 4 (#59)

* adjust for webpack 4
* node 9 in appveyor

CHANGES.md

@@ -1,6 +1,12 @@
 videojs-wavesurfer changelog
 ============================
 
+2.3.2 - unreleased
+------------------
+
+- Package library using webpack 4
+
+
 2.3.1 - 2018/04/30
 ------------------
 

appveyor.yml

@@ -1,6 +1,6 @@
 environment:
   matrix:
-    - nodejs_version: '8'
+    - nodejs_version: '9'
 install:
   - choco install -y googlechrome --ignore-checksums
   - ps: Install-Product node $env:nodejs_version

build-config/fragments/common.js

@@ -18,14 +18,14 @@ var bannerPlugin = new webpack.BannerPlugin(
 @copyright 2014-${time} ${pckg.author}
 @license ${pckg.license}`
 );
-
 // inject version number
 var replaceVersionPlugin = new webpack.DefinePlugin({
   '__VERSION__': JSON.stringify(pckg.version)
 });
+let rootDir = path.resolve(__dirname, '..', '..');
 
 module.exports = {
-    context: path.resolve(__dirname, '../', '../'),
+    context: rootDir,
     output: {
         libraryTarget: 'umd',
         umdNamedDefine: true
@@ -44,12 +44,16 @@ module.exports = {
         rules: [
             {
                 test: /\.js$/,
+                include: path.resolve(rootDir, 'src', 'js'),
                 exclude: /(node_modules|bower_components|test)/,
                 use: {
                     loader: 'babel-loader'
                 }
             }
         ]
     },
-    plugins: [bannerPlugin, replaceVersionPlugin]
+    plugins: [
+        bannerPlugin,
+        replaceVersionPlugin
+    ]
 };

build-config/fragments/dev.js

@@ -6,12 +6,10 @@
 const path = require('path');
 
 module.exports = {
-    devtool: 'eval-source-map',
-    output: {
-        publicPath: 'localhost:8080/dist/'
-    },
+    mode: 'development',
+    devtool: 'source-map',
     devServer: {
-        contentBase: [path.resolve(__dirname, '../', '../')],
+        contentBase: [path.resolve(__dirname, '..', '..')],
         publicPath: 'localhost:8080/dist/',
         watchContentBase: true
     }

build-config/fragments/main.js

@@ -9,11 +9,11 @@ module.exports = {
     entry: {
         'videojs.wavesurfer': path.resolve(
             __dirname,
-            '../', '../', 'src', 'js', 'videojs.wavesurfer.js'
+            '..', '..', 'src', 'js', 'videojs.wavesurfer.js'
         )
     },
     output: {
-        path: path.resolve(__dirname, '../', '../', 'dist'),
+        path: path.resolve(__dirname, '..', '..', 'dist'),
         filename: '[name].js',
         library: 'VideojsWavesurfer'
     }

build-config/fragments/prod.js

@@ -3,6 +3,21 @@
  * @since 2.3.0
  */
 
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
+
 module.exports = {
-    devtool: 'source-map'
+    mode: 'production',
+    devtool: 'source-map',
+    optimization: {
+        minimizer: [
+            new UglifyJSPlugin({
+                sourceMap: true,
+                uglifyOptions: {
+                    compress: {
+                        inline: false
+                    }
+                }
+            })
+        ]
+    }
 };

build-config/webpack.prod.main.js

@@ -9,4 +9,8 @@ const common = require('./fragments/common');
 const prod = require('./fragments/prod');
 const main = require('./fragments/main');
 
-module.exports = merge(common, prod, main);
+module.exports = merge(common, prod, main, {
+    output: {
+        filename: 'videojs.wavesurfer.min.js'
+    }
+});

karma.conf.js

@@ -2,11 +2,15 @@
  * @since 2.3.0
  */
 
+process.traceDeprecation = true;
 process.env.BABEL_ENV = 'test';
 
+const path = require('path');
 require('babel-register');
 
 var webpackConfig = require('./build-config/webpack.prod.main.js');
+var support_dir = path.resolve(__dirname, 'test', 'support');
+var fakeAudioStream = path.join(support_dir, 'demo.wav');
 
 // Chrome CLI options
 // http://peter.sh/experiments/chromium-command-line-switches/
@@ -17,7 +21,7 @@ var chromeFlags = [
     '--no-default-browser-check',
     '--use-fake-device-for-media-stream',
     '--use-fake-ui-for-media-stream',
-    '--use-file-for-fake-audio-capture=test/support/demo.wav',
+    '--use-file-for-fake-audio-capture=' + fakeAudioStream,
     '--autoplay-policy=no-user-gesture-required',
     '--user-data-dir=.chrome',
     '--disable-translate',
@@ -53,7 +57,7 @@ module.exports = function(config) {
             'node_modules/video.js/dist/video-js.css',
             'dist/css/videojs.wavesurfer.css',
 
-            // dependencies
+            // library dependencies
             'node_modules/video.js/dist/video.js',
             'node_modules/wavesurfer.js/dist/wavesurfer.js',
             'node_modules/wavesurfer.js/dist/plugin/wavesurfer.microphone.js',
@@ -83,6 +87,7 @@ module.exports = function(config) {
         ],
         browsers: ['Firefox_dev', 'Chrome_dev'],
         captureConsole: true,
+        browserNoActivityTimeout: 50000,
         colors: true,
         reporters: ['verbose', 'progress', 'coverage'],
         coverageReporter: {