feat: Switch from jasmine to jest

jantimon · Jul 10, 2018 · ae1f435 · ae1f435
1 parent 82b34a1
commit ae1f435
Show file tree

Hide file tree

Showing 22 changed files with 241 additions and 207 deletions.
diff --git a/README.md b/README.md
@@ -287,15 +287,19 @@ plugins: [
 
 ### `Events`
 
-To allow other [plugins](https://github.com/webpack/docs/wiki/plugins) to alter the HTML this plugin executes the following events:
+To allow other [plugins](https://github.com/webpack/docs/wiki/plugins) to alter the HTML this plugin executes
+[tapable](https://github.com/webpack/tapable/tree/master) hooks.
 
-#### `AsyncSeriesWaterfallHook`
+The [lib/hooks.js](https://github.com/jantimon/html-webpack-plugin/blob/master/lib/hooks.js) contains all information
+about which values are passed.
 
-* `htmlWebpackPluginBeforeHtmlGeneration`
-* `htmlWebpackPluginBeforeHtmlProcessing`
-* `htmlWebpackPluginAlterAssetTags`
-* `htmlWebpackPluginAfterHtmlProcessing`
-* `htmlWebpackPluginAfterEmit`
+You can tap into the following async hooks:
+
+* `beforeHtmlGeneration`
+* `beforeHtmlProcessing`
+* `alterAssetTags`
+* `afterHtmlProcessing`
+* `afterEmit`
 
 Example implementation: [html-webpack-harddisk-plugin](https://github.com/jantimon/html-webpack-harddisk-plugin)
 
@@ -308,8 +312,10 @@ function MyPlugin(options) {
 MyPlugin.prototype.apply = function (compiler) {
   compiler.hooks.compilation.tap('MyPlugin', (compilation) => {
     console.log('The compiler is starting a new compilation...');
-    HtmlWebpackPlugin.getHooks(compilation).htmlWebpackPluginAfterHtmlProcessing.tapAsync(
-      'MyPlugin',
+
+    //                                      |      HOOK NAME   |
+    HtmlWebpackPlugin.getHooks(compilation).afterHtmlProcessing.tapAsync(
+      'MyPlugin', // <-- Set a meaningful name here for stacktraces
       (data, cb) => {
         data.html += 'The Magic Footer'
 

diff --git a/examples/appcache/dist/webpack-4/manifest.appcache b/examples/appcache/dist/webpack-4/manifest.appcache
@@ -1,5 +1,5 @@
 CACHE MANIFEST
-# 95a89258cd32fe3f01e3
+# a351a7eb0665a7fa27b3
 
 0714810ae3fb211173e2964249507195.png
 bundle.js

diff --git a/examples/appcache/webpack.config.js b/examples/appcache/webpack.config.js
@@ -13,8 +13,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.html$/, loader: 'html-loader?-removeOptionalTags' }
     ]

diff --git a/examples/build-examples.js b/examples/build-examples.js
@@ -10,17 +10,6 @@ var fs = require('fs');
 var path = require('path');
 var rimraf = require('rimraf');
 var webpack = require('webpack');
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-
-if (Number(webpackMajorVersion) > 1) {
-  var extractOriginal = ExtractTextPlugin.extract;
-  ExtractTextPlugin.extract = function (fallback, use) {
-    return extractOriginal({
-      fallback: fallback,
-      use: use
-    });
-  };
-}
 
 var examples = fs.readdirSync(__dirname).filter(function (file) {
   return fs.statSync(path.join(__dirname, file)).isDirectory();
@@ -39,10 +28,6 @@ examples.forEach(function (exampleName) {
     }));
     config.mode = 'production';
     config.optimization = { minimizer: [] };
-    if (config.module && config.module.loaders) {
-      config.module.rules = config.module.loaders;
-      delete config.module.loaders;
-    }
   }
 
   rimraf.sync(path.join(examplePath, 'dist', 'webpack-' + webpackMajorVersion));

diff --git a/examples/custom-template/webpack.config.js b/examples/custom-template/webpack.config.js
@@ -12,8 +12,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' }
     ]
   },

diff --git a/examples/default/webpack.config.js b/examples/default/webpack.config.js
@@ -10,7 +10,7 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
+    rules: [
       { test: /\.css$/, loader: 'style-loader!css-loader' },
       { test: /\.png$/, loader: 'file-loader' }
     ]

diff --git a/examples/favicon/webpack.config.js b/examples/favicon/webpack.config.js
@@ -11,8 +11,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' }
     ]
   },

diff --git a/examples/html-loader/webpack.config.js b/examples/html-loader/webpack.config.js
@@ -11,8 +11,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.html$/, loader: 'html-loader' }
     ]

diff --git a/examples/inline/webpack.config.js b/examples/inline/webpack.config.js
@@ -12,8 +12,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.jade$/, loader: 'jade-loader' }
     ]
   },

diff --git a/examples/jade-loader/dist/webpack-4/index.html b/examples/jade-loader/dist/webpack-4/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html><head><title>Jade demo</title><link rel="shortcut icon" href="favicon.ico"><link href="styles.css" rel="stylesheet"></head><body><div id="main"><!-- this partial is used for frontend and backend--><div class="time"> <b>Current time</b><p>1999-01-01T05:00:00.000Z</p></div><img src="0714810ae3fb211173e2964249507195.png"></div><script src="bundle.js"></script></body></html>
+<!DOCTYPE html><html><head><title>Jade demo</title><link rel="shortcut icon" href="favicon.ico"><link href="styles.css" rel="stylesheet"></head><body><div id="main"><!-- this partial is used for frontend and backend--><div class="time"> <b>Current time</b><p>1998-12-31T23:00:00.000Z</p></div><img src="0714810ae3fb211173e2964249507195.png"></div><script src="bundle.js"></script></body></html>
diff --git a/examples/jade-loader/webpack.config.js b/examples/jade-loader/webpack.config.js
@@ -11,8 +11,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.jade$/, loader: 'jade-loader' }
     ]

