feat: Add support for extraGlobals (#24)

New option `extraGlobals`. Value will be merged into global scope during render.

.nvmrc

@@ -0,0 +1 @@
+12.8

package.json

@@ -26,19 +26,19 @@
     "url": "https://github.com/jahredhope/html-render-webpack-plugin.git"
   },
   "devDependencies": {
-    "babel-eslint": "10.0.1",
-    "commitizen": "3.0.4",
-    "cz-conventional-changelog": "2.1.0",
-    "eslint": "5.9.0",
-    "jest": "24.5.0",
-    "prettier": "1.15.2",
-    "semantic-release": "15.12.1",
-    "webpack": "4.28.2",
-    "webpack-merge": "4.1.5"
+    "babel-eslint": "10.0.2",
+    "commitizen": "4.0.3",
+    "cz-conventional-changelog": "3.0.2",
+    "eslint": "6.1.0",
+    "jest": "24.8.0",
+    "prettier": "1.18.2",
+    "semantic-release": "15.13.19",
+    "webpack": "4.39.1",
+    "webpack-merge": "4.2.1"
   },
   "dependencies": {
-    "chalk": "^2.4.1",
-    "eval": "^0.1.2"
+    "chalk": "^2.4.2",
+    "eval": "^0.1.4"
   },
   "config": {
     "commitizen": {

src/createRenderer.js

@@ -12,7 +12,7 @@ function getFileSourceFromCompilation(specifier, compilation) {
   return asset.source();
 }
 
-function evalutateFromSource(specifier, compilation) {
+function evalutateFromSource(specifier, compilation, extraGlobals) {
   let source;
   try {
     source = getFileSourceFromCompilation(specifier, compilation);
@@ -22,21 +22,29 @@ function evalutateFromSource(specifier, compilation) {
   return evaluate(
     source,
     /* filename: */ specifier,
-    /* scope: */ { require: createLinker(specifier, compilation), console },
+    /* scope: */ {
+      require: createLinker(specifier, compilation, extraGlobals),
+      console,
+      ...extraGlobals
+    },
     /* includeGlobals: */ true
   );
 }
 
-function createLinker(parentModulePath, compilation) {
+function createLinker(parentModulePath, compilation, extraGlobals) {
   return function linker(specifier) {
     const absPath = path.join(path.dirname(parentModulePath), specifier);
     if (!fileExistsInCompilation(specifier, compilation)) {
       return require(specifier);
     }
-    return evalutateFromSource(absPath, compilation);
+    return evalutateFromSource(absPath, compilation, extraGlobals);
   };
 }
 
-module.exports = function createRenderer({ fileName, renderCompilation }) {
-  return evalutateFromSource(fileName, renderCompilation);
+module.exports = function createRenderer({
+  fileName,
+  renderCompilation,
+  extraGlobals
+}) {
+  return evalutateFromSource(fileName, renderCompilation, extraGlobals);
 };

src/index.js

@@ -14,6 +14,7 @@ module.exports = class HtmlRenderPlugin {
   constructor(options = {}) {
     validateOptions(schema, options, "HTML Render Webpack Plugin");
 
+    this.extraGlobals = options.extraGlobals || {};
     this.mapStatsToParams = options.mapStatsToParams || returnEmptyObject;
     this.renderDirectory = options.renderDirectory || "dist";
     this.renderEntry = options.renderEntry || "main";
@@ -71,6 +72,7 @@ module.exports = class HtmlRenderPlugin {
 
     try {
       await renderHtml({
+        extraGlobals: this.extraGlobals,
         mapStatsToParams: this.mapStatsToParams,
         renderConcurrency: this.renderConcurrency,
         renderCompilation: this.renderCompilation,
@@ -127,9 +129,7 @@ module.exports = class HtmlRenderPlugin {
         this.compilersComplete++;
         if (this.compilersRunning > 0) {
           this.trace(
-            `Assets emitted for ${compilerName}. Waiting for ${
-              this.compilersRunning
-            } other currently running compilers`
+            `Assets emitted for ${compilerName}. Waiting for ${this.compilersRunning} other currently running compilers`
           );
           return;
         }
@@ -143,11 +143,7 @@ module.exports = class HtmlRenderPlugin {
           return;
         }
         this.trace(
-          `Assets emitted for ${compilerName}. compilersComplete ${
-            this.compilersComplete
-          }. No. Compilers: ${this.compilers.length}. Compilers running: ${
-            this.compilersRunning
-          }.`
+          `Assets emitted for ${compilerName}. compilersComplete ${this.compilersComplete}. No. Compilers: ${this.compilers.length}. Compilers running: ${this.compilersRunning}.`
         );
         return this.onRender(compilation);
       }

src/renderHtml.js

@@ -5,6 +5,7 @@ const createRenderer = require("./createRenderer");
 const timeSince = startTime => `${(Date.now() - startTime) / 1000}s`;
 
 module.exports = async function renderHtml({
+  extraGlobals,
   mapStatsToParams,
   renderConcurrency,
   routes,
@@ -30,7 +31,8 @@ module.exports = async function renderHtml({
 
   const renderFunc = createRenderer({
     renderCompilation,
-    fileName: renderFile
+    fileName: renderFile,
+    extraGlobals
   });
   if (typeof renderFunc !== "function") {
     throw new Error(

src/schemas/HtmlRenderWebpackPlugin.json

@@ -51,6 +51,10 @@
     "compilerToRenderWith": {
       "description": "Used to automatically select a configuration to render from.",
       "type": "string"
+    },
+    "extraGlobals": {
+      "description": "Extra values to pass to the global scope.",
+      "type": "object"
     }
   }
 }

tests/test-cases/extraGlobals/__snapshots__/extraGlobals.test.js.snap

@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`with extra globals in scope should render a HTML file 1`] = `
+Object {
+  "a": Object {
+    "index.html": "<html>
+<body>
+  anExtraGlobalValue: An Extra Global Value
+</body>
+</html>",
+  },
+}
+`;

tests/test-cases/extraGlobals/extraGlobals.test.js

@@ -0,0 +1,24 @@
+const MemoryFS = require("memory-fs");
+const webpack = require("webpack");
+const path = require("path");
+
+const config = require("./webpack.config");
+const getDirContentsSync = require("../../utils/getDirContentsSync");
+
+describe("with extra globals in scope", () => {
+  const renderDirectory = path.join(process.cwd(), "dist", "render");
+
+  it("should render a HTML file", async done => {
+    const compiler = webpack(config);
+
+    const memoryFs = new MemoryFS();
+    compiler.outputFileSystem = memoryFs;
+
+    compiler.run(error => {
+      expect(error).toBe(null);
+      const contents = getDirContentsSync(renderDirectory, { fs: memoryFs });
+      expect(contents).toMatchSnapshot();
+      done();
+    });
+  });
+});

tests/test-cases/extraGlobals/src/render.js

@@ -0,0 +1,9 @@
+/* global anExtraGlobalValue */
+
+export default function exampleRender() {
+  return `<html>
+<body>
+  anExtraGlobalValue: ${anExtraGlobalValue}
+</body>
+</html>`;
+}

tests/test-cases/extraGlobals/webpack.config.js

@@ -0,0 +1,31 @@
+const path = require("path");
+
+const srcPath = path.resolve(__dirname, "./src");
+const paths = {
+  renderEntry: path.resolve(srcPath, "render.js")
+};
+
+const HtmlRenderPlugin = require("../../../src");
+
+const renderDirectory = path.join(process.cwd(), "dist", "render");
+const plugin = new HtmlRenderPlugin({
+  routes: [{ route: "/a/", extra: "a" }],
+  renderDirectory,
+  extraGlobals: {
+    anExtraGlobalValue: "An Extra Global Value"
+  }
+});
+
+module.exports = {
+  name: "render",
+  target: "node",
+  mode: "production",
+  entry: paths.renderEntry,
+  output: {
+    libraryExport: "default",
+    library: "static",
+    libraryTarget: "umd2",
+    filename: "render-[name]-[contenthash].js"
+  },
+  plugins: [plugin.render()]
+};

tests/test-cases/webpack-stats/__snapshots__/webpack-stats.test.js.snap

@@ -6,13 +6,13 @@ Object {
   {
     \\"name\\": \\"client\\",
     \\"assets\\": {
-      \\"main\\": \\"client-main-daf2166db871ad045ea4.js\\"
+      \\"main\\": \\"client-main-ceb3857c2a7596acae6d.js\\"
     }
   },
   {
     \\"name\\": \\"render\\",
     \\"assets\\": {
-      \\"main\\": \\"render-main-92cbd4560ebd5729284e.js\\"
+      \\"main\\": \\"render-main-82d3602c9121065b0ab7.js\\"
     }
   }
 ]",