Skip to content

fix(material/autocomplete): prevent outside clicks from going to other overlays #25243

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.

Sign up for GitHub

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

Merged
merged 1 commit into from
Jul 20, 2022
Merged

fix(material/autocomplete): prevent outside clicks from going to other overlays #25243

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions src/material/autocomplete/autocomplete-trigger.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -836,6 +836,11 @@ export abstract class _MatAutocompleteTriggerBase
event.preventDefault();
}
});

// Subscribe to the pointer events stream so that it doesn't get picked up by other overlays.
// TODO(crisbeto): we should switch `_getOutsideClickStream` eventually to use this stream,
// but the behvior isn't exactly the same and it ends up breaking some internal tests.
overlayRef.outsidePointerEvents().subscribe();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not following what this does - why does adding this subscription change any behavior? What's the side-effect of subscribing?

Copy link
Member Author

@crisbeto crisbeto Jul 11, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The outside click dispatcher keeps a stack of the open overlays. Whenever a click event happens, it starts from the top of the stack and works its way down until it finds an overlay that has any subscribers to outsidePointerEvents so that it can dispatch the event to it. This was a problem for the autocomplete, because it handles outside clicks internally, instead of going through the dispatcher which meant that it would get skipped over when determining which overlay is on top. The proper fix would be to use the dispatcher, but last time I tried it was somewhat breaking since the autocomplete existed much earlier than the dispatcher.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Gotcha thanks

}
}

Expand Down