Preserve error codes for invariants on www

Author: gaearon

packages/shared/forks/reactProdInvariant.www.js

@@ -0,0 +1,36 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+const invariant = require('invariant');
+
+function reactProdInvariant(code: string): void {
+  const argCount = arguments.length - 1;
+
+  let message =
+    'Minified React error #' +
+    code +
+    '; visit ' +
+    'http://reactjs.org/docs/error-decoder.html?invariant=' +
+    code;
+
+  for (let argIdx = 0; argIdx < argCount; argIdx++) {
+    message += '&args[]=' + encodeURIComponent(arguments[argIdx + 1]);
+  }
+
+  message +=
+    ' for the full message or use the non-minified dev environment' +
+    ' for full errors and additional helpful warnings.';
+
+  // www doesn't strip this because we mark the React bundle
+  // with @preserve-invariant-messages docblock.
+  // eslint-disable-next-line react-internal/warning-and-invariant-args
+  invariant(false, message);
+}
+
+export default reactProdInvariant;

packages/shared/reactProdInvariant.js

@@ -31,6 +31,9 @@ function reactProdInvariant(code: string): void {
     ' for the full message or use the non-minified dev environment' +
     ' for full errors and additional helpful warnings.';
 
+  // Note: if you update the code above, don't forget
+  // to update the www fork in forks/reactProdInvariant.www.js.
+
   const error: Error & {framesToPop?: number} = new Error(message);
   error.name = 'Invariant Violation';
   error.framesToPop = 1; // we don't care about reactProdInvariant's own frame

scripts/error-codes/replace-invariant-error-codes.js

@@ -7,6 +7,7 @@
 'use strict';
 
 const fs = require('fs');
+const {basename} = require('path');
 const evalToString = require('../shared/evalToString');
 const invertObject = require('./invertObject');
 
@@ -37,6 +38,13 @@ module.exports = function(babel) {
     visitor: {
       CallExpression: {
         exit(path, file) {
+          if (
+            basename(file.file.opts.filename) === 'reactProdInvariant.www.js'
+          ) {
+            // In the www fork, `invariant` refers to the www invariant implementation.
+            // So we should not attempt to replace it.
+            return;
+          }
           const node = path.node;
           // Ignore if it's already been processed
           if (node[SEEN_SYMBOL]) {

scripts/rollup/build.js

@@ -82,6 +82,14 @@ function getBabelConfig(updateBabelOptions, bundleType, filename) {
   switch (bundleType) {
     case FB_DEV:
     case FB_PROD:
+      return Object.assign({}, options, {
+        plugins: options.plugins.concat([
+          // Minify invariant messages
+          require('../error-codes/replace-invariant-error-codes'),
+          // Wrap warning() calls in a __DEV__ check so they are stripped from production.
+          require('../babel/wrap-warning-with-env-check'),
+        ]),
+      });
     case RN_DEV:
     case RN_PROD:
       return Object.assign({}, options, {

scripts/rollup/forks.js

@@ -84,6 +84,17 @@ const forks = Object.freeze({
     }
   },
 
+  // Route production invariants on www through the www invariant module.
+  'shared/reactProdInvariant': (bundleType, entry) => {
+    switch (bundleType) {
+      case FB_DEV:
+      case FB_PROD:
+        return 'shared/forks/reactProdInvariant.www.js';
+      default:
+        return null;
+    }
+  },
+
   // Different dialogs for caught errors.
   'react-reconciler/src/ReactFiberErrorDialog': (bundleType, entry) => {
     switch (bundleType) {

scripts/rollup/wrappers.js

@@ -94,6 +94,7 @@ ${license}
  *
  * @noflow
  * @preventMunge
+ * @preserve-invariant-messages
  */
 
 'use strict';
@@ -112,6 +113,7 @@ ${license}
  *
  * @noflow
  * @preventMunge
+ * @preserve-invariant-messages
  */
 
 ${source}`;