Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[SelectableTile] Selected state is out of sync when user do shift+click for multi-selection #7759

Closed
ZhiboMZhang opened this issue Feb 8, 2021 · 2 comments · Fixed by #8279
Assignees
Labels

Comments

@ZhiboMZhang
Copy link

ZhiboMZhang commented Feb 8, 2021

The last selected item can lose selected state in certain scenario.

Steps to reproduce:

  1. Build a view with list of selectable tile
  2. Click on one tile and then hold shift to do multi-selection on tiles
  3. Hold the shift key and select any tile again
    Bug -> if the tile was previously selected, the tile is deselected, even though the select props passed in indicate that the tile should persistent selection
    holdingShiftToDeselectObjects

Looked into the code base, the issue seems from here:
https://github.com/carbon-design-system/carbon-components-react/blob/master/src/components/Tile/Tile.js#L228
https://github.com/carbon-design-system/carbon-components-react/blob/master/src/components/Tile/Tile.js#L239-L247
When user click on the tile, the selected state doesn't respect the selected props value.

Environment

Operating system Mac OS

Browser Chrome

Automated testing tool and ruleset

Assistive technology used to verify

Detailed description

What version of the Carbon Design System are you using? "carbon-components": "10.17.0", "carbon-components-react": "7.17.0",

What did you expect to happen? The selected state should respect the selected props value passed in.

What happened instead? The selected state automatically toggled when user click on the tile

What WCAG 2.1 checkpoint does the issue violate?

Steps to reproduce the issue

  1. Click on the fourth tile, it should select all the four tiles, but the last tile is toggled as deselected.

Please create a reduced test case in CodeSandbox

Thanks Bill for helping me put up this codesandbox link. The critical line is at line 76.

Additional information

  • Screenshots or code
    Feb-08-2021 15-19-46

  • Notes

@emyarod
Copy link
Member

emyarod commented Mar 23, 2021

imo the tiles should either be fully controlled (like Carbon checkboxes currently) or fully uncontrolled, rather than a mixture of the two

@emyarod
Copy link
Member

emyarod commented Apr 1, 2021

I believe that shift click behavior is not supported out of the box by the multi select tile though

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants