From 0007ef4b27aa91356e41db3c2a108d3bcb3ea551 Mon Sep 17 00:00:00 2001
From: Michel Weststrate <mweststrate@fb.com>
Date: Mon, 8 Jun 2020 11:54:43 -0700
Subject: [PATCH] Disable sourcemaps for emotion to fix chrome Profiler freeze

Summary:
When trying to profile the Electron app, since recently the profiler hangs when trying to start the initializer. Found the following weird message in the console and googled the problem :-P

{F239554230}

Reviewed By: jknoxville

Differential Revision: D21929677

fbshipit-source-id: 7a9f150ebc8df30fa2890c9dbb79c8c144a5feae
---
 .../ExportDataPluginSheet.node.tsx.snap       | 48 +++++++++----------
 .../ShareSheetPendingDialog.node.tsx.snap     | 16 +++----
 desktop/babel-transformer/src/transform.ts    |  7 ++-
 3 files changed, 37 insertions(+), 34 deletions(-)

diff --git a/desktop/app/src/chrome/__tests__/__snapshots__/ExportDataPluginSheet.node.tsx.snap b/desktop/app/src/chrome/__tests__/__snapshots__/ExportDataPluginSheet.node.tsx.snap
index eb7b9dfe9..05d9a1c1b 100644
--- a/desktop/app/src/chrome/__tests__/__snapshots__/ExportDataPluginSheet.node.tsx.snap
+++ b/desktop/app/src/chrome/__tests__/__snapshots__/ExportDataPluginSheet.node.tsx.snap
@@ -2,13 +2,13 @@
 
 exports[`SettingsSheet snapshot with nothing enabled 1`] = `
 <div
-  className="css-1xa1n93-View-FlexBox-FlexColumn"
+  className="css-12h374y-View-FlexBox-FlexColumn"
 >
   <div
-    className="css-n1ycch-View-FlexBox-FlexColumn"
+    className="css-8h6kz5-View-FlexBox-FlexColumn"
   >
     <div
-      className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+      className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
     >
       <span
         className="css-1qd3nqz-Text"
@@ -16,10 +16,10 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
         Select the plugins for which you want to export the data
       </span>
       <div
-        className="css-1tewvx4-View-FlexBox-FlexColumn"
+        className="css-1k23ouh-View-FlexBox-FlexColumn"
       >
         <div
-          className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+          className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
         >
           <div
             className="css-yzqaun-TooltipContainer e1abcqbd0"
@@ -30,7 +30,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
               className="css-1jrm6r3"
             >
               <div
-                className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+                className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
                 style={
                   Object {
                     "alignItems": "center",
@@ -43,7 +43,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
                   TestDevicePlugin
                 </span>
                 <div
-                  className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+                  className="css-te359u-View-FlexBox-Spacer e13mj6h81"
                 />
                 <input
                   checked={false}
@@ -60,7 +60,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
           </div>
         </div>
         <div
-          className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+          className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
         >
           <div
             className="css-yzqaun-TooltipContainer e1abcqbd0"
@@ -71,7 +71,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
               className="css-1jrm6r3"
             >
               <div
-                className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+                className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
                 style={
                   Object {
                     "alignItems": "center",
@@ -84,7 +84,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
                   TestPlugin
                 </span>
                 <div
-                  className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+                  className="css-te359u-View-FlexBox-Spacer e13mj6h81"
                 />
                 <input
                   checked={false}
@@ -106,10 +106,10 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
       className="css-1yqvjo0"
     >
       <div
-        className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+        className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
       >
         <div
-          className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+          className="css-te359u-View-FlexBox-Spacer e13mj6h81"
         />
         <div
           className="css-12n892b"
@@ -147,13 +147,13 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
 
 exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
 <div
-  className="css-1xa1n93-View-FlexBox-FlexColumn"
+  className="css-12h374y-View-FlexBox-FlexColumn"
 >
   <div
-    className="css-n1ycch-View-FlexBox-FlexColumn"
+    className="css-8h6kz5-View-FlexBox-FlexColumn"
   >
     <div
-      className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+      className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
     >
       <span
         className="css-1qd3nqz-Text"
@@ -161,10 +161,10 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
         Select the plugins for which you want to export the data
       </span>
       <div
-        className="css-1tewvx4-View-FlexBox-FlexColumn"
+        className="css-1k23ouh-View-FlexBox-FlexColumn"
       >
         <div
-          className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+          className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
         >
           <div
             className="css-yzqaun-TooltipContainer e1abcqbd0"
@@ -175,7 +175,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
               className="css-1jrm6r3"
             >
               <div
-                className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+                className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
                 style={
                   Object {
                     "alignItems": "center",
@@ -188,7 +188,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
                   TestDevicePlugin
                 </span>
                 <div
-                  className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+                  className="css-te359u-View-FlexBox-Spacer e13mj6h81"
                 />
                 <input
                   checked={false}
@@ -205,7 +205,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
           </div>
         </div>
         <div
-          className="css-6ueghe-View-FlexBox-FlexColumn ecr18to0"
+          className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0"
         >
           <div
             className="css-yzqaun-TooltipContainer e1abcqbd0"
@@ -216,7 +216,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
               className="css-1jrm6r3"
             >
               <div
-                className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+                className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
                 style={
                   Object {
                     "alignItems": "center",
@@ -229,7 +229,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
                   TestPlugin
                 </span>
                 <div
-                  className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+                  className="css-te359u-View-FlexBox-Spacer e13mj6h81"
                 />
                 <input
                   checked={true}
@@ -251,10 +251,10 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
       className="css-1yqvjo0"
     >
       <div
-        className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+        className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
       >
         <div
-          className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+          className="css-te359u-View-FlexBox-Spacer e13mj6h81"
         />
         <div
           className="css-12n892b"
diff --git a/desktop/app/src/chrome/__tests__/__snapshots__/ShareSheetPendingDialog.node.tsx.snap b/desktop/app/src/chrome/__tests__/__snapshots__/ShareSheetPendingDialog.node.tsx.snap
index e556a8581..0b01edfe1 100644
--- a/desktop/app/src/chrome/__tests__/__snapshots__/ShareSheetPendingDialog.node.tsx.snap
+++ b/desktop/app/src/chrome/__tests__/__snapshots__/ShareSheetPendingDialog.node.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
 <div
-  className="css-4jq4zm-View-FlexBox-FlexColumn"
+  className="css-75dkqw-View-FlexBox-FlexColumn"
   style={
     Object {
       "width": undefined,
@@ -10,7 +10,7 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
   }
 >
   <div
-    className="css-augv40-View-FlexBox-FlexColumn"
+    className="css-t9ud5p-View-FlexBox-FlexColumn"
   >
     <div
       className="css-hs91vy-LoadingIndicator eq9prj20"
@@ -24,10 +24,10 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
     </span>
   </div>
   <div
-    className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+    className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
   >
     <div
-      className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+      className="css-te359u-View-FlexBox-Spacer e13mj6h81"
     />
     <div
       className="css-dltu4w-StyledButton enfqd40"
@@ -52,7 +52,7 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
 
 exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
 <div
-  className="css-4jq4zm-View-FlexBox-FlexColumn"
+  className="css-75dkqw-View-FlexBox-FlexColumn"
   style={
     Object {
       "width": undefined,
@@ -60,7 +60,7 @@ exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
   }
 >
   <div
-    className="css-augv40-View-FlexBox-FlexColumn"
+    className="css-t9ud5p-View-FlexBox-FlexColumn"
   >
     <div
       className="css-hs91vy-LoadingIndicator eq9prj20"
@@ -74,10 +74,10 @@ exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
     </span>
   </div>
   <div
-    className="css-1qo4xci-View-FlexBox-FlexRow epz0qe20"
+    className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20"
   >
     <div
-      className="css-1xx6adg-View-FlexBox-Spacer e13mj6h81"
+      className="css-te359u-View-FlexBox-Spacer e13mj6h81"
     />
     <div
       className="css-dltu4w-StyledButton enfqd40"
diff --git a/desktop/babel-transformer/src/transform.ts b/desktop/babel-transformer/src/transform.ts
index a6a048d81..bcc1e99a2 100644
--- a/desktop/babel-transformer/src/transform.ts
+++ b/desktop/babel-transformer/src/transform.ts
@@ -48,7 +48,10 @@ const tsTransformPlugins = [
   commonJsPlugin,
   optionalChainingPlugin,
   coalescingOperatorPlugin,
-  [emotionPlugin, {autoLabel: true}],
+  // Sourcemap disabled because
+  // https://github.com/electron/electron/issues/17772#issuecomment-570795784
+  // https://github.com/emotion-js/emotion/issues/1838
+  [emotionPlugin, {autoLabel: true, sourceMap: false}],
 ];
 const jsTransformPlugins = [
   commonJsPlugin,
@@ -58,7 +61,7 @@ const jsTransformPlugins = [
   optionalChainingPlugin,
   coalescingOperatorPlugin,
   dynamicRequiresPlugin,
-  [emotionPlugin, {autoLabel: true}],
+  [emotionPlugin, {autoLabel: true, sourceMap: false}],
 ];
 
 export default function transform({