diff --git a/packages/react-devtools-shared/src/__tests__/preprocessData-test.js b/packages/react-devtools-shared/src/__tests__/preprocessData-test.js index 6d60b7e63254d..2c20bbcd1c565 100644 --- a/packages/react-devtools-shared/src/__tests__/preprocessData-test.js +++ b/packages/react-devtools-shared/src/__tests__/preprocessData-test.js @@ -24,21 +24,8 @@ let utils; let assertLog; let waitFor; -// This flag is on experimental which disables timeline profiler. -const enableComponentPerformanceTrack = - React.version.startsWith('19') && React.version.includes('experimental'); - describe('Timeline profiler', () => { - if (enableComponentPerformanceTrack) { - test('no tests', () => {}); - // Ignore all tests. - return; - } - describe('User Timing API', () => { - if (enableComponentPerformanceTrack) { - return; - } let currentlyNotClearedMarks; let registeredMarks; let featureDetectionMarkName = null; @@ -168,6 +155,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should return array of lane numbers from bitmask string', () => { expect(getLanesFromTransportDecimalBitmask('1')).toEqual([0]); expect(getLanesFromTransportDecimalBitmask('512')).toEqual([9]); @@ -184,6 +172,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should return empty array if laneBitmaskString is not a bitmask', () => { expect(getLanesFromTransportDecimalBitmask('')).toEqual([]); expect(getLanesFromTransportDecimalBitmask('hello')).toEqual([]); @@ -192,6 +181,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should ignore lanes outside REACT_TOTAL_NUM_LANES', () => { const REACT_TOTAL_NUM_LANES = require('react-devtools-timeline/src/constants').REACT_TOTAL_NUM_LANES; @@ -317,11 +307,13 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should throw given an empty timeline', async () => { await expect(async () => preprocessData([])).rejects.toThrow(); }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should throw given a timeline with no Profile event', async () => { const randomSample = createUserTimingEntry({ dur: 100, @@ -338,6 +330,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should throw given a timeline without an explicit profiler version mark nor any other React marks', async () => { const cpuProfilerSample = creactCpuProfilerSample(); @@ -349,6 +342,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should throw given a timeline with React scheduling marks, but without an explicit profiler version mark', async () => { const cpuProfilerSample = creactCpuProfilerSample(); const scheduleRenderSample = createUserTimingEntry({ @@ -363,6 +357,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should return empty data given a timeline with no React scheduling profiling marks', async () => { const cpuProfilerSample = creactCpuProfilerSample(); const randomSample = createUserTimingEntry({ @@ -467,6 +462,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should process legacy data format (before lane labels were added)', async () => { const cpuProfilerSample = creactCpuProfilerSample(); @@ -854,6 +850,7 @@ describe('Timeline profiler', () => { `); }); + // @reactVersion < 19.2 it('should process a sample createRoot render sequence', async () => { function App() { const [didMount, setDidMount] = React.useState(false); @@ -1190,6 +1187,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should populate other user timing marks', async () => { const userTimingData = createUserTimingData([]); userTimingData.push( @@ -1240,6 +1238,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('should include a suspended resource "displayName" if one is set', async () => { let promise = null; let resolvedValue = null; @@ -1381,6 +1380,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should not warn when React finishes a previously long (async) update with a short (sync) update inside of an event', async () => { function Yield({id, value}) { Scheduler.log(`${id}:${value}`); @@ -1443,6 +1443,7 @@ describe('Timeline profiler', () => { describe('nested updates', () => { // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should not warn about short nested (state) updates during layout effects', async () => { function Component() { const [didMount, setDidMount] = React.useState(false); @@ -1474,6 +1475,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should not warn about short (forced) updates during layout effects', async () => { class Component extends React.Component { _didMount: boolean = false; @@ -1629,6 +1631,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should not warn about transition updates scheduled during commit phase', async () => { function Component() { const [value, setValue] = React.useState(0); @@ -1770,6 +1773,7 @@ describe('Timeline profiler', () => { describe('errors thrown while rendering', () => { // @reactVersion >= 18.0 + // @reactVersion < 19.2 it('shoult parse Errors thrown during render', async () => { jest.spyOn(console, 'error'); @@ -1818,6 +1822,7 @@ describe('Timeline profiler', () => { // This also tests an edge case where a component suspends while profiling // before the first commit is logged (so the lane-to-labels map will not yet exist). // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should warn about suspending during an update', async () => { let promise = null; let resolvedValue = null; @@ -1884,6 +1889,7 @@ describe('Timeline profiler', () => { }); // @reactVersion >= 18.2 + // @reactVersion < 19.2 it('should not warn about suspending during an transition', async () => { let promise = null; let resolvedValue = null; @@ -2152,6 +2158,7 @@ describe('Timeline profiler', () => { `); }); + // @reactVersion < 19.2 it('should process a sample createRoot render sequence', async () => { function App() { const [didMount, setDidMount] = React.useState(false); diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index a352ca8dee05b..f52455c784254 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -229,7 +229,7 @@ export const enableProfilerTimer = __PROFILE__; // Component rendering tracks to show up in the Performance tab. // This flag will be used for both Server Component and Client Component tracks. // All calls should also be gated on enableProfilerTimer. -export const enableComponentPerformanceTrack = __EXPERIMENTAL__; +export const enableComponentPerformanceTrack: boolean = true; // Adds user timing marks for e.g. state updates, suspense, and work loop stuff, // for an experimental timeline tool. diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index 7d8456cffb61f..8b39d0cbca781 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -41,8 +41,9 @@ export const enableObjectFiber: boolean = false; export const enablePostpone: boolean = false; export const enableReactTestRendererWarning: boolean = false; export const enableRetryLaneExpiration: boolean = false; -export const enableSchedulingProfiler: boolean = __PROFILE__; -export const enableComponentPerformanceTrack: boolean = false; +export const enableComponentPerformanceTrack: boolean = true; +export const enableSchedulingProfiler: boolean = + !enableComponentPerformanceTrack && __PROFILE__; export const enableScopeAPI: boolean = false; export const enableEagerAlternateStateNodeCleanup: boolean = true; export const enableSuspenseAvoidThisFallback: boolean = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 260cde9361a91..c9c1f7fe3b443 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -15,7 +15,7 @@ export const enableSchedulingProfiler: boolean = false; export const enableProfilerTimer: boolean = __PROFILE__; export const enableProfilerCommitHooks: boolean = __PROFILE__; export const enableProfilerNestedUpdatePhase: boolean = __PROFILE__; -export const enableComponentPerformanceTrack: boolean = false; +export const enableComponentPerformanceTrack: boolean = true; export const enableUpdaterTracking: boolean = false; export const enableLegacyCache: boolean = __EXPERIMENTAL__; export const enableAsyncIterableChildren: boolean = false;