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

Alice-in-korea commented 3 years ago

Website or app

https://github.com/Alice-in-korea/chrome_bug_report.git

Repro steps

Click next day button or prev day button
Normally there are only three column for three days but you can see the fragment of other column with error message.

How often does this bug happen?

Every time

DevTools package (automated)

react-devtools-extensions

DevTools version (automated)

4.13.5-0ae5290b54

Error message (automated)

Children cannot be added or removed during a reorder operation.

Error call stack (automated)

at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:21301:41
    at bridge_Bridge.emit (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:19286:22)
    at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:19446:12
    at listener (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:37413:39)

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

leventdeniz commented 3 years ago

See this comment: https://github.com/facebook/react/issues/21468#issuecomment-838770329

Christopher-Stevers commented 2 years ago

I'm having the same issue.

Website or app

https://github.com/Christopher-Stevers/OpenQ-Frontend/tree/pagination

Repro steps

Go to organization route, toggle to Bounties, and scroll down. This will load more bounties (infinite scrolling) then click on remove unfunded checkbox.

How often does this bug happen?

Every time

usamajabbasi commented 2 years ago

Facing same issue ✋🏻✋🏻

joaoigormatos commented 2 years ago

Also facing the same problem.

gaearon commented 2 years ago

cc @lunaruan seems like this has a repro, has anyone had a chance to look?

lunaruan commented 2 years ago

Not yet. It seems like both repros are unavailable. @Christopher-Stevers could you reupload your repro please? 😊

ychcg commented 2 years ago

I also facing the same issue

lunaruan commented 2 years ago

@ychcg Could you upload a repro for this?

aomini commented 2 years ago

I had faced this issue in infinite scroll due to duplicate keys. Preview of devtools in a gif:

ghimire-dinesh commented 2 years ago

I had faced the same issue in infinite scroll due to duplicate keys and got fixed after changing the key.

leventdeniz commented 2 years ago

I threw together a quick demo for this @lunaruan

Demo: https://po0o5k.csb.app/ Code: https://codesandbox.io/s/mystifying-ptolemy-po0o5k?file=/src/App.js

open react-devtools
click one of the two buttons

I am aware that this is fixable by just removing the duplicate keys but still wanted to provide a demo for this, as it was asked for in this thread. In my demo it is easily fixable by cleaning up the data but for others it may be to use a key that is more unique.

facebook / react