[joy-ui][Select] Bug: Options visually selected after clicking the clear selections button in the Select component

Open
#43,000 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
javascript, react
Domain
frontend

Research direction

Start with the Joy UI Select Clear Action example at the linked documentation page and reproduce the stale visual selection after clearing values. Trace the Select component's option-rendering and selection state, then verify that reopening the options menu shows no prior selections after clearing.

Written by the indexing model from the issue text.

Description

on hold package: joy-ui scope: select support: docs-feedback
Related page

https://mui.com/joy-ui/react-select/

Kind of issue

Broken demo

Issue description

There is a bug in JoyUI's Select component at Clear Action example. When I use the clear selections button, the selected values ​​are removed as expected. However, when I open the options menu again, the previously chosen options still visually appear as selected.

Steps to reproduce:

1- Go to the Select component example page with the clear selections button.
2- Select some options in Select.
3- Click the button to clear selections.
4- Open the Select Options menu again.

Expected behavior:

Options that were previously selected should not visually appear as selected after clicking the clear selections button.

Current behavior:

Options that were previously selected still appear visually as selected after clicking the clear selections button, even though they are no longer selected.

Context

While implementing a Select all option, I realized the effect was not being applied correctly after selecting all the options.

Search keywords: UI, visual bug, clear selection

Dominant language
JavaScript
Stars
99.1k
Forks
32.5k
Avg merge
2d 17h
Merged PRs (30d)
106

Contributor guide

Open the contributing guide

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.

More from mui/material-ui

All issues in mui/material-ui

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.