From 37db0868efdbf334a1b60003fe5bd376cfd8ae01 Mon Sep 17 00:00:00 2001
From: Jan Nicklas <j.nicklas@me.com>
Date: Sat, 19 May 2018 20:49:09 +0200
Subject: [PATCH] refactor: Change the structure of the internal assets object

Adapt structure in preparation for the webpack 4 entry api

BREAKING CHANGE: The assets object which is used for the template parameters and inside hooks was changed. The chunks property was removed and the js and css property was converted from a string into an object `{ entryName: string, path: string}`
---
 examples/inline/template.jade    |  4 +--
 index.js                         | 50 ++++++++++++++++++++++----------
 spec/BasicSpec.js                |  6 ++--
 spec/fixtures/template.jade      |  2 +-
 spec/fixtures/test.html          |  2 +-
 spec/fixtures/webpackconfig.html |  2 +-
 6 files changed, 43 insertions(+), 23 deletions(-)

diff --git a/examples/inline/template.jade b/examples/inline/template.jade
index b4337d6a..83a8e9b0 100644
--- a/examples/inline/template.jade
+++ b/examples/inline/template.jade
@@ -5,6 +5,6 @@ html
     title #{htmlWebpackPlugin.options.title}
   body
     each cssFile in htmlWebpackPlugin.files.css
-      style !{compilation.assets[cssFile.substr(htmlWebpackPlugin.files.publicPath.length)].source()}
+      style !{compilation.assets[cssFile.path.substr(htmlWebpackPlugin.files.publicPath.length)].source()}
     each jsFile in htmlWebpackPlugin.files.js
-      script !{compilation.assets[jsFile.substr(htmlWebpackPlugin.files.publicPath.length)].source()}
+      script !{compilation.assets[jsFile.path.substr(htmlWebpackPlugin.files.publicPath.length)].source()}
diff --git a/index.js b/index.js
index 465190ad..f8f34f88 100644
--- a/index.js
+++ b/index.js
@@ -434,6 +434,18 @@ class HtmlWebpackPlugin {
     return assets.js.length && assets.js.every(name => /\.hot-update\.js$/.test(name));
   }
 
