LouisBrunner / LouisBrunner/dnd-multi-backend

DndProvider (new Api) cause Invariant Violation in production

Open
#105 7 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
211
Forks
36
Avg merge
1d 15h
Merged PRs (30d)
3

Description

```
"react": "^18.2.0",
"react-dnd": "^16.0.1",
"react-dnd-html5-backend": "^16.0.1",
"react-dnd-multi-backend": "^8.0.0",
"rdndmb-html5-to-touch": "^8.0.0",
```

I met with strange behavior, in the dev environment everything works with the new api, but in production there is an error
`Invariant Violation: Expected drag drop context`.
This happens with DndProvider (new API) usage only ``, but old one doesn't throw this error
```
import { DndProvider } from 'react-dnd'


...
```

This happens when i explicitly set `react-dnd-html5-backend` in package.json with updated yarn to 3.6.0 (because there is `import { getEmptyImage } from "react-dnd-html5-backend";` in code.)

Before this `DndProvider from 'react-dnd-multi-backend'` worked without this error

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the reported production setup using React 18.2.0, react-dnd 16.0.1, react-dnd-multi-backend 8.0.0, and rdndmb-html5-to-touch 8.0.0. Compare the new usage with the working backend={MultiBackend} form, including the explicit react-dnd-html5-backend dependency. Done means identifying a reproducible cause for the production invariant and confirming a fix without breaking the existing multi-backend usage.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.