Clicking any button inside modal will close it

[dkzeb]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:

Current behavior

If the modal is configured to allow close (by escape, close button, etc ...) and a button is present in the component loaded into the modal - clicking this button will close the modal.

Expected behavior

I would expect the modal to not close when "in-modal" buttons are clicked

Minimal reproduction of the problem with instructions

1. Create a component with a button an (click) handler
2. Open the component using dialogService
3. Click the in-component button
4. Modal closes

What is the motivation / use case for changing the behavior?

We should be able to have buttons inside modals that do not close modals on click

Environment

Angular version: 12.0.2


Browser:
- [x] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: 14.15.4 
- Platform:  Windows 

Others:

I have the same problem.

I was able to work around the problem by defining a BeforeCloseGuard (dialogRef.beforeClose (() => [expression]))

Its dirty but it works :D

[Lakston]

You should probably provide a repro via stackblitz or something like that because I dont have this problem at all.

[iCrawl]

This behaviour doesn't exist on version 1.4.0 btw, only upwards from that, so something changed how it is being handled. We had to lock our version to it otherwise the whole application was just not working as intended.

[NetanelBasal]

I can't reproduce it. If you can reproduce it, feel free to reopen the issue.