+  /**
+   *
+   * @param {WebpackCompilation} compilation
+   * @param {any} chunks
+   * @returns {{
+      publicPath: string,
+      js: Array<{entryName: string, path: string}>,
+      css: Array<{entryName: string, path: string}>,
+      manifest: string,
+      favicon?: string
+    }}
+   */
   htmlWebpackPluginAssets (compilation, chunks) {
     const compilationHash = compilation.hash;
 
@@ -449,11 +461,18 @@ class HtmlWebpackPlugin {
       publicPath += '/';
     }
 
+    /**
+     * @type {{
+        publicPath: string,
+        js: Array<{entryName: string, path: string}>,
+        css: Array<{entryName: string, path: string}>,
+        manifest: string,
+        favicon?: string
+      }}
+     */
     const assets = {
       // The public path
       publicPath: publicPath,
-      // Will contain all js & css files by chunk
-      chunks: {},
       // Will contain all js files
       js: [],
       // Will contain all css files
@@ -465,15 +484,12 @@ class HtmlWebpackPlugin {
     // Append a hash for cache busting
     if (this.options.hash) {
       assets.manifest = this.appendHash(assets.manifest, compilationHash);
-      assets.favicon = this.appendHash(assets.favicon, compilationHash);
     }
 
     for (let i = 0; i < chunks.length; i++) {
       const chunk = chunks[i];
       const chunkName = chunk.names[0];
 
-      assets.chunks[chunkName] = {};
-
       // Prepend the public path to all chunk files
       let chunkFiles = [].concat(chunk.files).map(chunkFile => publicPath + chunkFile);
 
@@ -486,16 +502,20 @@ class HtmlWebpackPlugin {
       // or when one chunk hosts js and css simultaneously
       const js = chunkFiles.find(chunkFile => /.js($|\?)/.test(chunkFile));
       if (js) {
-        assets.chunks[chunkName].size = chunk.size;
-        assets.chunks[chunkName].entry = js;
-        assets.chunks[chunkName].hash = chunk.hash;
-        assets.js.push(js);
+        assets.js.push({
+          entryName: chunkName,
+          path: js
+        });
       }
 
       // Gather all css files
       const css = chunkFiles.filter(chunkFile => /.css($|\?)/.test(chunkFile));
-      assets.chunks[chunkName].css = css;
-      assets.css = assets.css.concat(css);
+      css.forEach((cssPath) => {
+        assets.css.push({
+          entryName: chunkName,
+          path: cssPath
+        });
+      });
     }
 
     // Duplicate css assets can occur on occasion if more than one chunk
@@ -552,19 +572,19 @@ class HtmlWebpackPlugin {
    */
   generateHtmlTagObjects (assets) {
     // Turn script files into script tags
-    const scripts = assets.js.map(scriptPath => ({
+    const scripts = assets.js.map(scriptAsset => ({
       tagName: 'script',
       voidTag: false,
       attributes: {
-        src: scriptPath
+        src: scriptAsset.path
       }
     }));
     // Turn css files into link tags
-    const styles = assets.css.map(stylePath => ({
+    const styles = assets.css.map(styleAsset => ({
       tagName: 'link',
       voidTag: true,
       attributes: {
-        href: stylePath,
+        href: styleAsset.path,
         rel: 'stylesheet'
       }
     }));
diff --git a/spec/BasicSpec.js b/spec/BasicSpec.js
index d8b6d964..c291bd7b 100644
--- a/spec/BasicSpec.js
+++ b/spec/BasicSpec.js
@@ -376,7 +376,7 @@ describe('HtmlWebpackPlugin', function () {
     }, [{
       type: 'chunkhash',
       chunkName: 'app',
-      containStr: '<script src="app_bundle.js?%chunkhash%"'
+      containStr: '<script src="app_bundle.js'
     }], null, done);
   });
 
@@ -1195,7 +1195,7 @@ describe('HtmlWebpackPlugin', function () {
         compiler.plugin('compilation', function (compilation) {
           tapCompilationEvent(compilation, 'html-webpack-plugin-before-html-processing', function (object, callback) {
             eventFired = true;
-            object.assets.js.push('funky-script.js');
+            object.assets.js.push({path: 'funky-script.js'});
             object.html += 'Injected by plugin';
             callback();
           });
@@ -1230,7 +1230,7 @@ describe('HtmlWebpackPlugin', function () {
         compiler.plugin('compilation', function (compilation) {
           tapCompilationEvent(compilation, 'html-webpack-plugin-before-html-generation', function (object, callback) {
             eventFired = true;
-            object.assets.js.push('funky-script.js');
+            object.assets.js.push({path: 'funky-script.js'});
             callback();
           });
         });
diff --git a/spec/fixtures/template.jade b/spec/fixtures/template.jade
index 1d303ae6..d4febba0 100644
--- a/spec/fixtures/template.jade
+++ b/spec/fixtures/template.jade
@@ -6,4 +6,4 @@ html
   body
     p Some unique text
     each jsFile in htmlWebpackPlugin.files.js
-      script(src!=jsFile)
+      script(src!=jsFile.path)
diff --git a/spec/fixtures/test.html b/spec/fixtures/test.html
index 6edb9ed6..2064a5b7 100644
--- a/spec/fixtures/test.html
+++ b/spec/fixtures/test.html
@@ -6,6 +6,6 @@
   </head>
   <body>
     <p>Some unique text</p>
-    <script src="<%=htmlWebpackPlugin.files.chunks.app.entry%>"></script>
+    <script src="<%=htmlWebpackPlugin.files.js[0].path%>"></script>
   </body>
 </html>
diff --git a/spec/fixtures/webpackconfig.html b/spec/fixtures/webpackconfig.html
index f4616a14..a7f47f3f 100644
--- a/spec/fixtures/webpackconfig.html
+++ b/spec/fixtures/webpackconfig.html
@@ -6,6 +6,6 @@
   </head>
   <body>
     <p>Public path is <%= webpackConfig.output.publicPath %></p>
-    <script src="<%= htmlWebpackPlugin.files.chunks.app.entry %>?<%= htmlWebpackPlugin.files.chunks.app.hash %>"></script>
+    <script src="<%= htmlWebpackPlugin.files.js[0].path %></script>
   </body>
 </html>