Update react and react-dom to latest experimental release

[bvaughn]

This should allow us to remove the react-prod-sourcemaps Webpack plug-in, which is a step toward unblocking a potential Webpack to Turbo migration.

I think the biggest change on the React side was renaming unstable_Offscreen to unstable_Acitivy -> facebook/react#27640

• Update react and react-dom packages
  • Replace all unstable_Offscreen references with unstable_Activity
• Update next.config to include react and react-dom source-maps in bundle
  • Remove @acemarke/react-prod-sourcemaps Webpack plug-in
  • Verify production deploy (still) has source-maps for react and react-dom
• Update breakpoints-01 golden recording to one created from this PR
  • Update logpoints-10 and logpoints-11 tests as needed to account for line number changes

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
devtools	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 13, 2024 7:42pm

[replay-io]

E2E Tests

Status	Complete ↗︎
Commit	ebc4e9c
Results	⚠️ 3 Flaky fe-1875 :: verify that steps go to the right point in time (Replay 1, Replay 2) playwright-04: Test Step buttons and menu item (Replay 1, Replay 2) stepping-05_chromium: Test stepping in pretty-printed code (Replay 1, Replay 2) ✅ 101 Passed authenticated/comments-01: Test add, edit, and delete comment functionality authenticated/comments-02: Test shared comments and replies (Replay 1, Replay 2) authenticated/comments-03: Comment previews authenticated/logpoints-01: Shared logpoints functionality (Replay 1, Replay 2) authenticated/new-test-suites/tests-01: basic tests authenticated/new-test-suites/tests-02: test with no recording authenticated/new-test-suites/tests-03: test ID in the URL authenticated/passport-01: Time travel authenticated/passport-02: Infrared inspection authenticated/passport-03: Swiss army knife authenticated/passport-04: Multiplayer breakpoints-01: Test basic breakpoint functionality breakpoints-02: Test unhandled divergence while evaluating at a breakpoint breakpoints-03: Test stepping forward through breakpoints when rewound before the first one breakpoints-04: catch, finally, generators, and async/await breakpoints-05: Test interaction of breakpoints with debugger statements breakpoints-06: Test log point in a sourcemapped file breakpoints-07: rewind and seek using command bar and console messages breakpoints-08: should be temporarily disabled console_async: support console evaluations in async frames console_dock: Should show the correct docking behavior for recordings with video console_eval: support console evaluations console_warp-01: should support warping to console messages console_warp-02: support pausing, warping, stepping and evaluating console messages console-expressions-01: should cache input eager eval and terminal expressions per instance cypress-01: Basic Test Suites panel functionality cypress-02: Test Step timeline behavior cypress-03: Test Step interactions cypress-04: Test Step buttons and menu item cypress-05: Test DOM node preview on user action step hover deleted-recording: Show error message for deleted recording elements-search: Element panel should support basic and advanced search modes file-search-01: should search files focus_mode-01: should filter messages as regions based on the active focus mode highlighter: element highlighter works everywhere inspector-computed-01: Basic computed styles can be viewed inspector-elements-01: Basic DOM tree node display inspector-elements-02_node-picker: element picker and iframe behavior inspector-elements-03: Nested node picker and selection behavior inspector-elements-04: Keyboard shortcuts should select the right DOM nodes inspector-elements-05_search: element picker and iframe behavior inspector-rules-01: Basic CSS rules should be viewed inspector-rules-02: Sourcemapped rules should be viewed inspector-rules-03: Shorthand CSS rules should be viewed jump-to-code-01: Test basic jumping functionality logpoints-01: log-points appear in the correct order and allow time warping logpoints-02: conditional log-points logpoints-03: should display event properties in the console logpoints-05: should auto-complete based on log point location logpoints-06: should be temporarily disabled logpoints-07: should use the correct scope in auto-complete logpoints-08: should support jumping directly to a hit point via the capsule input logpoints-09: should support pending edits logpoints-10: too-many-points-to-find UX logpoints-11: too-many-points-to-run-analysis UX network-01: should filter requests by type and text network-02: should show details for the selected request network-03: should sync and display the current time in relation to the network requests node_console_dock: Should show the correct docking behavior for recordings without video node_console-01: Basic node console behavior node_console-02: uncaught exceptions should show up node_control_flow: catch, finally, generators, and async/await node_logpoint-01: Basic node logpoints node_object_preview: Showing console objects in node node_quick_open_modal-01: Test basic searching functionality node_spawn: Basic subprocess spawning node_stepping-01: Test stepping in async frames and async call stacks node_worker-01: make sure node workers don't cause crashes object_preview-01: expressions in the console after time warping object_preview-02: should allow objects in scope to be inspected object_preview-03: Test previews when switching between frames and stepping object_preview-04: Test scope mapping and switching between generated/original sources object_preview-05: Should support logging objects as values object_preview-06: HTML elements playwright-01: Basic Test Suites panel functionality playwright-02: Test Step timeline behavior playwright-03: Test Step interactions playwright-05: Test DOM node previews on user action step hover react_devtools-01: Basic RDT behavior react_devtools-02: RDT integrations (Chromium) react_devtools-03: process and display multiple React versions in page react_devtools-04: Component selection is maintained when seeking to a new point redux_devtools: Test Redux DevTools. repaint: repaints the screen screen when stepping over code that modifies the DOM resizable-panels-01: Left side Toolbar and Video should be collapsible restart debugging session scopes_rerender: Test that scopes are rerendered source-line-highlights: Test source line highlighting sourcemap_stacktrace: Test that stacktraces are sourcemapped stacking: Element highlighter selects the correct element when they overlap stepping-01: Test basic step-over/back functionality stepping-02: Test fixes for some simple stepping bugs stepping-03: Stepping past the beginning or end of a frame should act like a step-out stepping-04: Test stepping in a frame other than the top frame stepping-05: Test stepping in pretty-printed code stepping-06: Test stepping in async frames and async call stacks stepping-07: Test quick stepping using the keyboard test-suite-dashboard/test-runs-01: passed run in main branch with source test-suite-dashboard/test-runs-02: failed run in temp branch without source test-suite-dashboard/test-runs-03: flaky run in main branch with source test-suite-dashboard/test-runs-04: test ID in the URL

[socket-security]

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/react-dom@0.0.0-experimental-03d6f7cf0-20240209	environment	+2	18.2 MB	react-bot
npm/react@0.0.0-experimental-03d6f7cf0-20240209	environment	0	648 kB	react-bot

🚮 Removed packages: npm/@acemarke/react-prod-sourcemaps@0.2.1, npm/magic-string@0.30.7, npm/react-dom@0.0.0-experimental-953cb02f6-20230907, npm/react@0.0.0-experimental-953cb02f6-20230907, npm/unplugin@1.7.1, npm/webpack-virtual-modules@0.6.1

View full report↗︎

[bvaughn]

RDT 02 test is failing because of the Offscreen -> Activity rename. Going to see if I can update the golden recording to be based off of the test run from this branch.

[bvaughn]

Bummer. It looks like react/react-dom are missing source maps here.

After updating the Next config regex, the latest deploy has the correct source-maps!

[bvaughn]

I think everything should be good to go now. One more CI run.