diff --git a/examples/javascript-advanced/webpack.config.js b/examples/javascript-advanced/webpack.config.js
@@ -11,8 +11,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.html$/, loader: 'html-loader' }
     ]

diff --git a/examples/javascript/dist/webpack-4/index.html b/examples/javascript/dist/webpack-4/index.html
@@ -1,2 +1,2 @@
-<head><link href="styles.css" rel="stylesheet"></head>Hello World from backend2018-02-14T04:00:28.077Z<h2>Partial</h2>
+<head><link href="styles.css" rel="stylesheet"></head>Hello World from backend2018-07-09T17:14:39.242Z<h2>Partial</h2>
 <img src="0714810ae3fb211173e2964249507195.png"><script src="bundle.js"></script>
diff --git a/examples/javascript/webpack.config.js b/examples/javascript/webpack.config.js
@@ -11,8 +11,8 @@ module.exports = {
     filename: 'bundle.js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.html$/, loader: 'html-loader' }
     ]

diff --git a/examples/sort-manually/webpack.config.js b/examples/sort-manually/webpack.config.js
@@ -17,8 +17,8 @@ module.exports = {
     filename: '[name].js'
   },
   module: {
-    loaders: [
-      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
+    rules: [
+      { test: /\.css$/, loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' }) },
       { test: /\.png$/, loader: 'file-loader' },
       { test: /\.html$/, loader: 'html-loader' }
     ]

diff --git a/index.js b/index.js
@@ -111,11 +111,11 @@ class HtmlWebpackPlugin {
     });
 
     compiler.hooks.emit.tapAsync('HtmlWebpackPlugin',
-    /**
-     * Hook into the webpack emit phase
-     * @param {WebpackCompilation} compilation
-     * @param {() => void} callback
-    */
+      /**
+       * Hook into the webpack emit phase
+       * @param {WebpackCompilation} compilation
+       * @param {() => void} callback
+      */
       (compilation, callback) => {
         // Clear the childCompilerCache
         childCompiler.clearCache(compiler);
@@ -156,7 +156,7 @@ class HtmlWebpackPlugin {
                 });
             }
           })
