From f6e58316d24ba9c7229a27ce9fb36efe24dffcef Mon Sep 17 00:00:00 2001
From: Tharaka Wijebandara <tharaka.nw@gmail.com>
Date: Fri, 1 Sep 2017 20:43:03 +0530
Subject: [PATCH] Fix error overlay 'Object.assign' issue in IE by explicitly
 importing object-assign

---
 packages/react-error-overlay/package.json             |  1 +
 .../react-error-overlay/src/components/CodeBlock.js   | 11 +++++------
 .../react-error-overlay/src/components/Collapsible.js | 11 +++++------
 .../src/components/NavigationBar.js                   | 11 +++++------
 .../react-error-overlay/src/containers/StackFrame.js  |  4 +++-
 5 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/packages/react-error-overlay/package.json b/packages/react-error-overlay/package.json
index ba4676c4a77..983917d064b 100644
--- a/packages/react-error-overlay/package.json
+++ b/packages/react-error-overlay/package.json
@@ -35,6 +35,7 @@
     "babel-code-frame": "6.22.0",
     "babel-runtime": "6.26.0",
     "html-entities": "1.2.1",
+    "object-assign": "^4.1.1",
     "react": "^15 || ^16",
     "react-dom": "^15 || ^16",
     "settle-promise": "1.0.0",
diff --git a/packages/react-error-overlay/src/components/CodeBlock.js b/packages/react-error-overlay/src/components/CodeBlock.js
index 478f0111b9b..5ed934f9f25 100644
--- a/packages/react-error-overlay/src/components/CodeBlock.js
+++ b/packages/react-error-overlay/src/components/CodeBlock.js
@@ -9,6 +9,7 @@
 
 /* @flow */
 import React from 'react';
+import assign from 'object-assign';
 import { redTransparent, yellowTransparent } from '../styles';
 
 const _preStyle = {
@@ -21,15 +22,13 @@ const _preStyle = {
   borderRadius: '0.25rem',
 };
 
-const primaryPreStyle = {
-  ..._preStyle,
+const primaryPreStyle = assign({}, _preStyle, {
   backgroundColor: redTransparent,
-};
+});
 
-const secondaryPreStyle = {
-  ..._preStyle,
+const secondaryPreStyle = assign({}, _preStyle, {
   backgroundColor: yellowTransparent,
-};
+});
 
 const codeStyle = {
   fontFamily: 'Consolas, Menlo, monospace',
diff --git a/packages/react-error-overlay/src/components/Collapsible.js b/packages/react-error-overlay/src/components/Collapsible.js
index 92f1de4295c..1997cba1865 100644
--- a/packages/react-error-overlay/src/components/Collapsible.js
+++ b/packages/react-error-overlay/src/components/Collapsible.js
@@ -9,6 +9,7 @@
 
 /* @flow */
 import React, { Component } from 'react';
+import assign from 'object-assign';
 import { black } from '../styles';
 
 const _collapsibleStyle = {
@@ -25,15 +26,13 @@ const _collapsibleStyle = {
   lineHeight: '1.5',
 };
 
-const collapsibleCollapsedStyle = {
-  ..._collapsibleStyle,
+const collapsibleCollapsedStyle = assign({}, _collapsibleStyle, {
   marginBottom: '1.5em',
-};
+});
 
-const collapsibleExpandedStyle = {
-  ..._collapsibleStyle,
+const collapsibleExpandedStyle = assign({}, _collapsibleStyle, {
   marginBottom: '0.6em',
-};
+});
 
 class Collapsible extends Component {
   state = {
diff --git a/packages/react-error-overlay/src/components/NavigationBar.js b/packages/react-error-overlay/src/components/NavigationBar.js
index 4eba743cef7..a5506dcf711 100644
--- a/packages/react-error-overlay/src/components/NavigationBar.js
+++ b/packages/react-error-overlay/src/components/NavigationBar.js
@@ -9,6 +9,7 @@
 
 /* @flow */
 import React from 'react';
+import assign from 'object-assign';
 import { red, redTransparent } from '../styles';
 
 const navigationBarStyle = {
@@ -28,18 +29,16 @@ const _navButtonStyle = {
   cursor: 'pointer',
 };
 
-const leftButtonStyle = {
-  ..._navButtonStyle,
+const leftButtonStyle = assign({}, _navButtonStyle, {
   borderTopRightRadius: '0px',
   borderBottomRightRadius: '0px',
   marginRight: '1px',
-};
+});
 
-const rightButtonStyle = {
-  ..._navButtonStyle,
+const rightButtonStyle = assign({}, _navButtonStyle, {
   borderTopLeftRadius: '0px',
   borderBottomLeftRadius: '0px',
-};
+});
 
 type Callback = () => void;
 
diff --git a/packages/react-error-overlay/src/containers/StackFrame.js b/packages/react-error-overlay/src/containers/StackFrame.js
index c95ce003f49..6485d39fab9 100644
--- a/packages/react-error-overlay/src/containers/StackFrame.js
+++ b/packages/react-error-overlay/src/containers/StackFrame.js
@@ -174,7 +174,9 @@ class StackFrame extends Component {
               onClick={canOpenInEditor ? this.openInEditor : null}
               style={canOpenInEditor ? codeAnchorStyle : null}
             >
-              <CodeBlock {...codeBlockProps} />
+              {// Use JS instead of JSX spread attributes to avoid Object.assign
+              // in transpiled code which haven't pollyfilled at this point
+              React.createElement(CodeBlock, codeBlockProps)}
             </a>
             <button style={toggleStyle} onClick={this.toggleCompiled}>
               {'View ' + (compiled ? 'source' : 'compiled')}