React-dnd: Invariant Violation: Expected drag drop context find when deploy to server

I upgraded my packages to the latest and the error occurs in my local environment.

It’s because I have a ^ and I use yarn in local but npm in the cloud to build so I got different package version in local and dev.
And when I use 9.3.3 and 9.3.2, I got the same error: 'Invariant Violation: Expected drag drop context find. I lost the context.
And 9.2.1 is fine.

+1 I am getting this too

Environment looks like:

"react": "^16.8.6", "react-dnd": "^9.3.4", "react-dnd-html5-backend": "^9.3.4", "react-dom": "^16.8.6",

This probably means you've got DndProvider wrapping a component too low on your component tree.

Did you solve this? I had the same issue and it turned out I had multiple react-dnd libraries of different versions being bundled in my app. Hopefully this helps someone.

I am also facing the same issue. Did someone find the solution, please share.

I wasn't exporting the <DndProvider />. Once I did that, everything worked fine.

you should wrap your test file component like so:

<DndProvider backend={HTML5Backend}> <Component /> </DndProvider>

you should wrap your test file component like so:

<DndProvider backend={HTML5Backend}> <Component /> </DndProvider>

I really wish this info would be available on this page http://react-dnd.github.io/react-dnd/docs/overview.

Otherwise users have to scroll through a whole implementation of the chess board to find this.

I'm getting the Expected drag drop context error, too. For me this works only if the DndProvider is the immediate parent node of the component that uses useDrag. It works with an older version though (9.0.0). However, the hint

This should be mounted near the top of our application (meaning the DndProvider)

is definitely wrong.

@markusmauch

Thanks - this saved me a huge headache. Yeah, the documentation is definitely not accurate here.