mirror of
https://github.com/facebook/react.git
synced 2026-02-25 05:03:03 +00:00
We currently only track the reason something might suspend in development mode through debug info but this excludes some cases. As a result we can end up with boundary that suspends but has no cause. This tries to detect that and show a notice for why that might be. I'm also trying to make it work with old React versions to cover everything. In production we don't track any of this meta data like `_debugInfo`, `_debugThenable` etc. so after resolution there's no information to take from. Except suspensey images / css which we can track in prod too. We could track lazy component types already. We'd have to add something that tracks after the fact if something used a lazy child, child as a promise, hooks, etc. which doesn't exist today. So that's not backwards compatible and might add some perf/memory cost. However, another strategy is also to try to replay the components after the fact which could be backwards compatible. That's tricky for child position since there's so many rules for how to do that which would have to be replicated. If you're in development you get a different error. Given that we've added instrumentation very recently. If you're on an older development version of React, then you get a different error. Unfortunately I think my feature test is not quite perfect because it's tricky to test for the instrumentation I just added. https://github.com/facebook/react/pull/34146 So I think for some prereleases that has `_debugOwner` but doesn't have that you'll get a misleading error. Finally, if you're in a modern development environment, the only reason we should have any gaps is because of throw-a-Promise. This will highlight it as missing. We can detect that something threw if a Suspense boundary commits with a RetryCache but since it's a WeakSet we can't look into it to see anything about what it might have been. I don't plan on doing anything to improve this since it would only apply to new versions of React anyway and it's just inherently flawed. So just deprecate it #34032. Note that nothing in here can detect that we suspended Transition. So throwing at the root or in an update won't show that anywhere.
73 lines
3.5 KiB
JavaScript
73 lines
3.5 KiB
JavaScript
/**
|
|
* 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
|
|
*/
|
|
|
|
export const CHROME_WEBSTORE_EXTENSION_ID = 'fmkadmapgofadopljbjfkapdkoienihi';
|
|
export const INTERNAL_EXTENSION_ID = 'dnjnjgbfilfphmojnmhliehogmojhclc';
|
|
export const LOCAL_EXTENSION_ID = 'ikiahnapldjmdmpkmfhjdjilojjhgcbf';
|
|
|
|
// Flip this flag to true to enable verbose console debug logging.
|
|
export const __DEBUG__ = false;
|
|
|
|
// Flip this flag to true to enable performance.mark() and performance.measure() timings.
|
|
export const __PERFORMANCE_PROFILE__ = false;
|
|
|
|
export const TREE_OPERATION_ADD = 1;
|
|
export const TREE_OPERATION_REMOVE = 2;
|
|
export const TREE_OPERATION_REORDER_CHILDREN = 3;
|
|
export const TREE_OPERATION_UPDATE_TREE_BASE_DURATION = 4;
|
|
export const TREE_OPERATION_UPDATE_ERRORS_OR_WARNINGS = 5;
|
|
export const TREE_OPERATION_REMOVE_ROOT = 6;
|
|
export const TREE_OPERATION_SET_SUBTREE_MODE = 7;
|
|
export const SUSPENSE_TREE_OPERATION_ADD = 8;
|
|
export const SUSPENSE_TREE_OPERATION_REMOVE = 9;
|
|
export const SUSPENSE_TREE_OPERATION_REORDER_CHILDREN = 10;
|
|
export const SUSPENSE_TREE_OPERATION_RESIZE = 11;
|
|
|
|
export const PROFILING_FLAG_BASIC_SUPPORT = 0b01;
|
|
export const PROFILING_FLAG_TIMELINE_SUPPORT = 0b10;
|
|
|
|
export const UNKNOWN_SUSPENDERS_NONE: UnknownSuspendersReason = 0; // If we had at least one debugInfo, then that might have been the reason.
|
|
export const UNKNOWN_SUSPENDERS_REASON_PRODUCTION: UnknownSuspendersReason = 1; // We're running in prod. That might be why we had unknown suspenders.
|
|
export const UNKNOWN_SUSPENDERS_REASON_OLD_VERSION: UnknownSuspendersReason = 2; // We're running an old version of React that doesn't have full coverage. That might be the reason.
|
|
export const UNKNOWN_SUSPENDERS_REASON_THROWN_PROMISE: UnknownSuspendersReason = 3; // If we're in dev, didn't detect and debug info and still suspended (other than CSS/image) the only reason is thrown promise.
|
|
|
|
export opaque type UnknownSuspendersReason = 0 | 1 | 2 | 3;
|
|
|
|
export const LOCAL_STORAGE_DEFAULT_TAB_KEY = 'React::DevTools::defaultTab';
|
|
export const LOCAL_STORAGE_COMPONENT_FILTER_PREFERENCES_KEY =
|
|
'React::DevTools::componentFilters';
|
|
export const SESSION_STORAGE_LAST_SELECTION_KEY =
|
|
'React::DevTools::lastSelection';
|
|
export const LOCAL_STORAGE_OPEN_IN_EDITOR_URL =
|
|
'React::DevTools::openInEditorUrl';
|
|
export const LOCAL_STORAGE_OPEN_IN_EDITOR_URL_PRESET =
|
|
'React::DevTools::openInEditorUrlPreset';
|
|
export const LOCAL_STORAGE_ALWAYS_OPEN_IN_EDITOR =
|
|
'React::DevTools::alwaysOpenInEditor';
|
|
export const LOCAL_STORAGE_PARSE_HOOK_NAMES_KEY =
|
|
'React::DevTools::parseHookNames';
|
|
export const SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY =
|
|
'React::DevTools::recordChangeDescriptions';
|
|
export const SESSION_STORAGE_RECORD_TIMELINE_KEY =
|
|
'React::DevTools::recordTimeline';
|
|
export const SESSION_STORAGE_RELOAD_AND_PROFILE_KEY =
|
|
'React::DevTools::reloadAndProfile';
|
|
export const LOCAL_STORAGE_BROWSER_THEME = 'React::DevTools::theme';
|
|
export const LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY =
|
|
'React::DevTools::traceUpdatesEnabled';
|
|
export const LOCAL_STORAGE_SUPPORTS_PROFILING_KEY =
|
|
'React::DevTools::supportsProfiling';
|
|
|
|
export const PROFILER_EXPORT_VERSION = 5;
|
|
|
|
export const FIREFOX_CONSOLE_DIMMING_COLOR = 'color: rgba(124, 124, 124, 0.75)';
|
|
export const ANSI_STYLE_DIMMING_TEMPLATE = '\x1b[2;38;2;124;124;124m%s\x1b[0m';
|
|
export const ANSI_STYLE_DIMMING_TEMPLATE_WITH_COMPONENT_STACK =
|
|
'\x1b[2;38;2;124;124;124m%s %o\x1b[0m';
|