bippy 0.6.1-dev.051a9b2 → 0.6.1-dev.3a24abf

package/src/generated/react-work-tags.ts

@@ -0,0 +1,169 @@
+// Generated by the React internals Vite+ plugin from react-devtools-core.
+
+export interface ReactWorkTagMap {
+  ActivityComponent: number;
+  CacheComponent: number;
+  ClassComponent: number;
+  ContextConsumer: number;
+  ContextProvider: number;
+  CoroutineComponent: number;
+  CoroutineHandlerPhase: number;
+  DehydratedSuspenseComponent: number;
+  ForwardRef: number;
+  Fragment: number;
+  FunctionComponent: number;
+  HostComponent: number;
+  HostHoistable: number;
+  HostPortal: number;
+  HostRoot: number;
+  HostSingleton: number;
+  HostText: number;
+  IncompleteClassComponent: number;
+  IncompleteFunctionComponent: number;
+  IndeterminateComponent: number;
+  LazyComponent: number;
+  LegacyHiddenComponent: number;
+  MemoComponent: number;
+  Mode: number;
+  OffscreenComponent: number;
+  Profiler: number;
+  ScopeComponent: number;
+  SimpleMemoComponent: number;
+  SuspenseComponent: number;
+  SuspenseListComponent: number;
+  Throw: number;
+  TracingMarkerComponent: number;
+  ViewTransitionComponent: number;
+  YieldComponent: number;
+}
+
+const defineReactWorkTags = <const VersionedWorkTags extends Record<string, ReactWorkTagMap>>(
+  workTags: VersionedWorkTags,
+): VersionedWorkTags => workTags;
+
+export const ReactWorkTags = defineReactWorkTags({
+  "17.0.1": {
+    ActivityComponent: -1,
+    CacheComponent: -1,
+    ClassComponent: 1,
+    ContextConsumer: 9,
+    ContextProvider: 10,
+    CoroutineComponent: -1,
+    CoroutineHandlerPhase: -1,
+    DehydratedSuspenseComponent: 18,
+    ForwardRef: 11,
+    Fragment: 7,
+    FunctionComponent: 0,
+    HostComponent: 5,
+    HostHoistable: -1,
+    HostPortal: 4,
+    HostRoot: 3,
+    HostSingleton: -1,
+    HostText: 6,
+    IncompleteClassComponent: 17,
+    IncompleteFunctionComponent: -1,
+    IndeterminateComponent: 2,
+    LazyComponent: 16,
+    LegacyHiddenComponent: 24,
+    MemoComponent: 14,
+    Mode: 8,
+    OffscreenComponent: 23,
+    Profiler: 12,
+    ScopeComponent: 21,
+    SimpleMemoComponent: 15,
+    SuspenseComponent: 13,
+    SuspenseListComponent: 19,
+    Throw: -1,
+    TracingMarkerComponent: -1,
+    ViewTransitionComponent: -1,
+    YieldComponent: -1,
+  },
+  "17.0.2": {
+    ActivityComponent: 31,
+    CacheComponent: 24,
+    ClassComponent: 1,
+    ContextConsumer: 9,
+    ContextProvider: 10,
+    CoroutineComponent: -1,
+    CoroutineHandlerPhase: -1,
+    DehydratedSuspenseComponent: 18,
+    ForwardRef: 11,
+    Fragment: 7,
+    FunctionComponent: 0,
+    HostComponent: 5,
+    HostHoistable: 26,
+    HostPortal: 4,
+    HostRoot: 3,
+    HostSingleton: 27,
+    HostText: 6,
+    IncompleteClassComponent: 17,
+    IncompleteFunctionComponent: 28,
+    IndeterminateComponent: 2,
+    LazyComponent: 16,
+    LegacyHiddenComponent: 23,
+    MemoComponent: 14,
+    Mode: 8,
+    OffscreenComponent: 22,
+    Profiler: 12,
+    ScopeComponent: 21,
+    SimpleMemoComponent: 15,
+    SuspenseComponent: 13,
+    SuspenseListComponent: 19,
+    Throw: 29,
+    TracingMarkerComponent: 25,
+    ViewTransitionComponent: 30,
+    YieldComponent: -1,
+  },
+});
+
+export type ReactWorkTagVersion = keyof typeof ReactWorkTags;
+
+const react17Point0Point2WorkTags = ReactWorkTags["17.0.2"];
+
+export const ActivityComponentTag = react17Point0Point2WorkTags.ActivityComponent;
+export const CacheComponentTag = react17Point0Point2WorkTags.CacheComponent;
+export const ClassComponentTag = react17Point0Point2WorkTags.ClassComponent;
+export const ContextConsumerTag = react17Point0Point2WorkTags.ContextConsumer;
+export const ContextProviderTag = react17Point0Point2WorkTags.ContextProvider;
+export const DehydratedSuspenseComponentTag =
+  react17Point0Point2WorkTags.DehydratedSuspenseComponent;
+export const ForwardRefTag = react17Point0Point2WorkTags.ForwardRef;
+export const FragmentTag = react17Point0Point2WorkTags.Fragment;
+export const FunctionComponentTag = react17Point0Point2WorkTags.FunctionComponent;
+export const HostComponentTag = react17Point0Point2WorkTags.HostComponent;
+export const HostHoistableTag = react17Point0Point2WorkTags.HostHoistable;
+export const HostPortalTag = react17Point0Point2WorkTags.HostPortal;
+export const HostRootTag = react17Point0Point2WorkTags.HostRoot;
+export const HostSingletonTag = react17Point0Point2WorkTags.HostSingleton;
+export const HostTextTag = react17Point0Point2WorkTags.HostText;
+export const IncompleteClassComponentTag = react17Point0Point2WorkTags.IncompleteClassComponent;
+export const IncompleteFunctionComponentTag =
+  react17Point0Point2WorkTags.IncompleteFunctionComponent;
+export const IndeterminateComponentTag = react17Point0Point2WorkTags.IndeterminateComponent;
+export const LazyComponentTag = react17Point0Point2WorkTags.LazyComponent;
+export const LegacyHiddenComponentTag = react17Point0Point2WorkTags.LegacyHiddenComponent;
+export const MemoComponentTag = react17Point0Point2WorkTags.MemoComponent;
+export const ModeTag = react17Point0Point2WorkTags.Mode;
+export const OffscreenComponentTag = react17Point0Point2WorkTags.OffscreenComponent;
+export const ProfilerTag = react17Point0Point2WorkTags.Profiler;
+export const ScopeComponentTag = react17Point0Point2WorkTags.ScopeComponent;
+export const SimpleMemoComponentTag = react17Point0Point2WorkTags.SimpleMemoComponent;
+export const SuspenseComponentTag = react17Point0Point2WorkTags.SuspenseComponent;
+export const SuspenseListComponentTag = react17Point0Point2WorkTags.SuspenseListComponent;
+export const ThrowTag = react17Point0Point2WorkTags.Throw;
+export const TracingMarkerComponentTag = react17Point0Point2WorkTags.TracingMarkerComponent;
+export const ViewTransitionComponentTag = react17Point0Point2WorkTags.ViewTransitionComponent;
+
+export type ReactWorkTag = Exclude<
+  (typeof ReactWorkTags)[ReactWorkTagVersion][keyof ReactWorkTagMap],
+  -1
+>;
+
+export type HostWorkTag =
+  | typeof HostComponentTag
+  | typeof HostHoistableTag
+  | typeof HostSingletonTag
+  | typeof HostTextTag;
+
+export const getReactWorkTags = (version: string): Readonly<ReactWorkTagMap> =>
+  /^17\.0\.1(?:\D|$)/.test(version) ? ReactWorkTags["17.0.1"] : ReactWorkTags["17.0.2"];

