Skip to content

[select] Fix mouse selection in StrictMode dev#4897

Open
uixmat wants to merge 2 commits into
mui:masterfrom
uixmat:fix/select-strictmode-mouse-selection
Open

[select] Fix mouse selection in StrictMode dev#4897
uixmat wants to merge 2 commits into
mui:masterfrom
uixmat:fix/select-strictmode-mouse-selection

Conversation

@uixmat
Copy link
Copy Markdown

@uixmat uixmat commented May 23, 2026

Summary

  • Re-sync CompositeList elementsRef from sortedMap on each layout effect run so list navigation can resolve live DOM nodes after StrictMode cleanup wipes refs without re-running item ref callbacks
  • Fixes mouse selection in Select (and other composite list consumers) in React StrictMode dev environments such as Next.js dev

Fixes #4698

Test plan

  • pnpm test:jsdom CompositeList --no-watch
  • pnpm test:jsdom SelectRoot --no-watch
  • Manual verification in docs dev: open select, click item, value commits

Re-sync CompositeList elementsRef from sortedMap after StrictMode cleanup
wipes refs without re-running item ref callbacks, which broke list
navigation and mouse selection in Select.
@code-infra-dashboard
Copy link
Copy Markdown

code-infra-dashboard Bot commented May 23, 2026

Bundle size

Bundle Parsed size Gzip size
@base-ui/react 🔺+58B(+0.01%) 🔺+17B(+0.01%)

Details of bundle changes

Performance

Total duration: 1,510.19 ms 🔺+261.18 ms(+20.9%) | Renders: 50 (+0) | Paint: 2,297.37 ms 🔺+401.98 ms(+21.2%)

Test Duration Renders
Tabs mount (200 instances) 291.81 ms 🔺+66.02 ms(+29.2%) 4 (+0)
Menu mount (300 instances) 172.98 ms 🔺+35.82 ms(+26.1%) 2 (+0)
Select mount (200 instances) 179.97 ms 🔺+35.69 ms(+24.7%) 3 (+0)
Scroll Area mount (300 instances) 116.96 ms 🔺+29.05 ms(+33.1%) 3 (+0)
Mixed surface mount (app-like density) 96.34 ms 🔺+23.41 ms(+32.1%) 5 (+0)

…and 2 more (+5 within noise) — details


Check out the code infra dashboard for more information about this PR.

@netlify
Copy link
Copy Markdown

netlify Bot commented May 23, 2026

Deploy Preview for base-ui ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 4ba115b
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a11bc9d6a571700082d5c5e
😎 Deploy Preview https://deploy-preview-4897--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Use React.Fragment in CompositeList test and limit StrictMode Select
regression test to jsdom where the popup opens reliably.
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 23, 2026

commit: 4ba115b

@atomiks
Copy link
Copy Markdown
Contributor

atomiks commented May 25, 2026

@uixmat thanks for the fix — mouse selection without highlight was already fixed in #4699, so the tests should prove that [data-highlighted] is correctly set in Strict Mode. I have a feeling it may not be reproducible in our test env though.

Note this also adds an extra O(n) scan just to fix a rare dev mode problem, ideally it would be cheaper.

@uixmat
Copy link
Copy Markdown
Author

uixmat commented May 25, 2026

@uixmat thanks for the fix — mouse selection without highlight was already fixed in #4699, so the tests should prove that [data-highlighted] is correctly set in Strict Mode. I have a feeling it may not be reproducible in our test env though.

Note this also adds an extra O(n) scan just to fix a rare dev mode problem, ideally it would be cheaper.

No problem, go-ahead and close the PR if you like, i'll hunt down some other issues!

@zannager zannager added the component: select Changes related to the select component. label May 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: select Changes related to the select component.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[select] Mouse selection is a no-op in dev StrictMode

3 participants