mirror of
https://github.com/zebrajr/react.git
synced 2026-01-15 12:15:22 +00:00
491a4eacce
Before: <img width="844" alt="Screenshot 2024-07-04 at 3 20 34 PM" src="https://github.com/facebook/react/assets/63648/0fd8a53f-538a-4429-a4cf-c22f85a09aa8"> After: <img width="845" alt="Screenshot 2024-07-05 at 6 08 28 PM" src="https://github.com/facebook/react/assets/63648/7b9da13a-fa97-4581-9899-06de6fface65"> Firefox: <img width="1338" alt="Screenshot 2024-07-05 at 6 09 50 PM" src="https://github.com/facebook/react/assets/63648/f2eb9f2a-2251-408f-86d0-b081279ba378"> The first log doesn't get a stack because it's logged before DevTools boots up and connects which is unfortunate. The second log already has a stack printed by React (this is on stable) it gets replaced by our object now. The third and following logs don't have a stack and get one appended. I only turn the stack into an error object if it matches what we would emit from DevTools anyway. Otherwise we assume it's not React. Since I had to change the format slightly to make this work, I first normalize the stack slightly before doing a comparison since it won't be 1:1.
66 lines
2.8 KiB
JavaScript
66 lines
2.8 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 PROFILING_FLAG_BASIC_SUPPORT = 0b01;
|
|
export const PROFILING_FLAG_TIMELINE_SUPPORT = 0b10;
|
|
|
|
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_PARSE_HOOK_NAMES_KEY =
|
|
'React::DevTools::parseHookNames';
|
|
export const SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY =
|
|
'React::DevTools::recordChangeDescriptions';
|
|
export const SESSION_STORAGE_RELOAD_AND_PROFILE_KEY =
|
|
'React::DevTools::reloadAndProfile';
|
|
export const LOCAL_STORAGE_SHOULD_BREAK_ON_CONSOLE_ERRORS =
|
|
'React::DevTools::breakOnConsoleErrors';
|
|
export const LOCAL_STORAGE_BROWSER_THEME = 'React::DevTools::theme';
|
|
export const LOCAL_STORAGE_SHOULD_APPEND_COMPONENT_STACK_KEY =
|
|
'React::DevTools::appendComponentStack';
|
|
export const LOCAL_STORAGE_SHOW_INLINE_WARNINGS_AND_ERRORS_KEY =
|
|
'React::DevTools::showInlineWarningsAndErrors';
|
|
export const LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY =
|
|
'React::DevTools::traceUpdatesEnabled';
|
|
export const LOCAL_STORAGE_HIDE_CONSOLE_LOGS_IN_STRICT_MODE =
|
|
'React::DevTools::hideConsoleLogsInStrictMode';
|
|
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';
|