-        // Wait for the compilation to finish
+          // Wait for the compilation to finish
           .then(() => compilationPromise)
           .then(compiledTemplate => {
           // Allow to use a custom function / string instead
@@ -167,22 +167,22 @@ class HtmlWebpackPlugin {
             // and replace it with its content
             return self.evaluateCompilationResult(compilation, compiledTemplate);
           })
-        // Allow plugins to make changes to the assets before invoking the template
-        // This only makes sense to use if `inject` is `false`
-          .then(compilationResult => getHtmlWebpackPluginHooks(compilation).htmlWebpackPluginBeforeHtmlGeneration.promise({
+          // Allow plugins to make changes to the assets before invoking the template
+          // This only makes sense to use if `inject` is `false`
+          .then(compilationResult => getHtmlWebpackPluginHooks(compilation).beforeHtmlGeneration.promise({
             assets: assets,
             outputName: self.childCompilationOutputName,
             plugin: self
           })
             .then(() => compilationResult))
-        // Execute the template
+          // Execute the template
           .then(compilationResult => typeof compilationResult !== 'function'
             ? compilationResult
             : self.executeTemplate(compilationResult, assets, compilation))
-        // Allow plugins to change the html before assets are injected
+          // Allow plugins to change the html before assets are injected
           .then(html => {
             const pluginArgs = {html: html, assets: assets, plugin: self, outputName: self.childCompilationOutputName};
-            return getHtmlWebpackPluginHooks(compilation).htmlWebpackPluginBeforeHtmlProcessing.promise(pluginArgs);
+            return getHtmlWebpackPluginHooks(compilation).beforeHtmlProcessing.promise(pluginArgs);
           })
           .then(result => {
             const html = result.html;
@@ -191,42 +191,42 @@ class HtmlWebpackPlugin {
             const assetTags = self.generateHtmlTagObjects(assets);
             const pluginArgs = {head: assetTags.head, body: assetTags.body, plugin: self, outputName: self.childCompilationOutputName};
             // Allow plugins to change the assetTag definitions
-            return getHtmlWebpackPluginHooks(compilation).htmlWebpackPluginAlterAssetTags.promise(pluginArgs)
+            return getHtmlWebpackPluginHooks(compilation).alterAssetTags.promise(pluginArgs)
               .then(result => self.postProcessHtml(html, assets, { body: result.body, head: result.head })
                 .then(html => _.extend(result, {html: html, assets: assets})));
           })
-        // Allow plugins to change the html after assets are injected
+          // Allow plugins to change the html after assets are injected
           .then(result => {
             const html = result.html;
             const assets = result.assets;
             const pluginArgs = {html: html, assets: assets, plugin: self, outputName: self.childCompilationOutputName};
-            return getHtmlWebpackPluginHooks(compilation).htmlWebpackPluginAfterHtmlProcessing.promise(pluginArgs)
+            return getHtmlWebpackPluginHooks(compilation).afterHtmlProcessing.promise(pluginArgs)
               .then(result => result.html);
           })
           .catch(err => {
-          // In case anything went wrong the promise is resolved
-          // with the error message and an error is logged
+            // In case anything went wrong the promise is resolved
+            // with the error message and an error is logged
             compilation.errors.push(prettyError(err, compiler.context).toString());
             // Prevent caching
             self.hash = null;
             return self.options.showErrors ? prettyError(err, compiler.context).toHtml() : 'ERROR';
           })
           .then(html => {
-          // Replace the compilation result with the evaluated html code
+            // Replace the compilation result with the evaluated html code
             compilation.assets[self.childCompilationOutputName] = {
               source: () => html,
               size: () => html.length
             };
           })
-          .then(() => getHtmlWebpackPluginHooks(compilation).htmlWebpackPluginAfterEmit.promise({
+          .then(() => getHtmlWebpackPluginHooks(compilation).afterEmit.promise({
             html: compilation.assets[self.childCompilationOutputName],
             outputName: self.childCompilationOutputName,
             plugin: self
           }).catch(err => {
             console.error(err);
             return null;
           }).then(() => null))
-        // Let webpack continue with it
+           // Let webpack continue with it
           .then(() => {
             callback();
           });

diff --git a/lib/chunksorter.js b/lib/chunksorter.js
@@ -6,15 +6,14 @@
  * @type {{[sortmode: string] : (entryPointNames: Array<string>, compilation, htmlWebpackPluginOptions) => Array<string> }}
  * This file contains different sort methods for the entry chunks names
  */
-const sortFunctions = {};
-module.exports = sortFunctions;
+module.exports = {};
 
 /**
  * Performs identity mapping (no-sort).
  * @param  {Array} chunks the chunks to sort
  * @return {Array} The sorted chunks
  */
-sortFunctions.none = chunks => chunks;
+module.exports.none = chunks => chunks;
 
 /**
  * Sort manually by the chunks
@@ -23,7 +22,7 @@ sortFunctions.none = chunks => chunks;
  * @param  htmlWebpackPluginOptions the plugin options
  * @return {string[]} The sorted chunks
  */
-sortFunctions.manual = (entryPointNames, compilation, htmlWebpackPluginOptions) => {
+module.exports.manual = (entryPointNames, compilation, htmlWebpackPluginOptions) => {
   const chunks = htmlWebpackPluginOptions.chunks;
   if (!Array.isArray(chunks)) {
     return entryPointNames;
@@ -38,4 +37,4 @@ sortFunctions.manual = (entryPointNames, compilation, htmlWebpackPluginOptions)
 /**
  * Defines the default sorter.
  */
-sortFunctions.auto = module.exports.none;
+module.exports.auto = module.exports.none;