[Chip] Fix delete icon stopPropagation blocking ClickAwayListener #47628
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Only call event.stopPropagation() on delete icon click when the Chip has an onClick handler. This allows click events to propagate to parent listeners like ClickAwayListener when the Chip only has onDelete. Fixes mui#47234
Netlify deploy previewhttps://deploy-preview-47628--material-ui.netlify.app/ Bundle size report
|
zannager
requested review from
mj12albert and
siriwatknp
and removed request for
siriwatknp
ZeeshanTamboli
previously requested changes
Jan 19, 2026
Member
There was a problem hiding this comment.
This won't work if the chip is clickable and deletable. See StackBlitz pointing to this PR build: https://stackblitz.com/edit/gibkpfdb?file=src%2FApp.tsx
Contributor
Author
|
@ZeeshanTamboli I've made updates to the PR. Should work now. Please review. Stackblitz URL for updated PR build: https://stackblitz.com/edit/gibkpfdb-ujpaaqbe?file=src%2FApp.tsx |
Member
ZeeshanTamboli
left a comment
ZeeshanTamboli
left a comment
There was a problem hiding this comment.
This works well if I test it. But I am worried if there could be any breaking change here. @mj12albert @siriwatknp Would you mind taking a look?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #47234
The Chip's delete icon handler was unconditionally calling
event.stopPropagation(), which prevented click events from reaching parent listeners likeClickAwayListener. This caused issues when a Chip with a delete icon was placed inside a Popper with ClickAwayListener - clicking the delete icon would not close the Popper.This PR changes the behavior to only call
stopPropagation()when the Chip itself has anonClickhandler. This preserves the original intent (preventing the delete click from triggering the Chip's onClick) while allowing events to propagate to parent listeners when the Chip is not clickable.Changes
handleDeleteIconClickinChip.jsto conditionally callstopPropagation()only whenonClickis definedonClickis present