Fix Cannot read property 'sub' of undefined when navigating to plain-text pages

packages/react-devtools-core/src/backend.js

@@ -158,6 +158,8 @@ export function connectToDevTools(options: ?ConnectOptions) {
 
     // TODO (npm-packages) Warn if "isBackendStorageAPISupported"
     const agent = new Agent(bridge);
+    if (hook == null) return;
+
     agent.addListener('shutdown', () => {
       // If we received 'shutdown' from `agent`, we assume the `bridge` is already shutting down,
       // and that caused the 'shutdown' event on the `agent`, so we don't need to call `bridge.shutdown()` here.

packages/react-devtools-extensions/src/backend.js

@@ -22,6 +22,10 @@ function welcome(event) {
 window.addEventListener('message', welcome);
 
 function setup(hook) {
+  if (hook == null) {
+    // DevTools didn't get injected into this page (maybe b'c of the contentType).
+    return;
+  }
   const Agent = require('react-devtools-shared/src/backend/agent').default;
   const Bridge = require('react-devtools-shared/src/bridge').default;
   const {initBackend} = require('react-devtools-shared/src/backend');
@@ -72,7 +76,7 @@ function setup(hook) {
   bridge.send('extensionBackendInitialized');
 
   // Setup React Native style editor if a renderer like react-native-web has injected it.
-  if (hook.resolveRNStyle) {
+  if (hook && hook.resolveRNStyle) {
     setupNativeStyleEditor(
       bridge,
       agent,

packages/react-devtools-extensions/src/injectGlobalHook.js

@@ -88,7 +88,7 @@ if (sessionStorageGetItem(SESSION_STORAGE_RELOAD_AND_PROFILE_KEY) === 'true') {
 
 // Inject a __REACT_DEVTOOLS_GLOBAL_HOOK__ global for React to interact with.
 // Only do this for HTML documents though, to avoid e.g. breaking syntax highlighting for XML docs.
-if (document.contentType === 'text/html') {
+if ('text/html' === document.contentType) {
   injectCode(
     ';(' +
       installHook.toString() +

packages/react-devtools-inline/src/backend.js

@@ -77,7 +77,7 @@ function finishActivation(contentWindow: window) {
   initBackend(hook, agent, contentWindow);
 
   // Setup React Native style editor if a renderer like react-native-web has injected it.
-  if (hook.resolveRNStyle) {
+  if (hook && hook.resolveRNStyle) {
     setupNativeStyleEditor(
       bridge,
       agent,

packages/react-devtools-shared/src/backend/index.js

@@ -19,6 +19,10 @@ export function initBackend(
   agent: Agent,
   global: Object,
 ): () => void {
+  if (hook == null) {
+    // DevTools didn't get injected into this page (maybe b'c of the contentType).
+    return () => {};
+  }
   const subs = [
     hook.sub(
       'renderer-attached',