popHydrationStateOnInterruptedWork() — react Function Reference

Architecture documentation for the popHydrationStateOnInterruptedWork() function in ReactFiberHydrationContext.js from the react codebase.

Function javascript BabelCompiler Validation calls 1

Entity Profile

BabelCompiler→ Validation→ popHydrationStateOnInterruptedWork() — react Function Reference

Dependency Diagram

graph TD
  7e6a617a_3b89_4b2c_0370_fe60e21640bb["popHydrationStateOnInterruptedWork()"]
  4bc7109f_638d_d9f7_bf47_6ec55b2fa128["ReactFiberHydrationContext.js"]
  7e6a617a_3b89_4b2c_0370_fe60e21640bb -->|defined in| 4bc7109f_638d_d9f7_bf47_6ec55b2fa128
  6b27a70e_e4c9_73ee_c331_a59342af28a3["popToNextHostParent()"]
  7e6a617a_3b89_4b2c_0370_fe60e21640bb -->|calls| 6b27a70e_e4c9_73ee_c331_a59342af28a3
  style 7e6a617a_3b89_4b2c_0370_fe60e21640bb fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-reconciler/src/ReactFiberHydrationContext.js lines 847–873

function popHydrationStateOnInterruptedWork(fiber: Fiber): void {
  if (!supportsHydration) {
    return;
  }
  if (fiber !== hydrationParentFiber) {
    // We're deeper than the current hydration context, inside an inserted
    // tree. Don't touch the cursor.
    return;
  }
  if (!isHydrating) {
    // If we're not currently hydrating but we're in a hydration context, then
    // we were an insertion and now need to pop up to reenter hydration of our
    // siblings. Same as popHydrationState.
    popToNextHostParent(fiber);
    isHydrating = true;
    return;
  }

  // We're in a valid hydration context. Restore the cursor to this fiber's
  // DOM node so that when beginWork re-runs, it can claim the same node.
  // Unlike popHydrationState, we do NOT check for unhydrated tail nodes
  // or advance the cursor - we're restoring, not completing.
  popToNextHostParent(fiber);
  if (fiber.tag === HostComponent && fiber.stateNode != null) {
    nextHydratableInstance = fiber.stateNode;
  }
}