Add support for dynamic filenames

CHANGELOG.md

@@ -1,6 +1,10 @@
 Change History
 ==============
 
+v2.16.0
+----
+* Add support for dynamic filenames like index[hash].html
+
 v2.15.0
 ----
 * Add full unit test coverage for the webpack 2 beta version

index.js

@@ -109,10 +109,14 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
       // Allow plugins to make changes to the assets before invoking the template
       // This only makes sense to use if `inject` is `false`
       .then(function (compilationResult) {
-        return applyPluginsAsyncWaterfall('html-webpack-plugin-before-html-generation', {assets: assets, plugin: self})
-          .then(function () {
-            return compilationResult;
-          });
+        return applyPluginsAsyncWaterfall('html-webpack-plugin-before-html-generation', {
+          assets: assets,
+          outputName: self.childCompilationOutputName,
+          plugin: self
+        })
+        .then(function () {
+          return compilationResult;
+        });
       })
       // Execute the template
       .then(function (compilationResult) {
@@ -124,7 +128,7 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
       })
       // Allow plugins to change the html before assets are injected
       .then(function (html) {
-        var pluginArgs = {html: html, assets: assets, plugin: self};
+        var pluginArgs = {html: html, assets: assets, plugin: self, outputName: self.childCompilationOutputName};
         return applyPluginsAsyncWaterfall('html-webpack-plugin-before-html-processing', pluginArgs)
           .then(function () {
             return pluginArgs.html;
@@ -136,7 +140,7 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
       })
       // Allow plugins to change the html after assets are injected
       .then(function (html) {
-        var pluginArgs = {html: html, assets: assets, plugin: self};
+        var pluginArgs = {html: html, assets: assets, plugin: self, outputName: self.childCompilationOutputName};
         return applyPluginsAsyncWaterfall('html-webpack-plugin-after-html-processing', pluginArgs)
           .then(function () {
             return pluginArgs.html;
@@ -165,7 +169,13 @@ HtmlWebpackPlugin.prototype.apply = function (compiler) {
         // Let other plugins know that we are done:
         return applyPluginsAsyncWaterfall('html-webpack-plugin-after-emit', {
           html: compilation.assets[self.childCompilationOutputName],
+          outputName: self.childCompilationOutputName,
           plugin: self
+        }).catch(function (err) {
+          console.error(err);
+          return null;
+        }).then(function () {
+          return null;
         });
       })
       // Let webpack continue with it

package.json

@@ -1,6 +1,6 @@
 {
   "name": "html-webpack-plugin",
-  "version": "2.15.0",
+  "version": "2.16.0",
   "description": "Simplifies creation of HTML files to serve your webpack bundles",
   "main": "index.js",
   "files": [

spec/BasicSpec.js

@@ -38,14 +38,16 @@ function testHtmlPlugin (webpackConfig, expectedResults, outputFile, done, expec
     } else {
       expect(compilationWarnings).toBe('');
     }
+    if (outputFile instanceof RegExp) {
+      var matches = Object.keys(stats.compilation.assets).filter(function (item) {
+        return outputFile.test(item);
+      });
+      expect(matches.length).toBe(1);
+      outputFile = matches[0];
+    }
+    expect(outputFile.indexOf('[hash]') === -1).toBe(true);
     var outputFileExists = fs.existsSync(path.join(OUTPUT_DIR, outputFile));
-    expect({
-      exists: outputFileExists,
-      filename: outputFile
-    }).toEqual({
-      exists: true,
-      filename: outputFile
-    });
+    expect(outputFileExists).toBe(true);
     if (!outputFileExists) {
       return done();
     }
@@ -579,6 +581,19 @@ describe('HtmlWebpackPlugin', function () {
     }, ['<script src="index_bundle.js"'], 'test.html', done);
   });
 
+  it('will replace [hash] in the filename with the child compilation hash', function (done) {
+    testHtmlPlugin({
+      entry: path.join(__dirname, 'fixtures/index.js'),
+      output: {
+        path: OUTPUT_DIR,
+        filename: 'index_bundle.js'
+      },
+      plugins: [new HtmlWebpackPlugin({
+        filename: 'test-[hash].html'
+      })]
+    }, ['<script src="index_bundle.js"'], /test-\S+\.html$/, done);
+  });
+
   it('allows you to use an absolute output filename', function (done) {
     testHtmlPlugin({
       entry: path.join(__dirname, 'fixtures/index.js'),