bippy 0.7.2 → 0.7.3-dev.0ac832d

package/src/source/inspect-hooks.ts

@@ -1,8 +1,11 @@
+import { getRenderer } from "../core.js";
+import type { ReactDevToolsTarget } from "../rdt-hook.js";
 import type {
   Fiber,
   ContextDependency,
   MemoizedState,
   ReactContext,
+  ReactDebugInfo,
   RendererDispatcherRef,
 } from "../react-internals/index.js";
 import {
@@ -11,7 +14,7 @@ import {
   BippyUnsupportedHookError,
 } from "../errors.js";
 import { getReactWorkTagsForFiber } from "../react-internals/index.js";
-import { parseStack, type StackFrame } from "./parse-stack.js";
+import { createStackParser, parseStack, type StackFrame } from "./parse-stack.js";
 import {
   getRendererDispatcherRefs,
   readDispatcher,
@@ -20,6 +23,7 @@ import {
 
 const REACT_CONTEXT_TYPE = Symbol.for("react.context");
 const REACT_MEMO_CACHE_SENTINEL = Symbol.for("react.memo_cache_sentinel");
+const REACT_RECOVERABLE_TYPE = Symbol.for("react.recoverable");
 
 export interface HookSource {
   lineNumber: number | null;
@@ -34,6 +38,7 @@ export interface HooksNode {
   name: string;
   value: unknown;
   subHooks: HooksNode[];
+  debugInfo: ReactDebugInfo[] | null;
   hookSource: HookSource | null;
 }
 
@@ -44,6 +49,7 @@ interface HookLogEntry {
   primitive: string;
   stackError: Error;
   value: unknown;
+  debugInfo: ReactDebugInfo[] | null;
   dispatcherHookName: string;
 }
 
@@ -61,6 +67,7 @@ interface InspectableThenable {
   status?: unknown;
   then: (...arguments_: unknown[]) => unknown;
   value?: unknown;
+  _debugInfo?: ReactDebugInfo[];
 }
 
 interface ForwardRefRenderType {
@@ -68,6 +75,7 @@ interface ForwardRefRenderType {
 }
 
 interface InspectedActionState {
+  debugInfo: ReactDebugInfo[] | null;
   error: unknown;
   value: unknown;
 }
@@ -79,6 +87,16 @@ let currentHook: MemoizedState | null = null;
 let currentContextDependency: ContextDependency<unknown> | null = null;
 let currentThenableIndex = 0;
 let currentThenableState: unknown[] | null = null;
+let currentMemoCacheIndex = 0;
+let isInspectingHooks = false;
+
+const assertNotInspectingHooks = (): void => {
+  if (isInspectingHooks) {
+    throw new BippyHookInspectionError(
+      "Hook inspection cannot be called during another inspection.",
+    );
+  }
+};
 
 const SuspenseException: unknown = new Error(
   "Suspense interrupted this render. This error is an internal implementation detail of `use`.",
@@ -132,12 +150,14 @@ const pushHookLogEntry = (
   value: unknown,
   dispatcherHookName: string,
   displayName: string | null = null,
+  debugInfo: ReactDebugInfo[] | null = null,
 ): void => {
   hookLog.push({
     displayName,
     primitive,
     stackError: new Error(),
     value,
+    debugInfo,
     dispatcherHookName,
   });
 };
@@ -153,22 +173,26 @@ const dispatcherUse = (usable: unknown): unknown => {
 
       switch (thenable.status) {
         case "fulfilled": {
-          pushHookLogEntry("Promise", thenable.value, "Use");
+          pushHookLogEntry("Promise", thenable.value, "Use", null, thenable._debugInfo ?? null);
           return thenable.value;
         }
         case "rejected":
           throw thenable.reason;
       }
-      pushHookLogEntry("Unresolved", thenable, "Use");
+      pushHookLogEntry("Unresolved", thenable, "Use", null, thenable._debugInfo ?? null);
       throw SuspenseException;
     }
+    if ("$$typeof" in usable && usable.$$typeof === REACT_RECOVERABLE_TYPE) {
+      pushHookLogEntry("Recoverable", undefined, "Use");
+      return undefined;
+    }
     if ("$$typeof" in usable && usable.$$typeof === REACT_CONTEXT_TYPE && isReactContext(usable)) {
       const context: InspectableReactContext = {
         _currentValue: usable._currentValue,
         displayName: typeof usable.displayName === "string" ? usable.displayName : undefined,
       };
       const value = readContext(context);
-      pushHookLogEntry("Context (use)", value, "Use", context.displayName ?? "Context");
+      pushHookLogEntry("Context (use)", value, "Use", context.displayName || "Context");
       return value;
     }
   }
@@ -177,7 +201,7 @@ const dispatcherUse = (usable: unknown): unknown => {
 
 const dispatcherUseContext = (context: InspectableReactContext): unknown => {
   const value = readContext(context);
-  pushHookLogEntry("Context", value, "Context", context.displayName ?? null);
+  pushHookLogEntry("Context", value, "Context", context.displayName || null);
   return value;
 };
 
@@ -304,21 +328,13 @@ const dispatcherUseId = (): string => {
 
 const dispatcherUseMemoCache = (size: number): unknown[] => {
   const fiber = currentFiber;
-  if (fiber === null || fiber === undefined) return [];
+  if (fiber === null) return [];
 
   const memoCache = fiber.updateQueue?.memoCache;
   if (memoCache === null || memoCache === undefined) return [];
 
-  let memoCacheSlots = memoCache.data[memoCache.index];
-  if (memoCacheSlots === undefined) {
-    memoCacheSlots = memoCache.data[memoCache.index] = Array.from(
-      { length: size },
-      () => REACT_MEMO_CACHE_SENTINEL,
-    );
-  }
-
-  memoCache.index++;
-  return memoCacheSlots;
+  const memoCacheSlots = memoCache.data[currentMemoCacheIndex++];
+  return memoCacheSlots?.slice() ?? Array.from({ length: size }, () => REACT_MEMO_CACHE_SENTINEL);
 };
 
 const dispatcherUseOptimistic = (passthrough: unknown): [unknown, () => void] => {
@@ -333,6 +349,7 @@ const inspectActionStateHook = (
   initialState: unknown,
 ): InspectedActionState => {
   let value: unknown;
+  let debugInfo: ReactDebugInfo[] | null = null;
   let error: unknown = null;
   if (hook !== null) {
     const actionResult = hook.memoizedState;
@@ -340,6 +357,7 @@ const inspectActionStateHook = (
       switch (actionResult.status) {
         case "fulfilled":
           value = actionResult.value;
+          debugInfo = actionResult._debugInfo ?? null;
           break;
         case "rejected":
           error = actionResult.reason;
@@ -347,6 +365,7 @@ const inspectActionStateHook = (
         default:
           error = SuspenseException;
           value = actionResult;
+          debugInfo = actionResult._debugInfo ?? null;
       }
     } else {
       value = actionResult;
@@ -354,7 +373,7 @@ const inspectActionStateHook = (
   } else {
     value = initialState;
   }
-  return { value, error };
+  return { value, debugInfo, error };
 };
 
 const createActionStateDispatcher =
@@ -363,8 +382,8 @@ const createActionStateDispatcher =
     const hook = nextHook();
     nextHook();
     nextHook();
-    const { value, error } = inspectActionStateHook(hook, initialState);
-    pushHookLogEntry(primitive, value, primitive);
+    const { value, debugInfo, error } = inspectActionStateHook(hook, initialState);
+    pushHookLogEntry(primitive, value, primitive, null, debugInfo);
     if (error !== null) throw error;
     return [value, () => {}, false];
   };
@@ -449,6 +468,7 @@ const getPrimitiveStackCache = (): Map<string, StackFrame[]> => {
     dispatcher.useActionState((state: unknown) => state, null);
     dispatcher.useHostTransitionStatus();
     dispatcher.use({ $$typeof: REACT_CONTEXT_TYPE, _currentValue: null });
+    dispatcher.use({ $$typeof: REACT_RECOVERABLE_TYPE });
     const fulfilledPromise = Promise.resolve(null);
     Reflect.set(fulfilledPromise, "status", "fulfilled");
     Reflect.set(fulfilledPromise, "value", null);
@@ -532,6 +552,19 @@ const parseHookName = (functionName: string | undefined): string => {
   return functionName.slice(startIndex);
 };
 
+// Unlike upstream, bippy routes every dispatcher method through a shared log helper, so those
+// frames appear in captured stacks and must not become tree levels. Names are read off the
+// live functions rather than matched by prefix, so user hooks cannot collide and minified
+// builds stay accurate.
+const INTERNAL_HOOK_FRAME_NAMES = new Set(
+  [pushHookLogEntry, ...Object.values(dispatcher)].map((internalFunction) =>
+    parseHookName(internalFunction.name),
+  ),
+);
+
+const isInternalHookFrame = (hookName: string): boolean =>
+  hookName !== "" && INTERNAL_HOOK_FRAME_NAMES.has(hookName);
+
 const isReactWrapper = (functionName: string | undefined, wrapperName: string): boolean => {
   const hookName = parseHookName(functionName);
   if (wrapperName === "HostTransitionStatus") {
@@ -571,8 +604,9 @@ const findPrimitiveIndex = (hookStack: StackFrame[], hook: HookLogEntry): number
 const parseTrimmedStack = (
   rootStack: StackFrame[],
   hook: HookLogEntry,
+  parseHookStack: (stack: string) => StackFrame[],
 ): [StackFrame | null, StackFrame[] | null] => {
-  const hookStack = parseErrorStack(hook.stackError);
+  const hookStack = parseHookStack(hook.stackError.stack || "");
   const rootIndex = findCommonAncestorIndex(rootStack, hookStack);
   const primitiveIndex = findPrimitiveIndex(hookStack, hook);
   if (rootIndex === -1 || primitiveIndex === -1 || rootIndex - primitiveIndex < 2) {
@@ -593,17 +627,20 @@ const NON_ID_HOOK_PRIMITIVES = new Set([
 
 const buildTree = (rootStack: StackFrame[], capturedHookLog: HookLogEntry[]): HooksTree => {
   const rootChildren: HooksNode[] = [];
+  const parseHookStack = createStackParser();
   let previousStack: StackFrame[] | null = null;
   let levelChildren = rootChildren;
   let nativeHookID = 0;
   const childrenStack: HooksNode[][] = [];
 
   for (const hook of capturedHookLog) {
-    const [primitiveFrame, stack] = parseTrimmedStack(rootStack, hook);
+    const [primitiveFrame, stack] = parseTrimmedStack(rootStack, hook, parseHookStack);
     let displayName = hook.displayName;
     if (displayName === null && primitiveFrame !== null) {
-      displayName =
-        parseHookName(primitiveFrame.functionName) || parseHookName(hook.dispatcherHookName);
+      const primitiveName = parseHookName(primitiveFrame.functionName);
+      displayName = isInternalHookFrame(primitiveName)
+        ? null
+        : primitiveName || parseHookName(hook.dispatcherHookName);
     }
 
     if (stack !== null) {
@@ -628,6 +665,7 @@ const buildTree = (rootStack: StackFrame[], capturedHookLog: HookLogEntry[]): Ho
           name: parseHookName(stack[stackIndex - 1].functionName),
           value: undefined,
           subHooks: children,
+          debugInfo: null,
           hookSource: {
             lineNumber: stackFrame.lineNumber ?? null,
             columnNumber: stackFrame.columnNumber ?? null,
@@ -655,21 +693,52 @@ const buildTree = (rootStack: StackFrame[], capturedHookLog: HookLogEntry[]): Ho
       fileName: firstStackFrame?.fileName ?? null,
     };
 
-    levelChildren.push({ id, isStateEditable, name, value: hook.value, subHooks: [], hookSource });
+    levelChildren.push({
+      id,
+      isStateEditable,
+      name,
+      value: hook.value,
+      subHooks: [],
+      debugInfo: hook.debugInfo,
+      hookSource,
+    });
   }
 
   processDebugValues(rootChildren, null);
+  removeInternalHookFrames(rootChildren, null);
   return rootChildren;
 };
 
+const removeInternalHookFrames = (
+  hooksTree: HooksTree,
+  parentHooksNode: HooksNode | null,
+): void => {
+  for (let nodeIndex = 0; nodeIndex < hooksTree.length; nodeIndex++) {
+    const hooksNode = hooksTree[nodeIndex];
+    if (isInternalHookFrame(hooksNode.name)) {
+      if (parentHooksNode !== null && hooksNode.value !== undefined) {
+        if (parentHooksNode.value === undefined) parentHooksNode.value = hooksNode.value;
+        else if (Array.isArray(parentHooksNode.value)) {
+          parentHooksNode.value = [...parentHooksNode.value, hooksNode.value];
+        } else parentHooksNode.value = [parentHooksNode.value, hooksNode.value];
+      }
+      hooksTree.splice(nodeIndex, 1, ...hooksNode.subHooks);
+      nodeIndex--;
+    } else {
+      removeInternalHookFrames(hooksNode.subHooks, hooksNode);
+    }
+  }
+};
+
 const processDebugValues = (hooksTree: HooksTree, parentHooksNode: HooksNode | null): void => {
   const debugValueNodes: HooksNode[] = [];
   for (let nodeIndex = 0; nodeIndex < hooksTree.length; nodeIndex++) {
     const hooksNode = hooksTree[nodeIndex];
-    if (hooksNode.name === "DebugValue" && hooksNode.subHooks.length === 0) {
-      hooksTree.splice(nodeIndex, 1);
+    if (hooksNode.name === "DebugValue") {
+      hooksTree.splice(nodeIndex, 1, ...hooksNode.subHooks);
       nodeIndex--;
-      debugValueNodes.push(hooksNode);
+      // Internal frames surface as valueless DebugValue levels; only real labels bubble up.
+      if (hooksNode.value !== undefined) debugValueNodes.push(hooksNode);
     } else {
       processDebugValues(hooksNode.subHooks, hooksNode);
     }
@@ -723,8 +792,8 @@ const resolveDefaultProps = (
   baseProps: Record<string, unknown>,
 ): Record<string, unknown> => {
   if (
-    component &&
-    typeof component === "object" &&
+    component !== null &&
+    (typeof component === "object" || typeof component === "function") &&
     "defaultProps" in component &&
     typeof component.defaultProps === "object" &&
     component.defaultProps !== null
@@ -760,24 +829,29 @@ const restoreConsole = (originalMethods: Record<string, unknown>): void => {
   }
 };
 
-const performDispatcherInspection = (
+// The render call must happen in the same frame that captures the ancestor stack,
+// otherwise an extra frame lands in every hook's trimmed stack and becomes a bogus tree level.
+const performDispatcherInspection = <TArgs extends unknown[]>(
   dispatcherRef: RendererDispatcherRef,
-  renderFn: () => void,
+  renderFunction: (...args: TArgs) => unknown,
+  ...renderArgs: TArgs
 ): HooksTree => {
   const previousDispatcher = readDispatcher(dispatcherRef);
   writeDispatcher(dispatcherRef, dispatcherProxy);
+  isInspectingHooks = true;
 
   let capturedHookLog: HookLogEntry[] = [];
   let ancestorStackError: Error | undefined;
 
   try {
     ancestorStackError = new Error();
-    renderFn();
+    renderFunction(...renderArgs);
   } catch (renderError) {
     handleRenderFunctionError(renderError);
   } finally {
     capturedHookLog = hookLog;
     hookLog = [];
+    isInspectingHooks = false;
     writeDispatcher(dispatcherRef, previousDispatcher);
   }
 
@@ -785,8 +859,12 @@ const performDispatcherInspection = (
   return buildTree(rootStack, capturedHookLog);
 };
 
-const requireDispatcherRef = (): RendererDispatcherRef => {
-  const dispatcherRef = getRendererDispatcherRefs()[0];
+const requireDispatcherRef = (
+  fiber?: Fiber,
+  target: ReactDevToolsTarget = globalThis,
+): RendererDispatcherRef => {
+  const rendererDispatcherRef = fiber ? getRenderer(fiber, target)?.currentDispatcherRef : null;
+  const dispatcherRef = rendererDispatcherRef ?? getRendererDispatcherRefs(target)[0];
   if (!dispatcherRef) {
     throw new BippyHookInspectionError(
       "Bippy couldn’t find a React renderer. Load React and install Bippy’s hook.",
@@ -823,8 +901,75 @@ const resolveContextDependency = (fiber: Fiber): void => {
   }
 };
 
+const normalizeStandaloneHooks = (hooksTree: HooksTree): HooksTree => {
+  const normalizeNode = (hooksNode: HooksNode): HooksNode => {
+    const subHooks = hooksNode.subHooks.map(normalizeNode);
+    if (subHooks.length === 1) {
+      const childHook = subHooks[0];
+      if (hooksNode.name === "Context" && childHook.id === null) {
+        return { ...childHook, hookSource: hooksNode.hookSource };
+      }
+      if (hooksNode.name === "FormStatus" && childHook.name === "HostTransitionStatus") {
+        return { ...hooksNode, subHooks: [], value: childHook.value };
+      }
+      if (hooksNode.name === "Use") {
+        if (childHook.name === "Context") {
+          return { ...childHook, hookSource: hooksNode.hookSource };
+        }
+        if (childHook.name === "Promise" || childHook.name === "Unresolved") {
+          return {
+            ...hooksNode,
+            debugInfo: childHook.debugInfo,
+            subHooks: [],
+            value: childHook.value,
+          };
+        }
+      }
+      if (
+        hooksNode.id === null &&
+        hooksNode.value === undefined &&
+        (hooksNode.name === childHook.name || hooksNode.name === "<anonymous>")
+      ) {
+        return { ...childHook, hookSource: hooksNode.hookSource };
+      }
+    }
+    return { ...hooksNode, subHooks };
+  };
+
+  return hooksTree.map(normalizeNode);
+};
+
+export const inspectHooks = (
+  renderFunction: (props: Record<string, unknown>) => unknown,
+  props: Record<string, unknown>,
+  target: ReactDevToolsTarget = globalThis,
+): HooksTree => {
+  assertNotInspectingHooks();
+  const dispatcherRef = requireDispatcherRef(undefined, target);
+  getPrimitiveStackCache();
+  currentHook = null;
+  currentFiber = null;
+  currentContextDependency = null;
+  currentThenableState = null;
+  currentThenableIndex = 0;
+  const originalConsoleMethods = suppressConsole();
+  try {
+    return normalizeStandaloneHooks(
+      performDispatcherInspection(dispatcherRef, renderFunction, props),
+    );
+  } finally {
+    currentHook = null;
+    currentFiber = null;
+    currentContextDependency = null;
+    currentThenableState = null;
+    currentThenableIndex = 0;
+    restoreConsole(originalConsoleMethods);
+  }
+};
+
 export const getFiberHooks = (fiber: Fiber): HooksTree => {
-  const dispatcherRef = requireDispatcherRef();
+  assertNotInspectingHooks();
+  const dispatcherRef = requireDispatcherRef(fiber);
   const workTags = getReactWorkTagsForFiber(fiber);
 
   if (
@@ -839,6 +984,7 @@ export const getFiberHooks = (fiber: Fiber): HooksTree => {
 
   currentHook = fiber.memoizedState;
   currentFiber = fiber;
+  currentMemoCacheIndex = 0;
 
   const debugThenableState = fiber.dependencies?._debugThenableState;
   const usedThenables = Array.isArray(debugThenableState)
@@ -847,18 +993,16 @@ export const getFiberHooks = (fiber: Fiber): HooksTree => {
   currentThenableState = Array.isArray(usedThenables) ? usedThenables : null;
   currentThenableIndex = 0;
 
-  resolveContextDependency(fiber);
-
-  const type = fiber.type;
-  let props = fiber.memoizedProps;
-  if (type !== fiber.elementType) {
-    props = resolveDefaultProps(type, props);
-  }
-
   const originalConsoleMethods = suppressConsole();
   const contextMap = new Map<ReactContext<unknown>, unknown>();
 
   try {
+    resolveContextDependency(fiber);
+    const type = fiber.type;
+    const props =
+      type !== fiber.elementType
+        ? resolveDefaultProps(type, fiber.memoizedProps)
+        : fiber.memoizedProps;
     if (
       currentContextDependency !== null &&
       !Object.hasOwn(currentContextDependency, "memoizedValue")
@@ -870,9 +1014,15 @@ export const getFiberHooks = (fiber: Fiber): HooksTree => {
       if (!isForwardRefRenderType(type)) {
         throw new BippyHookInspectionError("ForwardRef fiber is missing its render function.");
       }
-      return performDispatcherInspection(dispatcherRef, () => {
-        type.render(props, fiber.ref);
-      });
+      const hooksTree = normalizeStandaloneHooks(
+        performDispatcherInspection(dispatcherRef, type.render, props, fiber.ref),
+      );
+      for (const hooksNode of hooksTree) {
+        if (hooksNode.hookSource?.functionName === "Object.render") {
+          hooksNode.hookSource.functionName = null;
+        }
+      }
+      return hooksTree;
     }
 
     if (typeof type !== "function") {
@@ -880,15 +1030,14 @@ export const getFiberHooks = (fiber: Fiber): HooksTree => {
         "Function component fiber is missing its component function.",
       );
     }
-    return performDispatcherInspection(dispatcherRef, () => {
-      type(props);
-    });
+    return normalizeStandaloneHooks(performDispatcherInspection(dispatcherRef, type, props));
   } finally {
     currentFiber = null;
     currentHook = null;
     currentContextDependency = null;
     currentThenableState = null;
     currentThenableIndex = 0;
+    currentMemoCacheIndex = 0;
     restoreContexts(contextMap);
     restoreConsole(originalConsoleMethods);
   }

package/src/source/owner-stack.ts

@@ -7,7 +7,6 @@ import type {
 } from "../react-internals/index.js";
 import {
   REACT_STACK_BOTTOM_FRAME_PATTERNS,
-  SERVER_FRAME_MARKER,
   SERVER_ENV_PATTERN,
   SERVER_COMPONENT_URL_PREFIXES,
 } from "./constants.js";
@@ -19,7 +18,11 @@ import {
   readDispatcher,
   writeDispatcher,
 } from "./renderer-dispatchers.js";
-import { symbolicateStack, type SourceFetch } from "./symbolication.js";
+import {
+  symbolicateStack,
+  type SourceFetch,
+  type SourceMapRequestOptions,
+} from "./symbolication.js";
 
 interface RendererDispatcherSnapshot {
   currentDispatcherRef: RendererDispatcherRef;
@@ -101,12 +104,18 @@ const describeBuiltInComponentFrame = (name: string): string => {
   return `\n    in ${name}`;
 };
 
-export const describeDebugInfoFrame = (name: string, env?: string): string => {
-  let frameDescription = describeBuiltInComponentFrame(name);
-  if (env) {
-    frameDescription += ` (at ${env})`;
+export const describeDebugInfoFrame = (
+  name: string,
+  env?: string,
+  location?: Error | null,
+): string => {
+  if (location) {
+    const childStack = formatOwnerStack(location.stack ?? "");
+    const lastNewlineIndex = childStack.lastIndexOf("\n");
+    const lastLine = lastNewlineIndex === -1 ? childStack : childStack.slice(lastNewlineIndex + 1);
+    if (lastLine.includes(name)) return `\n${lastLine}`;
   }
-  return frameDescription;
+  return describeBuiltInComponentFrame(`${name}${env ? ` [${env}]` : ""}`);
 };
 
 let reEntry = false;
@@ -115,7 +124,7 @@ let reEntry = false;
 // component type like React DevTools does.
 const componentFrameCache = new WeakMap<React.ComponentType<unknown>, string>();
 
-// https://github.com/facebook/react/blob/f739642745577a8e4dcb9753836ac3589b9c590a/packages/react-devtools-shared/src/backend/shared/DevToolsComponentStackFrame.js#L22
+// https://github.com/facebook/react/blob/eafeac0/packages/shared/ReactComponentStackFrame.js#L64
 const describeNativeComponentFrame = (
   component: React.ComponentType<unknown>,
   construct: boolean,
@@ -153,21 +162,12 @@ const describeNativeComponentFrame = (
                 throw Error();
               },
             });
-            if (typeof Reflect === "object" && Reflect.construct) {
-              try {
-                Reflect.construct(ThrowingConstructor, []);
-              } catch (caughtError) {
-                control = caughtError;
-              }
-              Reflect.construct(component, [], ThrowingConstructor);
-            } else {
-              try {
-                Function.prototype.apply.call(ThrowingConstructor, undefined, []);
-              } catch (caughtError) {
-                control = caughtError;
-              }
-              Function.prototype.apply.call(component, ThrowingConstructor.prototype, []);
+            try {
+              Reflect.construct(ThrowingConstructor, []);
+            } catch (caughtError) {
+              control = caughtError;
             }
+            Reflect.construct(component, [], ThrowingConstructor);
           } else {
             try {
               throw Error();
@@ -312,7 +312,7 @@ const describeNativeComponentFrame = (
   return syntheticFrame;
 };
 
-// https://github.com/facebook/react/blob/ac3e705a18696168acfcaed39dce0cfaa6be8836/packages/react-reconciler/src/ReactFiberComponentStack.js#L180
+// https://github.com/facebook/react/blob/eafeac0/packages/react-reconciler/src/ReactFiberComponentStack.js#L37
 export const describeFiber = (fiber: Fiber, childFiber: Fiber | null): string => {
   let stackFrame = "";
   const workTags = getReactWorkTagsForFiber(fiber);
@@ -384,7 +384,11 @@ export const getFallbackParentStack = (thisFiber: Fiber): string => {
         for (let debugInfoIndex = debugInfo.length - 1; debugInfoIndex >= 0; debugInfoIndex--) {
           const debugEntry = debugInfo[debugInfoIndex];
           if (typeof debugEntry.name === "string") {
-            componentStack += describeDebugInfoFrame(debugEntry.name, debugEntry.env);
+            componentStack += describeDebugInfoFrame(
+              debugEntry.name,
+              debugEntry.env,
+              debugEntry.debugLocation,
+            );
           }
         }
       }
@@ -511,7 +515,7 @@ const getEnrichedServerStackFrame = (
     lineNumber: resolvedRscFrame.lineNumber,
     columnNumber: resolvedRscFrame.columnNumber,
     source: serverFrame.source?.replace(
-      SERVER_FRAME_MARKER,
+      SERVER_ENV_PATTERN,
       `(${resolvedRscFrame.fileName}:${resolvedRscFrame.lineNumber}:${resolvedRscFrame.columnNumber})`,
     ),
   };
@@ -534,7 +538,7 @@ const markFlightServerFrame = (stackFrame: StackFrame): StackFrame =>
  * carries `.debugStack`). This is exact - no re-invoking components, no
  * name-matching heuristics - but requires React 19.
  */
-const getOwnerStackFromDebugStacks = (fiber: Fiber): StackFrame[] => {
+export const getRawOwnerStack = (fiber: Fiber): StackFrame[] => {
   const ownerStackFrames: StackFrame[] = [];
   let owner: Fiber | ServerComponentInfo | null | undefined = fiber;
   while (owner) {
@@ -625,9 +629,11 @@ export const getRawParentStack = (fiber: Fiber): StackFrame[] => {
  */
 export const getParentStack = async (
   fiber: Fiber,
-  shouldCache = true,
-  fetchFunction?: SourceFetch,
-): Promise<StackFrame[]> => symbolicateStack(getRawParentStack(fiber), shouldCache, fetchFunction);
+  shouldUseCache = true,
+  sourceFetch?: SourceFetch,
+  requestOptions: SourceMapRequestOptions = {},
+): Promise<StackFrame[]> =>
+  symbolicateStack(getRawParentStack(fiber), shouldUseCache, sourceFetch, requestOptions);
 
 // an owner frame is only actionable if it can point an editor somewhere:
 // it needs a file location and must not be ignore-listed bundler/framework code
@@ -646,10 +652,11 @@ const isLocatableFrame = (stackFrame: StackFrame): boolean =>
  */
 export const getOwnerStack = async (
   fiber: Fiber,
-  shouldCache = true,
-  fetchFunction?: SourceFetch,
+  shouldUseCache = true,
+  sourceFetch?: SourceFetch,
+  requestOptions: SourceMapRequestOptions = {},
 ): Promise<StackFrame[]> => {
-  const debugStackFrames = getOwnerStackFromDebugStacks(fiber);
+  const debugStackFrames = getRawOwnerStack(fiber);
   if (debugStackFrames.length > 0) {
     // the owner chain does not include the fiber itself, but bippy's stacks
     // always start with the fiber's own frame
@@ -657,8 +664,9 @@ export const getOwnerStack = async (
     selfFrame.functionName = getDisplayName(fiber.type) ?? selfFrame.functionName;
     const symbolicatedFrames = await symbolicateStack(
       [selfFrame, ...debugStackFrames],
-      shouldCache,
-      fetchFunction,
+      shouldUseCache,
+      sourceFetch,
+      requestOptions,
     );
     const hasLocatableOwnerFrame = symbolicatedFrames.some(
       (stackFrame, frameIndex) => frameIndex > 0 && isLocatableFrame(stackFrame),
@@ -668,5 +676,5 @@ export const getOwnerStack = async (
     }
   }
 
-  return getParentStack(fiber, shouldCache, fetchFunction);
+  return getParentStack(fiber, shouldUseCache, sourceFetch, requestOptions);
 };