react/packages/react-devtools-shared
Błażej Kustra 39c6545cef
Fix indices of hooks in devtools when using useSyncExternalStore (#34547)
## Summary

This PR updates getChangedHooksIndices to account for the fact that
useSyncExternalStore internally mounts two hooks, while DevTools should
treat it as a single user-facing hook.

It introduces a helper isUseSyncExternalStoreHook to detect this case
and adjust iteration so the extra internal hook is skipped when counting
changes.

Before:


https://github.com/user-attachments/assets/0db72a4e-21f7-44c7-ba02-669a272631e5

After:


https://github.com/user-attachments/assets/4da71392-0396-408d-86a7-6fbc82d8c4f5

## How did you test this change?

I used this component to reproduce this issue locally (I followed
instructions in `packages/react-devtools/CONTRIBUTING.md`).

```ts
function Test() {
  // 1
  React.useSyncExternalStore(
    () => {},
    () => {},
    () => {},
  );
  // 2
  const [state, setState] = useState('test'); 
  return (
    <>
      <div
        onClick={() => setState(Math.random())}
        style={{backgroundColor: 'red'}}>
        {state}
      </div>
    </>
  );
}
```
2025-10-21 13:59:20 +01:00
..
src Fix indices of hooks in devtools when using useSyncExternalStore (#34547) 2025-10-21 13:59:20 +01:00
babel.config.js Update Flow to 0.248 (#34248) 2025-08-21 11:15:34 -04:00
buildUtils.js feat[devtools]: add package for fusebox integration (#28553) 2024-04-12 15:29:35 +01:00
package.json [DevTools] Show the Suspense boundary name in the rect if there's no overlap (#34918) 2025-10-19 22:17:45 -04:00
README.md Update DevTools READMEs (#24105) 2022-03-16 11:37:10 -04:00
SourceMapIgnoreListPlugin.js feat[devtools]: ship source maps for content scripts and ignore list installHook script (#28730) 2024-04-08 18:10:09 +01:00

This directory contains code shared between several DevTools packages:

  • /packages/react-devtools-core
  • /packages/react-devtools-extensions
  • /packages/react-devtools-inline

It is not published or released anywhere directly.