0.5.0 release

CHANGELOG.md

@@ -1,3 +1,9 @@
+## 0.5.0
+
+* Added a new plugin for webpack, EnzymeAdapterPlugin, which automates the Enzyme initialization of an adapter. Whenever an app imports/requires Enzyme, a small proxy will intervene and ensure the desired Enzyme adapter is configured and used. This allows easier Enzyme usage within karma-webpack, for example.
+* PrerenderPlugin inline script to initialize root `fontSize` now considers window height in addition to window width.
+* Deep linking support in a prerendered page will now default to empty content, inserting prerendered app HTML as needed.
+
 ## 0.4.0 (Nov. 6, 2017)
 
 * Unify PrerenderPlugin and LocaleHtmlPlugin into a single general-purpose plugin
@@ -31,7 +37,7 @@
 * Added an `option-parser` module to parse and store the Enact build options from the `package.json` and to handle intertwined values and fallbacks to do with `fontGenerator`, `screenTypes`, `ri`, `theme`, `target`, etc.
 * Added support for a CommonJS font generator to generate localized font CSS (deprecating the previous global prerender hook).
 * Added support for dynamic replacement of main entrypoint to `config-helper`.
-* Updated `package-toot` to now throw an error when no root is found.
+* Updated `package-root` to now throw an error when no root is found.
 * Updated dependencies.
 
 ## 0.1.0 (Sept. 28, 2017)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enact/dev-utils",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "A collection of development utilities for Enact apps.",
   "main": "index.js",
   "author": "Jason Robitaille <jason.robitaille@lge.com>",
@@ -25,8 +25,8 @@
     "webpack-sources": "^1.0.0"
   },
   "devDependencies": {
-    "eslint": "~4.10.0",
-    "webpack": "~3.8.1"
+    "eslint": "~4.15.0",
+    "webpack": "~3.10.0"
   },
   "peerDependencies": {
     "webpack": "^2 || ^2.1.0-beta || ^2.2.0-rc || ^3"

plugins/EnzymeAdapterPlugin/README.md

@@ -0,0 +1,2 @@
+# EnzymeAdapterPlugin
+

plugins/EnzymeAdapterPlugin/enzyme-proxy.js

@@ -0,0 +1,15 @@
+/* global ENZYME_MODULE_REQUEST, ENZYME_ADAPTER_REQUEST */
+/* eslint no-var: off */
+/*
+ *  enzyme-proxy.js
+ *
+ *  A proxy module to automatically initialize the Enzyme Adapter whenever Enzyme is
+ *  required/imported.
+ */
+
+var enzyme = require(ENZYME_MODULE_REQUEST);
+var Adapter = require(ENZYME_ADAPTER_REQUEST);
+
+enzyme.configure({adapter: new Adapter()});
+
+module.exports = enzyme;

plugins/EnzymeAdapterPlugin/index.js

@@ -0,0 +1,32 @@
+const {DefinePlugin} = require('webpack');
+
+function EnzymeAdapterPlugin(options) {
+	this.options = options || {};
+	this.options.enzyme = this.options.enzyme || 'enzyme';
+	this.options.adapter = this.options.adapter || 'enzyme-adapter-react-16';
+}
+
+EnzymeAdapterPlugin.prototype.apply = function(compiler) {
+	const opts = this.options;
+	const proxyJS = require.resolve('./enzyme-proxy');
+
+	// Inject enzyme and adapter module filepath constants
+	compiler.apply(new DefinePlugin({
+		ENZYME_MODULE_REQUEST: JSON.stringify(opts.enzyme),
+		ENZYME_ADAPTER_REQUEST: JSON.stringify(opts.adapter)
+	}));
+
+	// Redirect external 'enzyme' import/require statements to the enzyme proxy
+	compiler.plugin('normal-module-factory', (factory) => {
+		factory.plugin('before-resolve', (result, callback) => {
+			if(!result) return callback();
+			if(result.request === 'enzyme' && result.contextInfo.issuer !== proxyJS
+					&& !result.contextInfo.issuer.includes('enzyme')) {
+				result.request = proxyJS;
+			}
+			return callback(null, result);
+		});
+	});
+};
+
+module.exports = EnzymeAdapterPlugin;

plugins/PrerenderPlugin/index.js

@@ -189,7 +189,8 @@ PrerenderPlugin.prototype.apply = function(compiler) {
 				}
 
 				const appHtml = parsePrerender(status.prerender[i]);
-				const updater = templates.update(mapping, opts.deep);
+				const updater = templates.update(mapping, opts.deep, appHtml.prerender);
+				if(opts.deep) appHtml.prerender = '';
 				if(updater) {
 					body.push({
 						tagName: 'script',

plugins/PrerenderPlugin/templates.js

@@ -15,10 +15,11 @@ const startup = (screenTypes, jsAssets) => `
 		width = window.innerWidth;
 	var scrObj = screenTypes[screenTypes.length - 1];
 	if(height > width) {
-		width = height;
+		height = window.innerWidth;
+		width = window.innerHeight;
 	}
 	for(var i=screenTypes.length-1; i>=0; i--) {
-		if(width <= screenTypes[i].width) {
+		if(height <= screenTypes[i].height && width <= screenTypes[i].width) {
 			scrObj = screenTypes[i];
 		}
 	}
@@ -54,15 +55,13 @@ const startup = (screenTypes, jsAssets) => `
 	}, 0); };
 `;
 
-const deepLink = (conditions, fallback) => conditions ? `
+const deepLink = (conditions, prerender, wrapped) => conditions ? `
 	// Handle any deep link conditions.
-	if(${(Array.isArray(conditions) ? conditions.join(' && ') : conditions)}) {
-		var div = document.getElementById("root");
-		while(div && div.firstChild) { div.removeChild(div.firstChild); }
-	${fallback ? `} else {
-		${fallback.replace(/\n/g, '\n\t')}
-	}` : '}'}
-` : (fallback || null);
+	if(!(${(Array.isArray(conditions) ? conditions.join(' && ') : conditions)})) {
+		document.getElementById("root").innerHTML = ${JSON.stringify(prerender)};
+		${wrapped ? wrapped.replace(/\n/g, '\n\t') : ''}
+	}
+` : (wrapped || null);
 
 const multiLocale = (mapping) => mapping && `
 	// Apply locale-specific root classes and checksum.
@@ -81,5 +80,5 @@ module.exports = {
 	startup: (screenTypes, jsAssets) => fn(startup(screenTypes, jsAssets)),
 	// Update inline script, which updates the template/prerender content prior to app render.
 	// Used for locale and deeplinking customizations.
-	update: (mapping, deep) => fn(deepLink(deep, multiLocale(mapping)))
+	update: (mapping, deep, prerender) => fn(deepLink(deep, prerender, multiLocale(mapping)))
 };

plugins/index.js

@@ -1,6 +1,7 @@
 module.exports = {
 	EnactFrameworkPlugin: require('./dll/EnactFrameworkPlugin'),
 	EnactFrameworkRefPlugin: require('./dll/EnactFrameworkRefPlugin'),
+	EnzymeAdapterPlugin: require('./EnzymeAdapterPlugin'),
 	GracefulFsPlugin: require('./GracefulFsPlugin'),
 	ILibPlugin: require('./ILibPlugin'),
 	PrerenderPlugin: require('./PrerenderPlugin'),