package/src/rdt-hook.ts

@@ -1,7 +1,4 @@
-// IMPORTANT:
-// this file is super important to load the __REACT_DEVTOOLS_GLOBAL_HOOK__ object
-// without this, we can't stub the React DevTools global hook, we don't have a way to instrument the application
-// make sure you import this file first before anything else (particularly React)
+// This module must load before React so renderers can inject into the hook.
 
 import type { ReactDevToolsGlobalHook, ReactRenderer } from "./types.js";
 import { toUnsubscribe, type Unsubscribe } from "./unsubscribe.js";
@@ -13,14 +10,12 @@ const objectDefineProperty = Object.defineProperty;
 // eslint-disable-next-line @typescript-eslint/unbound-method
 const objectHasOwnProperty = Object.prototype.hasOwnProperty;
 
-const NO_OP = () => {
-  /**/
-};
+const NO_OP = (): void => {};
 
 const checkDCE = (functionToCheck: unknown): void => {
   try {
     const code = Function.prototype.toString.call(functionToCheck);
-    if (code.indexOf("^_^") > -1) {
+    if (code.includes("^_^")) {
       setTimeout(() => {
         throw new Error(
           "React is running in production mode, but dead code " +
@@ -39,27 +34,12 @@ export const isRealReactDevtools = (
   return Boolean(rdtHook && "getFiberRoots" in rdtHook);
 };
 
-let isReactRefreshOverride = false;
-let injectFnStr: string | undefined = undefined;
-
-export const isReactRefresh = (
-  rdtHook: ReactDevToolsGlobalHook | undefined | null = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__,
-): boolean => {
-  if (isReactRefreshOverride) return true;
-  if (rdtHook && typeof rdtHook.inject === "function") {
-    injectFnStr = rdtHook.inject.toString();
-  }
-  // https://github.com/facebook/react/blob/8f8b336734d7c807f5aa11b0f31540e63302d789/packages/react-refresh/src/ReactFreshRuntime.js#L459
-  return Boolean(injectFnStr?.includes("(injected)"));
-};
-
 export const _onActiveListeners = new Set<() => unknown>();
 
 export const _renderers = new Set<ReactRenderer>();
 
 const rendererInjectListeners = new Set<(renderer: ReactRenderer) => void>();
-// re-wrapping inject (e.g. after the hook is replaced) leaves the old
-// wrapper in the call chain, so notifications are deduped per renderer
+// HACK: Hook replacement can leave an old inject wrapper in the call chain, so notifications must be deduplicated.
 const notifiedRenderers = new WeakSet<ReactRenderer>();
 let notifyingInject: ReactDevToolsGlobalHook["inject"] | null = null;
 
@@ -80,12 +60,7 @@ const ensureInjectNotifiesListeners = (rdtHook: ReactDevToolsGlobalHook): void =
   notifyingInject = nextInject;
 };
 
-/**
- * Subscribes to future renderer injections into the DevTools hook. The
- * single shared inject wrapper lets multiple consumers (override methods,
- * react-refresh, user code) observe renderers without stacking patches
- * whose restore order matters. Returns an unsubscribe function.
- */
+/** Subscribes to renderer injections without stacking competing hook patches. */
 export const onRendererInject = (listener: (renderer: ReactRenderer) => void): Unsubscribe => {
   ensureInjectNotifiesListeners(getRDTHook());
   rendererInjectListeners.add(listener);
@@ -94,6 +69,13 @@ export const onRendererInject = (listener: (renderer: ReactRenderer) => void): U
   });
 };
 
+const ensureRendererMap = (rdtHook: ReactDevToolsGlobalHook): Map<number, ReactRenderer> => {
+  if (!(rdtHook.renderers instanceof Map)) {
+    rdtHook.renderers = new Map();
+  }
+  return rdtHook.renderers;
+};
+
 export const installRDTHook = (onActive?: () => unknown): ReactDevToolsGlobalHook => {
   if (onActive) {
     _onActiveListeners.add(onActive);
@@ -134,19 +116,18 @@ export const installRDTHook = (onActive?: () => unknown): ReactDevToolsGlobalHoo
         if (newHook && typeof newHook === "object") {
           const ourRenderers = rdtHook.renderers;
           rdtHook = newHook;
+          const nextRenderers = ensureRendererMap(rdtHook);
           if (ourRenderers.size > 0) {
             ourRenderers.forEach((renderer, id) => {
               _renderers.add(renderer);
-              // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-              newHook.renderers.set(id, renderer);
+              nextRenderers.set(id, renderer);
             });
             patchRDTHook(onActive);
           }
         }
       },
     });
-    // [!] this is a hack for chrome extensions - if we install before React DevTools, we could accidently prevent React DevTools from installing:
-    // https://github.com/facebook/react/blob/18eaf51bd51fed8dfed661d64c306759101d0bfd/packages/react-devtools-extensions/src/contentScripts/installHook.js#L30C6-L30C27
+    // HACK: The DevTools extension uses hasOwnProperty to decide whether it may replace an earlier hook.
     // eslint-disable-next-line @typescript-eslint/unbound-method
     const originalWindowHasOwnProperty = window.hasOwnProperty;
     let hasRanHack = false;
@@ -156,7 +137,6 @@ export const installRDTHook = (onActive?: () => unknown): ReactDevToolsGlobalHoo
         try {
           if (!hasRanHack && args[0] === "__REACT_DEVTOOLS_GLOBAL_HOOK__") {
             globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = undefined;
-            // special falsy value to know that we've already installed before
             hasRanHack = true;
             return -0;
           }
@@ -175,9 +155,11 @@ export const patchRDTHook = (onActive?: () => unknown): void => {
   if (onActive) {
     _onActiveListeners.add(onActive);
   }
+  let didNotifyActiveListeners = false;
   try {
     const rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
     if (!rdtHook) return;
+    const renderers = ensureRendererMap(rdtHook);
     if (!rdtHook._instrumentationSource) {
       rdtHook.checkDCE = checkDCE;
       rdtHook.supportsFiber = true;
@@ -185,48 +167,28 @@ export const patchRDTHook = (onActive?: () => unknown): void => {
       rdtHook.hasUnsupportedRendererAttached = false;
       rdtHook._instrumentationSource = BIPPY_INSTRUMENTATION_STRING;
       rdtHook._instrumentationIsActive = false;
-      // we need to be careful here (needs to be below _instrumentationSource) else it causes excessive recursion
+      // HACK: DevTools detection must happen after setting the source to avoid recursive patching.
       const isReactDevtools = isRealReactDevtools(rdtHook);
       if (!isReactDevtools) {
         rdtHook.on = NO_OP;
       }
-      if (rdtHook.renderers.size) {
+      if (renderers.size) {
+        renderers.forEach((renderer) => _renderers.add(renderer));
         rdtHook._instrumentationIsActive = true;
         _onActiveListeners.forEach((listener) => listener());
-        return;
+        didNotifyActiveListeners = true;
       }
       const prevInject = rdtHook.inject;
-      const isRefresh = isReactRefresh(rdtHook);
-      if (isRefresh && !isReactDevtools) {
-        isReactRefreshOverride = true;
-        // but since the underlying implementation doens't care,
-        // it's ok: https://github.com/facebook/react/blob/18eaf51bd51fed8dfed661d64c306759101d0bfd/packages/react-refresh/src/ReactFreshRuntime.js#L430
-        const injectedRendererId = rdtHook.inject({
-          scheduleRefresh() {},
-        } as unknown as ReactRenderer);
-        if (injectedRendererId) {
-          rdtHook._instrumentationIsActive = true;
-        }
-      }
       rdtHook.inject = (renderer) => {
         const rendererId = prevInject(renderer);
         _renderers.add(renderer);
-        if (isRefresh) {
-          // react refresh doesn't inject this properly
-          // https://github.com/facebook/react/blob/18eaf51bd51fed8dfed661d64c306759101d0bfd/packages/react-refresh/src/ReactFreshRuntime.js#L430
-          rdtHook.renderers.set(rendererId, renderer);
-        }
+        renderers.set(rendererId, renderer);
         rdtHook._instrumentationIsActive = true;
         _onActiveListeners.forEach((listener) => listener());
         return rendererId;
       };
     }
-    if (
-      rdtHook.renderers.size ||
-      rdtHook._instrumentationIsActive ||
-      // depending on this to inject is unsafe, since inject could occur before and we wouldn't know
-      isReactRefresh()
-    ) {
+    if (!didNotifyActiveListeners && (renderers.size || rdtHook._instrumentationIsActive)) {
       onActive?.();
     }
   } catch {}
@@ -245,8 +207,7 @@ export const getRDTHook = (onActive?: () => unknown): ReactDevToolsGlobalHook =>
   }
 
   patchRDTHook(onActive);
-  // must exist at this point
-  return globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ as ReactDevToolsGlobalHook;
+  return globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ ?? installRDTHook(onActive);
 };
 
 export const isClientEnvironment = (): boolean => {
@@ -257,12 +218,8 @@ export const isClientEnvironment = (): boolean => {
   );
 };
 
-/**
- * Usually used purely for side effect
- */
 export const safelyInstallRDTHook = () => {
   try {
-    // __REACT_DEVTOOLS_GLOBAL_HOOK__ must exist before React is ever executed
     if (isClientEnvironment()) {
       getRDTHook();
     }

package/src/react-internals.ts

@@ -0,0 +1,67 @@
+export {
+  ActivityComponentTag,
+  ClassComponentTag,
+  ContextConsumerTag,
+  DehydratedSuspenseComponentTag,
+  ForwardRefTag,
+  FragmentTag,
+  FunctionComponentTag,
+  getReactWorkTags,
+  HostComponentTag,
+  HostHoistableTag,
+  HostPortalTag,
+  HostRootTag,
+  HostSingletonTag,
+  HostTextTag,
+  LazyComponentTag,
+  LegacyHiddenComponentTag,
+  MemoComponentTag,
+  OffscreenComponentTag,
+  ReactWorkTags,
+  SimpleMemoComponentTag,
+  SuspenseComponentTag,
+  SuspenseListComponentTag,
+  ViewTransitionComponentTag,
+} from "./generated/react-work-tags.js";
+export type {
+  HostWorkTag,
+  ReactWorkTag,
+  ReactWorkTagMap,
+  ReactWorkTagVersion,
+} from "./generated/react-work-tags.js";
+
+// HACK: React does not export Fiber flags. Keep these values aligned with ReactFiberFlags.
+export const ReactFiberFlags = {
+  ChildDeletion: 0b10000,
+  Cloned: 0b1000,
+  ContentReset: 0b100000,
+  Hydrating: 0b1000000000000,
+  PerformedWork: 0b1,
+  Placement: 0b10,
+  Snapshot: 0b10000000000,
+  Update: 0b100,
+  Visibility: 0b10000000000000,
+};
+
+export const ReactBuildType = {
+  Development: 1,
+  Production: 0,
+};
+
+export const MutationMask =
+  ReactFiberFlags.Placement |
+  ReactFiberFlags.Update |
+  ReactFiberFlags.ChildDeletion |
+  ReactFiberFlags.ContentReset |
+  ReactFiberFlags.Hydrating |
+  ReactFiberFlags.Visibility |
+  ReactFiberFlags.Snapshot;
+
+// HACK: React does not export its legacy mode and element symbols, which differ between React 17, 18, and 19.
+export const CONCURRENT_MODE_NUMBER = 0xeacf;
+export const ELEMENT_TYPE_SYMBOL_STRING = "Symbol(react.element)";
+export const TRANSITIONAL_ELEMENT_TYPE_SYMBOL_STRING = "Symbol(react.transitional.element)";
+export const CONCURRENT_MODE_SYMBOL_STRING = "Symbol(react.concurrent_mode)";
+export const DEPRECATED_ASYNC_MODE_SYMBOL_STRING = "Symbol(react.async_mode)";
+export const CONCURRENT_MODE_SYMBOL_DESCRIPTION = "react.concurrent_mode";
+export const DEPRECATED_ASYNC_MODE_SYMBOL_DESCRIPTION = "react.async_mode";

package/src/source/constants.ts

@@ -18,7 +18,7 @@ export const SERVER_COMPONENT_URL_PREFIXES = ["rsc://", ABOUT_REACT_PREFIX] as c
 
 export const ANONYMOUS_FILE_PATTERNS = ["<anonymous>", "eval", ""] as const;
 
-export const SOURCE_FILE_EXTENSION_REGEX = /\.(jsx|tsx|ts|js)$/;
+export const SOURCE_FILE_EXTENSION_REGEX = /\.(cjs|cts|js|jsx|mdx|mjs|mts|ts|tsx)$/;
 
 export const BUNDLED_FILE_PATTERN_REGEX =
   /(\.min|bundle|chunk|vendor|vendors|runtime|polyfill|polyfills)\.(js|mjs|cjs)$|(chunk|bundle|vendor|vendors|runtime|polyfill|polyfills|framework|app|main|index)[-_.][A-Za-z0-9_-]{4,}\.(js|mjs|cjs)$|[\da-f]{8,}\.(js|mjs|cjs)$|[-_.][\da-f]{20,}\.(js|mjs|cjs)$|\/dist\/|\/build\/|\/.next\/|\/out\/|\/node_modules\/|\.webpack\.|\.vite\.|\.turbopack\./i;

package/src/source/get-source.ts

@@ -171,6 +171,7 @@ export const normalizeFileName = (fileName: string): string => {
   }
 
   let normalizedFileName = fileName;
+  const isWindowsDrivePath = /^[a-zA-Z]:[\\/]/.test(normalizedFileName);
 
   const isHttpUrl =
     normalizedFileName.startsWith("http://") || normalizedFileName.startsWith("https://");
@@ -214,7 +215,7 @@ export const normalizeFileName = (fileName: string): string => {
     }
   }
 
-  if (SCHEME_REGEX.test(normalizedFileName)) {
+  if (!isWindowsDrivePath && SCHEME_REGEX.test(normalizedFileName)) {
     const schemeMatch = normalizedFileName.match(SCHEME_REGEX);
     if (schemeMatch) {
       normalizedFileName = normalizedFileName.slice(schemeMatch[0].length);