Warn that ReactPerf does not work in the production build (#6884, #6975)

Fixes #6871

src/renderers/shared/ReactDebugTool.js

@@ -208,9 +208,7 @@ var ReactDebugTool = {
     }
   },
   getFlushHistory() {
-    if (__DEV__) {
-      return flushHistory;
-    }
+    return flushHistory;
   },
   onBeginFlush() {
     if (__DEV__) {

src/renderers/shared/ReactPerf.js

@@ -13,17 +13,41 @@
 
 var ReactDebugTool = require('ReactDebugTool');
 var warning = require('warning');
+var alreadyWarned = false;
 
 function roundFloat(val, base = 2) {
   var n = Math.pow(10, base);
   return Math.floor(val * n) / n;
 }
 
-function getFlushHistory() {
+function warnInProduction() {
+  if (alreadyWarned) {
+    return;
+  }
+  alreadyWarned = true;
+  if (typeof console !== 'undefined') {
+    console.error(
+      'ReactPerf is not supported in the production builds of React. ' +
+      'To collect measurements, please use the development build of React instead.'
+    );
+  }
+}
+
+function getLastMeasurements() {
+  if (!__DEV__) {
+    warnInProduction();
+    return [];
+  }
+
   return ReactDebugTool.getFlushHistory();
 }
 
-function getExclusive(flushHistory = getFlushHistory()) {
+function getExclusive(flushHistory = getLastMeasurements()) {
+  if (!__DEV__) {
+    warnInProduction();
+    return [];
+  }
+
   var aggregatedStats = {};
   var affectedIDs = {};
 
@@ -73,7 +97,12 @@ function getExclusive(flushHistory = getFlushHistory()) {
     );
 }
 
-function getInclusive(flushHistory = getFlushHistory()) {
+function getInclusive(flushHistory = getLastMeasurements()) {
+  if (!__DEV__) {
+    warnInProduction();
+    return [];
+  }
+
   var aggregatedStats = {};
   var affectedIDs = {};
 
@@ -141,7 +170,12 @@ function getInclusive(flushHistory = getFlushHistory()) {
     );
 }
 
-function getWasted(flushHistory = getFlushHistory()) {
+function getWasted(flushHistory = getLastMeasurements()) {
+  if (!__DEV__) {
+    warnInProduction();
+    return [];
+  }
+
   var aggregatedStats = {};
   var affectedIDs = {};
 
@@ -234,7 +268,12 @@ function getWasted(flushHistory = getFlushHistory()) {
     );
 }
 
-function getOperations(flushHistory = getFlushHistory()) {
+function getOperations(flushHistory = getLastMeasurements()) {
+  if (!__DEV__) {
+    warnInProduction();
+    return [];
+  }
+
   var stats = [];
   flushHistory.forEach((flush, flushIndex) => {
     var {operations, treeSnapshot} = flush;
@@ -258,6 +297,11 @@ function getOperations(flushHistory = getFlushHistory()) {
 }
 
 function printExclusive(flushHistory) {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   var stats = getExclusive(flushHistory);
   var table = stats.map(item => {
     var {key, instanceCount, totalDuration} = item;
@@ -279,6 +323,11 @@ function printExclusive(flushHistory) {
 }
 
 function printInclusive(flushHistory) {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   var stats = getInclusive(flushHistory);
   var table = stats.map(item => {
     var {key, instanceCount, inclusiveRenderDuration, renderCount} = item;
@@ -293,6 +342,11 @@ function printInclusive(flushHistory) {
 }
 
 function printWasted(flushHistory) {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   var stats = getWasted(flushHistory);
   var table = stats.map(item => {
     var {key, instanceCount, inclusiveRenderDuration, renderCount} = item;
@@ -307,6 +361,11 @@ function printWasted(flushHistory) {
 }
 
 function printOperations(flushHistory) {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   var stats = getOperations(flushHistory);
   var table = stats.map(stat => ({
     'Owner > Node': stat.key,
@@ -344,19 +403,34 @@ function getMeasurementsSummaryMap(measurements) {
 }
 
 function start() {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   ReactDebugTool.beginProfiling();
 }
 
 function stop() {
+  if (!__DEV__) {
+    warnInProduction();
+    return;
+  }
+
   ReactDebugTool.endProfiling();
 }
 
 function isRunning() {
+  if (!__DEV__) {
+    warnInProduction();
+    return false;
+  }
+
   return ReactDebugTool.isProfiling();
 }
 
 var ReactPerfAnalysis = {
-  getLastMeasurements: getFlushHistory,
+  getLastMeasurements,
   getExclusive,
   getInclusive,
   getWasted,

src/renderers/shared/__tests__/ReactPerf-test.js

@@ -445,4 +445,27 @@ describe('ReactPerf', function() {
     ReactPerf.stop();
     expect(ReactPerf.isRunning()).toBe(false);
   });
+
+  it('should print console error only once', () => {
+    __DEV__ = false;
+
+    spyOn(console, 'error');
+
+    expect(ReactPerf.getLastMeasurements()).toEqual([]);
+    expect(ReactPerf.getExclusive()).toEqual([]);
+    expect(ReactPerf.getInclusive()).toEqual([]);
+    expect(ReactPerf.getWasted()).toEqual([]);
+    expect(ReactPerf.getOperations()).toEqual([]);
+    expect(ReactPerf.printExclusive()).toEqual(undefined);
+    expect(ReactPerf.printInclusive()).toEqual(undefined);
+    expect(ReactPerf.printWasted()).toEqual(undefined);
+    expect(ReactPerf.printOperations()).toEqual(undefined);
+    expect(ReactPerf.start()).toBe(undefined);
+    expect(ReactPerf.stop()).toBe(undefined);
+    expect(ReactPerf.isRunning()).toBe(false);
+
+    expect(console.error.calls.count()).toBe(1);
+
+    __DEV__ = true;
+  })
 });