Work around Chrome DevTools crash on performance.measure

Author: eps1lon

packages/react-client/src/ReactFlightPerformanceTrack.js

@@ -110,7 +110,7 @@ export function logComponentRender(
       }
       debugTask.run(
         // $FlowFixMe[method-unbinding]
-        performance.measure.bind(performance, entryName, {
+        performance.measure.bind(performance, '\u200b' + entryName, {
           start: startTime < 0 ? 0 : startTime,
           end: childrenEndTime,
           detail: {
@@ -125,7 +125,7 @@ export function logComponentRender(
       );
     } else {
       console.timeStamp(
-        entryName,
+        '\u200b' + entryName,
         startTime < 0 ? 0 : startTime,
         childrenEndTime,
         trackNames[trackIdx],
@@ -163,7 +163,7 @@ export function logComponentAborted(
       if (componentInfo.props != null) {
         addObjectToProperties(componentInfo.props, properties, 0, '');
       }
-      performance.measure(entryName, {
+      performance.measure('\u200b' + entryName, {
         start: startTime < 0 ? 0 : startTime,
         end: childrenEndTime,
         detail: {
@@ -220,7 +220,7 @@ export function logComponentErrored(
       if (componentInfo.props != null) {
         addObjectToProperties(componentInfo.props, properties, 0, '');
       }
-      performance.measure(entryName, {
+      performance.measure('\u200b' + entryName, {
         start: startTime < 0 ? 0 : startTime,
         end: childrenEndTime,
         detail: {
@@ -614,7 +614,7 @@ export function logIOInfoErrored(
         getIOLongName(ioInfo, description, ioInfo.env, rootEnv) + ' Rejected';
       debugTask.run(
         // $FlowFixMe[method-unbinding]
-        performance.measure.bind(performance, entryName, {
+        performance.measure.bind(performance, '\u200b' + entryName, {
           start: startTime < 0 ? 0 : startTime,
           end: endTime,
           detail: {
@@ -667,7 +667,7 @@ export function logIOInfo(
       );
       debugTask.run(
         // $FlowFixMe[method-unbinding]
-        performance.measure.bind(performance, entryName, {
+        performance.measure.bind(performance, '\u200b' + entryName, {
           start: startTime < 0 ? 0 : startTime,
           end: endTime,
           detail: {

packages/react-reconciler/src/ReactFiberPerformanceTrack.js

@@ -272,7 +272,7 @@ export function logComponentRender(
             // $FlowFixMe[method-unbinding]
             performance.measure.bind(
               performance,
-              name,
+              '\u200b' + name,
               reusableComponentOptions,
             ),
           );
@@ -369,10 +369,10 @@ export function logComponentErrored(
       if (__DEV__ && debugTask) {
         debugTask.run(
           // $FlowFixMe[method-unbinding]
-          performance.measure.bind(performance, name, options),
+          performance.measure.bind(performance, '\u200b' + name, options),
         );
       } else {
-        performance.measure(name, options);
+        performance.measure('\u200b' + name, options);
       }
     } else {
       console.timeStamp(
@@ -436,10 +436,10 @@ function logComponentEffectErrored(
       if (debugTask) {
         debugTask.run(
           // $FlowFixMe[method-unbinding]
-          performance.measure.bind(performance, name, options),
+          performance.measure.bind(performance, '\u200b' + name, options),
         );
       } else {
-        performance.measure(name, options);
+        performance.measure('\u200b' + name, options);
       }
     } else {
       console.timeStamp(

packages/react-server/src/__tests__/ReactFlightAsyncDebugInfo-test.js

@@ -610,7 +610,7 @@ describe('ReactFlightAsyncDebugInfo', () => {
       expect(entries).toMatchInlineSnapshot(`
         [
           {
-            "name": "Component",
+            "name": "\u200bComponent",
           },
           {
             "name": "await getData (…/pulls)",