Merge pull request #8393 from apollographql/protect-__DEV__-from-mism…

…inification Protect `__DEV__` from mis-minification / aggressive tree-shaking
apollographql · Jun 17, 2021 · 666ed72 · 666ed72
2 parents 608784c + e04e959
commit 666ed72
Show file tree

Hide file tree

Showing 12 changed files with 38 additions and 13 deletions.
diff --git a/config/entryPoints.js b/config/entryPoints.js
@@ -22,7 +22,10 @@ const entryPoints = [
   { dirs: ['react', 'hooks'] },
   { dirs: ['react', 'parser'] },
   { dirs: ['react', 'ssr'] },
-  { dirs: ['utilities'] },
+  { dirs: ['utilities'],
+    sideEffects: [
+      "./globals/**"
+    ]},
   { dirs: ['testing'], extensions: [".js", ".jsx"] },
 ];
 

diff --git a/config/prepareDist.js b/config/prepareDist.js
@@ -62,6 +62,7 @@ fs.copyFileSync(`${srcDir}/LICENSE`,  `${destDir}/LICENSE`);
 entryPoints.forEach(function buildPackageJson({
   dirs,
   bundleName = dirs[dirs.length - 1],
+  sideEffects = false,
 }) {
   if (!dirs.length) return;
   fs.writeFileSync(
@@ -71,7 +72,7 @@ entryPoints.forEach(function buildPackageJson({
       main: `${bundleName}.cjs.js`,
       module: 'index.js',
       types: 'index.d.ts',
-      sideEffects: false,
+      sideEffects,
     }, null, 2) + "\n",
   );
 });
diff --git a/src/__tests__/__snapshots__/exports.ts.snap b/src/__tests__/__snapshots__/exports.ts.snap
@@ -9,7 +9,6 @@ Array [
   "ApolloLink",
   "ApolloProvider",
   "Cache",
-  "DEV",
   "DocumentType",
   "HttpLink",
   "InMemoryCache",
@@ -65,7 +64,6 @@ exports[`exports of public entry points @apollo/client/cache 1`] = `
 Array [
   "ApolloCache",
   "Cache",
-  "DEV",
   "EntityStore",
   "InMemoryCache",
   "MissingFieldError",
@@ -87,7 +85,6 @@ Array [
   "ApolloError",
   "ApolloLink",
   "Cache",
-  "DEV",
   "HttpLink",
   "InMemoryCache",
   "MissingFieldError",
@@ -228,7 +225,6 @@ exports[`exports of public entry points @apollo/client/react 1`] = `
 Array [
   "ApolloConsumer",
   "ApolloProvider",
-  "DEV",
   "DocumentType",
   "getApolloContext",
   "operationName",

diff --git a/src/cache/index.ts b/src/cache/index.ts
@@ -1,4 +1,6 @@
-export { DEV } from "../utilities";
+import { invariant } from "ts-invariant";
+import { DEV } from "../utilities";
+invariant("boolean" === typeof DEV, DEV);
 
 export { Transaction, ApolloCache } from './core/cache';
 export { Cache } from './core/types/Cache';

diff --git a/src/core/index.ts b/src/core/index.ts
@@ -1,6 +1,6 @@
 /* Core */
 
-export { DEV } from "../utilities";
+import { DEV } from "../utilities";
 
 export {
   ApolloClient,
@@ -91,7 +91,7 @@ export {
 // Note that all invariant.* logging is hidden in production.
 import { setVerbosity } from "ts-invariant";
 export { setVerbosity as setLogVerbosity }
-setVerbosity("log");
+setVerbosity(DEV ? "log" : "silent");
 
 // Note that importing `gql` by itself, then destructuring
 // additional properties separately before exporting, is intentional.

diff --git a/src/errors/index.ts b/src/errors/index.ts
@@ -1,3 +1,7 @@
+import { invariant } from "ts-invariant";
+import { DEV } from "../utilities";
+invariant("boolean" === typeof DEV, DEV);
+
 import { GraphQLError } from 'graphql';
 
 import { isNonEmptyArray } from '../utilities';

diff --git a/src/link/core/index.ts b/src/link/core/index.ts
@@ -1,3 +1,7 @@
+import { invariant } from "ts-invariant";
+import { DEV } from "../../utilities";
+invariant("boolean" === typeof DEV, DEV);
+
 export { empty } from './empty';
 export { from } from './from';
 export { split } from './split';

diff --git a/src/react/index.ts b/src/react/index.ts
@@ -1,4 +1,6 @@
-export { DEV } from "../utilities";
+import { invariant } from "ts-invariant";
+import { DEV } from "../utilities";
+invariant("boolean" === typeof DEV, DEV);
 
 export {
   ApolloProvider,

diff --git a/src/testing/index.ts b/src/testing/index.ts
@@ -1 +1,4 @@
+import { invariant } from "ts-invariant";
+import { DEV } from "../utilities";
+invariant("boolean" === typeof DEV, DEV);
 export * from '../utilities/testing';
diff --git a/src/utilities/globals/__DEV__.ts → src/utilities/globals/DEV.ts b/src/utilities/globals/__DEV__.ts → src/utilities/globals/DEV.ts
@@ -1,11 +1,17 @@
 import global from "../common/global";
 import { maybe } from "../common/maybe";
 
+// To keep string-based find/replace minifiers from messing with __DEV__ inside
+// string literals or properties like global.__DEV__, we construct the "__DEV__"
+// string in a roundabout way that won't be altered by find/replace strategies.
+const __ = "__";
+const GLOBAL_KEY = [__, __].join("DEV");
+
 function getDEV() {
   try {
     return Boolean(__DEV__);
   } catch {
-    Object.defineProperty(global, "__DEV__", {
+    Object.defineProperty(global, GLOBAL_KEY, {
       // In a buildless browser environment, maybe(() => process.env.NODE_ENV)
       // evaluates as undefined, so __DEV__ becomes true by default, but can be
       // initialized to false instead by a script/module that runs earlier.
@@ -14,7 +20,9 @@ function getDEV() {
       configurable: true,
       writable: true,
     });
-    return global.__DEV__;
+    // Using computed property access rather than global.__DEV__ here prevents
+    // string-based find/replace strategies from munging this to global.false:
+    return (global as any)[GLOBAL_KEY];
   }
 }
 

diff --git a/src/utilities/globals/index.ts b/src/utilities/globals/index.ts
@@ -1,6 +1,6 @@
 // Just in case the graphql package switches from process.env.NODE_ENV to
 // __DEV__, make sure __DEV__ is polyfilled before importing graphql.
-import DEV from "./__DEV__";
+import DEV from "./DEV";
 export { DEV }
 
 // Import graphql/jsutils/instanceOf safely, working around its unchecked usage

diff --git a/src/utilities/index.ts b/src/utilities/index.ts
@@ -1,4 +1,6 @@
+import { invariant } from "ts-invariant";
 import { DEV } from "./globals";
+invariant("boolean" === typeof DEV, DEV);
 export { DEV }
 
 export {