search

facebook / react

The library for web and native user interfaces.
https://react.dev
MIT License
227.3k stars 46.36k forks source link

[DevTools Bug] Children cannot be added or removed during a reorder operation. #28777

Open amalfrost opened 5 months ago

amalfrost commented 5 months ago

Website or app

https://redeemerllc.com

Repro steps

when searching the products

How often does this bug happen?

Often

DevTools package (automated)

react-devtools-extensions

DevTools version (automated)

5.0.2-47cf347e4

Error message (automated)

Children cannot be added or removed during a reorder operation.

Error call stack (automated)

at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1134857
    at A.emit (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1101500)
    at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1103188
    at bridgeListener (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1509150)

Error component stack (automated)

No response

GitHub query string (automated)

https://api.github.com/search/issues?q=Children cannot be added or removed during a reorder operation. in:title is:issue is:open is:public label:"Component: Developer Tools" repo:facebook/react
callumlocke commented 4 months ago

I'm getting this too, seeing the error reported only at the top of the local React devtools (Electron app) with a link to this issue. Error doesn't show in the browser console. There's nothing in the stack trace pointing at my files, only modules within react-devtools-core. I've no idea what it means but I notice chrome-extension:// in the call stack in the issue report above, which might be relevant because my app under development is a Chrome extension.

Stevengez commented 4 months ago

Not sure if this can help anyone, but for me this bug occurred only when there was a list of elements (with map) that happened to have two elements with same key, after removing the duplicate, the bug was gone.

callumlocke commented 4 months ago

@Stevengez thanks, I also have a separate bug involving duplicate keys which is probably not separate after all

imadtg commented 1 month ago

Not sure if this can help anyone, but for me this bug occurred only when there was a list of elements (with map) that happened to have two elements with same key, after removing the duplicate, the bug was gone.

had the bug happen to me in the same way.

aurobindobhuyan commented 3 weeks ago

I was also getting the same error, I was using Next.js 14.2, which could be the reason I didn't get the duplicate key warning. After struggling a couple of times I discovered that error, and replaced it with the index numbers. And it solved 🥲