connectExtensionPort() — react Function Reference

Architecture documentation for the connectExtensionPort() function in index.js from the react codebase.

Function javascript BabelCompiler Validation

Entity Profile

BabelCompiler→ Validation→ connectExtensionPort() — react Function Reference

Dependency Diagram

graph TD
  30378be2_8d5d_d247_89eb_e9b7c92e28d0["connectExtensionPort()"]
  b5e42467_7633_e234_1d51_a93bfc4818c7["index.js"]
  30378be2_8d5d_d247_89eb_e9b7c92e28d0 -->|defined in| b5e42467_7633_e234_1d51_a93bfc4818c7
  style 30378be2_8d5d_d247_89eb_e9b7c92e28d0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-extensions/src/main/index.js lines 528–555

function connectExtensionPort(): void {
  if (port) {
    throw new Error('DevTools port was already connected');
  }

  const tabId = chrome.devtools.inspectedWindow.tabId;
  port = chrome.runtime.connect({
    name: String(tabId),
  });

  // If DevTools port was reconnected and Bridge was already created
  // We should subscribe bridge to this port events
  // This could happen if service worker dies and all ports are disconnected,
  // but later user continues the session and Chrome reconnects all ports
  // Bridge object is still in-memory, though
  if (lastSubscribedBridgeListener) {
    port.onMessage.addListener(lastSubscribedBridgeListener);
  }

  // This port may be disconnected by Chrome at some point, this callback
  // will be executed only if this port was disconnected from the other end
  // so, when we call `port.disconnect()` from this script,
  // this should not trigger this callback and port reconnection
  port.onDisconnect.addListener(() => {
    port = (null: $FlowFixMe);
    connectExtensionPort();
  });
}