Home / Function/ trackNamedViewTransition() — react Function Reference

trackNamedViewTransition() — react Function Reference

Architecture documentation for the trackNamedViewTransition() function in ReactFiberDuplicateViewTransitions.js from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  f5e9b57a_352d_e8a8_306f_de8b1f7fa76f["trackNamedViewTransition()"]
  5239264d_5f7a_afd8_70d1_f52aaabff11f["ReactFiberDuplicateViewTransitions.js"]
  f5e9b57a_352d_e8a8_306f_de8b1f7fa76f -->|defined in| 5239264d_5f7a_afd8_70d1_f52aaabff11f
  ce61aa22_42d2_811a_b317_96c8d0cb0321["commitLayoutEffectOnFiber()"]
  ce61aa22_42d2_811a_b317_96c8d0cb0321 -->|calls| f5e9b57a_352d_e8a8_306f_de8b1f7fa76f
  1846396a_6bcb_7ad4_8180_1d20ef2960a4["reappearLayoutEffects()"]
  1846396a_6bcb_7ad4_8180_1d20ef2960a4 -->|calls| f5e9b57a_352d_e8a8_306f_de8b1f7fa76f
  style f5e9b57a_352d_e8a8_306f_de8b1f7fa76f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-reconciler/src/ReactFiberDuplicateViewTransitions.js lines 24–56

export function trackNamedViewTransition(fiber: Fiber): void {
  if (__DEV__) {
    const name = (fiber.memoizedProps: ViewTransitionProps).name;
    if (name != null && name !== 'auto') {
      const existing = mountedNamedViewTransitions.get(name);
      if (existing !== undefined) {
        if (existing !== fiber && existing !== fiber.alternate) {
          if (!didWarnAboutName[name]) {
            didWarnAboutName[name] = true;
            const stringifiedName = JSON.stringify(name);
            runWithFiberInDEV(fiber, () => {
              console.error(
                'There are two <ViewTransition name=%s> components with the same name mounted ' +
                  'at the same time. This is not supported and will cause View Transitions ' +
                  'to error. Try to use a more unique name e.g. by using a namespace prefix ' +
                  'and adding the id of an item to the name.',
                stringifiedName,
              );
            });
            runWithFiberInDEV(existing, () => {
              console.error(
                'The existing <ViewTransition name=%s> duplicate has this stack trace.',
                stringifiedName,
              );
            });
          }
        }
      } else {
        mountedNamedViewTransitions.set(name, fiber);
      }
    }
  }
}

Domain

Subdomains

Frequently Asked Questions

What does trackNamedViewTransition() do?
trackNamedViewTransition() is a function in the react codebase, defined in packages/react-reconciler/src/ReactFiberDuplicateViewTransitions.js.
Where is trackNamedViewTransition() defined?
trackNamedViewTransition() is defined in packages/react-reconciler/src/ReactFiberDuplicateViewTransitions.js at line 24.
What calls trackNamedViewTransition()?
trackNamedViewTransition() is called by 2 function(s): commitLayoutEffectOnFiber, reappearLayoutEffects.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free