[DevTools Bug]: React Profiler reports higher hook numbers than shown in Components

[iamakulov]

Website or app

https://github.com/3perf/react-workshop-fwdays-mar24

Repro steps

• Clone the https://github.com/3perf/react-workshop-fwdays-mar24 repository

• Switch to the branch called day5

• cd widgets-editor && yarn && yarn start

• An app will open. Reproduce the following interaction & record a Profiler trace:

  CleanShot.2024-03-19.at.01.33.16.mp4

• Find the first render of the ResizableComponent component in the trace

• Observe React Profiler reporting “hook 32 changed” whereas the Components pane reporting only 30 hooks in the component (as in the video)

Sorry for not having a minimal repro! I was only able to reproduce this in big apps like the one attached. However, it reproduces reliably.

How often does this bug happen?

Every time

DevTools package (automated)

No response

DevTools version (automated)

No response

Error message (automated)

No response

Error call stack (automated)

No response

Error component stack (automated)

No response

GitHub query string (automated)

No response

[eps1lon]

Thank you for the detailed repro instructions. I can also reproduce this as instructed.

I have a test reproducing the issue in #28587 that basically just inline all 3rd party dependencies. I haven't started further reducing the repro until it no longer reproduces but this should be a good starting point if somebody wants to dig into this.

[standbyoneself]

Same issue. Any thoughts on this?