[bug]: Dropdown options unselectable on React 19 — react-popper panel never positions when building web from source
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 59.6k
- Forks
- 5.8k
- Avg merge
- 1d 22h
- Merged PRs (30d)
- 49
Description
Current Behavior
When the web app is built from source (v1.4.2, React 19.2.8), dropdown panels open but options cannot be selected. Affected dropdowns include state, priority, member, cycle, module, estimate, project and intake — e.g. in the "create work item" modal, clicking any option in the state dropdown does nothing.
Steps to Reproduce
- Build
webfrom source usingapps/web/Dockerfile.web(turbo prune →pnpm turbo run build --filter=web). - Open the web app, create/open any work item modal.
- Open the state (or priority/cycle/module/member) dropdown.
- Click any option — nothing happens. No network request, no console error.
Root Cause
react-popper@2.3.0 receives the trigger button and panel DOM through callback refs (ref={setReferenceElement} / ref={setPopperElement} wired to useState setters). Under React 19, a disrupted render can drop those callback invocations, leaving the state null forever. usePopper's layout effect then returns early on its null guard, createPopper never runs (the panel has no data-popper-placement attribute), Combobox.Options stays at 0x0, and headlessui classifies every option click as an outside click.
Evidence collected from a live repro (React fiber inspection): referenceElement resolves to the button, popperElement stays null, styles.popper remains {position:'absolute',left:'0',top:'0'}, zero requests on click. Manually applying the expected fixed positioning to the panel makes option clicks work immediately.
Note: pnpm-workspace.yaml already documents that react-popper 2.3.0 was accepted on React 19 ("only uses hooks — runs unchanged"). That analysis holds for the happy path, but not for ref callbacks dropped across render interruptions.
Environment
- Self-hosted, built from source @ v1.4.2 (
makeplane/planemaster) - react 19.2.8, react-popper 2.3.0, @headlessui/react 2.2.10
Suggested Fix
Add DOM-recovery effects next to each usePopper call: when the ref state is null while the dropdown is open, locate the mounted trigger button / currently open panel (ul[data-headlessui-state="open"]) and feed it back into popper. A PR with this recovery for the affected dropdown components follows. Long-term, migrating off the archived react-popper to @floating-ui/react would remove the whole class of issues.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with apps/web/Dockerfile.web and the affected dropdown components' usePopper calls, then reproduce with the listed pnpm turbo build command. Verify that each open panel receives data-popper-placement and that options in the state or priority dropdown can be selected without the click being treated as outside.
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
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100