Home / File/ ReactFiberDevToolsHook.js — react Source File

ReactFiberDevToolsHook.js — react Source File

Architecture documentation for ReactFiberDevToolsHook.js, a javascript file in the react codebase. 7 imports, 11 dependents.

File javascript BabelCompiler Validation 7 imports 11 dependents 31 functions

Entity Profile

Dependency Diagram

graph LR
  1f955e30_ff03_d9f9_d498_58b7dc7858dc["ReactFiberDevToolsHook.js"]
  768f6d67_77c1_be19_5596_a943eab59e05["ReactFiberLane.js"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> 768f6d67_77c1_be19_5596_a943eab59e05
  6b9f5caa_fb13_3d3c_2f60_ad3c4f58371f["ReactInternalTypes.js"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> 6b9f5caa_fb13_3d3c_2f60_ad3c4f58371f
  e317bb22_8bd8_c9e1_6256_a7d1cb4eaee3["ReactEventPriorities.js"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> e317bb22_8bd8_c9e1_6256_a7d1cb4eaee3
  6773f9a2_fdb7_4938_741f_4887273ad469["ReactFiberFlags.js"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> 6773f9a2_fdb7_4938_741f_4887273ad469
  cdb34c69_08af_f2ef_1fdd_d05bff2eea56["Scheduler.js"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> cdb34c69_08af_f2ef_1fdd_d05bff2eea56
  d8f20c67_f5fa_0f0a_c967_c41fd9ffce07["ReactTypes"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> d8f20c67_f5fa_0f0a_c967_c41fd9ffce07
  8344de1b_978c_be0f_eebd_38ccc4962a93["ReactFeatureFlags"]
  1f955e30_ff03_d9f9_d498_58b7dc7858dc --> 8344de1b_978c_be0f_eebd_38ccc4962a93
  8a03468f_f6e2_d5a3_fdef_e77ebca449c2["ReactFiber.js"]
  8a03468f_f6e2_d5a3_fdef_e77ebca449c2 --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  0be70812_cc0c_b210_f84f_8e61dd5f831c["ReactFiberBeginWork.js"]
  0be70812_cc0c_b210_f84f_8e61dd5f831c --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  3805476a_1924_0e35_fff7_6afad197a523["ReactFiberClassComponent.js"]
  3805476a_1924_0e35_fff7_6afad197a523 --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  39c2d339_1422_a702_78f7_1997d8d72c29["ReactFiberClassUpdateQueue.js"]
  39c2d339_1422_a702_78f7_1997d8d72c29 --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  8f5342bb_933e_6410_b584_cc120047394a["ReactFiberCommitEffects.js"]
  8f5342bb_933e_6410_b584_cc120047394a --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  e0fbfbd5_47b0_a489_0b36_bbfad9245544["ReactFiberCommitWork.js"]
  e0fbfbd5_47b0_a489_0b36_bbfad9245544 --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  85d2c68c_7609_2c66_22fb_5f02e8a2e8fe["ReactFiberHooks.js"]
  85d2c68c_7609_2c66_22fb_5f02e8a2e8fe --> 1f955e30_ff03_d9f9_d498_58b7dc7858dc
  style 1f955e30_ff03_d9f9_d498_58b7dc7858dc fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

import type {Lane, Lanes} from './ReactFiberLane';
import type {Fiber, FiberRoot} from './ReactInternalTypes';
import type {ReactNodeList, Wakeable} from 'shared/ReactTypes';
import type {EventPriority} from './ReactEventPriorities';
// import type {DevToolsProfilingHooks} from 'react-devtools-shared/src/backend/types';
// TODO: This import doesn't work because the DevTools depend on the DOM version of React
// and to properly type check against DOM React we can't also type check again non-DOM
// React which this hook might be in.
type DevToolsProfilingHooks = any;

import {DidCapture} from './ReactFiberFlags';
import {
  enableProfilerTimer,
  enableSchedulingProfiler,
} from 'shared/ReactFeatureFlags';
import {
  DiscreteEventPriority,
  ContinuousEventPriority,
  DefaultEventPriority,
  IdleEventPriority,
} from './ReactEventPriorities';
import {
  ImmediatePriority as ImmediateSchedulerPriority,
  UserBlockingPriority as UserBlockingSchedulerPriority,
  NormalPriority as NormalSchedulerPriority,
  IdlePriority as IdleSchedulerPriority,
  log,
  unstable_setDisableYieldValue,
} from './Scheduler';

declare const __REACT_DEVTOOLS_GLOBAL_HOOK__: Object | void;

let rendererID = null;
let injectedHook = null;
let injectedProfilingHooks: DevToolsProfilingHooks | null = null;
let hasLoggedError = false;

export const isDevToolsPresent =
  typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined';

export function injectInternals(internals: Object): boolean {
  if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') {
    // No DevTools
    return false;
  }
  const hook = __REACT_DEVTOOLS_GLOBAL_HOOK__;
  if (hook.isDisabled) {
    // This isn't a real property on the hook, but it can be set to opt out
    // of DevTools integration and associated warnings and logs.
    // https://github.com/facebook/react/issues/3877
    return true;
// ... (436 more lines)

Domain

Subdomains

Frequently Asked Questions

What does ReactFiberDevToolsHook.js do?
ReactFiberDevToolsHook.js is a source file in the react codebase, written in javascript. It belongs to the BabelCompiler domain, Validation subdomain.
What functions are defined in ReactFiberDevToolsHook.js?
ReactFiberDevToolsHook.js defines 31 function(s): injectInternals, injectProfilingHooks, markCommitStarted, markCommitStopped, markComponentErrored, markComponentLayoutEffectMountStarted, markComponentLayoutEffectMountStopped, markComponentLayoutEffectUnmountStarted, markComponentLayoutEffectUnmountStopped, markComponentPassiveEffectMountStarted, and 21 more.
What does ReactFiberDevToolsHook.js depend on?
ReactFiberDevToolsHook.js imports 7 module(s): ReactEventPriorities.js, ReactFeatureFlags, ReactFiberFlags.js, ReactFiberLane.js, ReactInternalTypes.js, ReactTypes, Scheduler.js.
What files import ReactFiberDevToolsHook.js?
ReactFiberDevToolsHook.js is imported by 11 file(s): ReactFiber.js, ReactFiberBeginWork.js, ReactFiberClassComponent.js, ReactFiberClassUpdateQueue.js, ReactFiberCommitEffects.js, ReactFiberCommitWork.js, ReactFiberHooks.js, ReactFiberLane.js, and 3 more.
Where is ReactFiberDevToolsHook.js in the architecture?
ReactFiberDevToolsHook.js is located at packages/react-reconciler/src/ReactFiberDevToolsHook.js (domain: BabelCompiler, subdomain: Validation, directory: packages/react-reconciler/src).

Analyze Your Own Codebase

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

Try Supermodel Free