[react profiler bug]Error: "getCommitTree(): Unable to reconstruct tree for root "1" and commit 1"

[Zaynex]

---

Please do not remove the text below this line

DevTools version: 4.0.2-2bcc6c6

Call stack: at d (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:11:5744)
at e.getCommitTree (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:11:8526)
at Ai (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:56:274200)
at Ha (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:55890)
at bi (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:62939)
at Xl (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:99535)
at Hl (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:84255)
at Fl (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:81285)
at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:43:25363
at n.unstable_runWithPriority (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:56:4368)

Component stack: in Ai
in div
in div
in div
in Or
in Unknown
in n
in Unknown
in div
in div
in Ua
in le
in ve
in ko
in Fl

[bvaughn]

Could you share repro steps for this please?

[raibima]

Got a similar error. It happens when you click on one of the components in the flame graph and toggle the filter by commit duration.

If you don't click the component first, the filter works as expected 👌

minimal repro: https://codesandbox.io/s/xenodochial-lamarr-q71wt

(Edit: I think it's a different one. I'll file a separate issue)
New issue: #16441

[Zaynex]

Could you share repro steps for this please?

I'am afraid not. That's my company project and I just start the react project and open react-dev-tools.

How about react team send the error stack error to some analyze website like sentry ?
I mean you can get the real error stack (not uglify codebase).

[gaearon]

@Zaynex It’s not the error stack that we’re looking for but the reproduction instructions.

[bvaughn]

Yup, something as detailed as @raibima's instructions above would be super helpful.

[bvaughn]

I've fixed the related issue, but I'm not sure how to repro this one yet so it's likely still broken. Still, might be worth checking 4.0.4 (will be uploading shortly) to see if it's fixed for you.

[Zaynex]

Click the next commit arrow -> cause error

[bvaughn]

Hm. Seems like something related to your project or setup/environment then. Just profiling and clicking the "->" arrow isn't sufficient to repro the error in my experience.

[bvaughn]

I finally saw this locally when profiling a react-window prototype.

It looks like the exported profiling session has only 33 saved mutations in the operations array, but it has 42 snapshots in the commitData array. Not sure how this happened.

Update 1

I'm able to reproduce this if I hammer my test app really hard while profiling. Seems like it may have something to do with a high rendering load.

Update 2

It looks like when I'm able to reproduce the problem- DevTools is reporting the following error the same number of times that the operations Array is off by:

Children cannot be added or removed during a reorder operation.

I'm also seeing "duplicate key warnings" in my main app. (Unsurprising since I've been playing around with key recycling.) Not sure how/if this is related yet though.

Update 3

Anecdotally it seems like fixing the duplicate key warning also fixes the DevTools warning and Profiler runtime error. Unfortunately I can't reproduce the Profiler error with something so simple as a project that intentionally triggers duplicate key warnings. (That isn't sufficient to cause the child reordering warning.)