describeAncestors() — react Function Reference

Source Code

packages/react-dom-bindings/src/client/validateDOMNesting.js lines 26–55

function describeAncestors(
  ancestor: Fiber,
  child: Fiber,
  props: null | {children: null},
): string {
  let fiber: null | Fiber = child;
  let node: null | HydrationDiffNode = null;
  let distanceFromLeaf = 0;
  while (fiber) {
    if (fiber === ancestor) {
      distanceFromLeaf = 0;
    }
    node = {
      fiber: fiber,
      children: node !== null ? [node] : [],
      serverProps:
        fiber === child ? props : fiber === ancestor ? null : undefined,
      serverTail: [],
      distanceFromLeaf: distanceFromLeaf,
    };
    distanceFromLeaf++;
    fiber = fiber.return;
  }
  if (node !== null) {
    // Describe the node using the hydration diff logic.
    // Replace + with - to mark ancestor and child. It's kind of arbitrary.
    return describeDiff(node).replaceAll(/^[+-]/gm, '>');
  }
  return '';
}