From 016a4586b8be4446bfa4fd14413eaa6be43e06e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Mon, 21 Nov 2016 21:59:52 -0800
Subject: [PATCH 1/3] Fix browser bundle for AMD

---
 grunt/config/browserify.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/grunt/config/browserify.js b/grunt/config/browserify.js
index 282c003d61b6b..6e410b59c726a 100644
--- a/grunt/config/browserify.js
+++ b/grunt/config/browserify.js
@@ -74,7 +74,12 @@ function simpleBannerify(src) {
 // variable. So we write a wrapper around the UMD bundle that browserify creates,
 // and define a React variable that will require across Webpack-boundaries or fall
 // back to the global, just like it would previously.
+// Additionally, we're going to modify the original UMD wrapper a bit, replacing
+// the define([], f) call with f(). This allows our additional wrapper to work
+// so we can define() there without issue (AMD was causing issues). If you
+// think this is all a bit insane, you are absolutely correct.
 function wrapperify(src) {
+  src = src.replace('define([],f)', 'return f()');
   return `
 ;(function(f) {
   // CommonJS
@@ -83,7 +88,7 @@ function wrapperify(src) {
 
   // RequireJS
   } else if (typeof define === "function" && define.amd) {
-    require(['react'], f);
+    define(['react'], f);
 
   // <script>
   } else {
@@ -103,7 +108,7 @@ function wrapperify(src) {
     f(g.React)
   }
 })(function(React) {
-  ${src}
+  return ${src}
 });
 `;
 }

From a05fd1d5bf3a67e43dd036d6fed6b64bfc993d9f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Tue, 22 Nov 2016 10:57:06 -0800
Subject: [PATCH 2/3] Final fix for standalone browser build.

Much more scientific than the rest so it should stick.
---
 grunt/config/browserify.js | 31 ++++++++++++++++++++-----------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/grunt/config/browserify.js b/grunt/config/browserify.js
index 6e410b59c726a..fb84f190e6eb6 100644
--- a/grunt/config/browserify.js
+++ b/grunt/config/browserify.js
@@ -63,7 +63,7 @@ function simpleBannerify(src) {
 }
 
 // What is happening here???
-// I'm glad you asked. It became really to make our bundle splitting work.
+// I'm glad you asked. It became really hard to make our bundle splitting work.
 // Everything is fine in node and when bundling with those packages, but when
 // using our pre-packaged files, the splitting didn't work. Specifically due to
 // the UMD wrappers defining their own require and creating their own encapsulated
@@ -71,20 +71,29 @@ function simpleBannerify(src) {
 // be smart and looks for top-level requires (even when aliasing to a bundle),
 // but since we didn't have those, we couldn't require 'react' from 'react-dom'.
 // But we are already shimming in some modules that look for a global React
-// variable. So we write a wrapper around the UMD bundle that browserify creates,
-// and define a React variable that will require across Webpack-boundaries or fall
-// back to the global, just like it would previously.
-// Additionally, we're going to modify the original UMD wrapper a bit, replacing
-// the define([], f) call with f(). This allows our additional wrapper to work
-// so we can define() there without issue (AMD was causing issues). If you
-// think this is all a bit insane, you are absolutely correct.
+// variable. So we replace the UMD wrapper that browserify creates with out own,
+// in 2 steps.
+// 1. We swap out the browserify UMD with a plain function call. This ensures
+// that the internal wrapper doesn't interact with the external state. By the
+// time we're in the internal wrapper it doesn't matter what the external wrapper
+// detected. Browserify insulates its CommonJS system inside closures so can just
+// call that function and return it.
+// 2. We put our own UMD wrapper around that fixed internal function, ensuring
+// React is in scope. This outer wrapper is essentially the same UMD wrapper
+// browserify would create, just handling the scope issue.
+// Is this insane? Yes.
+// Does it work? Yes.
+// Should it go away ASAP? Yes.
 function wrapperify(src) {
-  src = src.replace('define([],f)', 'return f()');
+  src = src.replace(
+    `function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.${this.data.standalone} = f()}}`,
+    `function(f){return f()}`
+  );
   return `
 ;(function(f) {
   // CommonJS
   if (typeof exports === "object" && typeof module !== "undefined") {
-    f(require('react'));
+    module.exports = f(require('react'));
 
   // RequireJS
   } else if (typeof define === "function" && define.amd) {
@@ -105,7 +114,7 @@ function wrapperify(src) {
       // see https://github.com/facebook/react/issues/3037
       g = this;
     }
-    f(g.React)
+    g.${this.data.standalone} = f(g.React);
   }
 })(function(React) {
   return ${src}

From f6e3c855e2a94ad3aaaa0bf9be766aa9df0f6108 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Tue, 22 Nov 2016 14:56:50 -0800
Subject: [PATCH 3/3] Throw when we can't find code we need to replace.

---
 grunt/config/browserify.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/grunt/config/browserify.js b/grunt/config/browserify.js
index fb84f190e6eb6..e6260914868be 100644
--- a/grunt/config/browserify.js
+++ b/grunt/config/browserify.js
@@ -85,8 +85,13 @@ function simpleBannerify(src) {
 // Does it work? Yes.
 // Should it go away ASAP? Yes.
 function wrapperify(src) {
+  var toReplace =
+    `function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.${this.data.standalone} = f()}}`;
+  if (src.indexOf(toReplace) === -1) {
+    throw new Error('wrapperify failed to find code to replace');
+  }
   src = src.replace(
-    `function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.${this.data.standalone} = f()}}`,
+    toReplace,
     `function(f){return f()}`
   );
   return `