components
components copied to clipboard
bug(cdk overlay): open/close overlay behavior
Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
No response
Description
The cdkoverlay doesn't close on click of the trigger button after it has been opened, if both (overlayOutsideClick)="isOpen=false"
is added to the overlay template and (click)="isOpen = !isOpen"
is added to the trigger button.
Reproduction
StackBlitz link: https://stackblitz.com/edit/nxazcw?file=src%2Fexample%2Fcdk-overlay-basic-example.html Steps to reproduce:
- Click on a button to open the overlay.
- Click anywhere outside of the overlay, notice the overlay closes.
- Click on a button to open the overlay again.
- Click on the same button to close the overlay - notice that it doesn't close.
Expected Behavior
The overlay should close on click of the trigger button as well as when the user clicks anywhere outside the overlay.
Actual Behavior
If the ability the close the overlay by clicking anywhere outside is added, clicking on the button again doesn't close the overlay.
Environment
- Angular: 17.3.1
- CDK/Material: 17.3.1
- Browser(s): All major browsers
- Operating System (e.g. Windows, macOS, Ubuntu): All operating systems
I can at least confirm this behavior. The moment you use (overlayOutsideClick) on the template and the template gets called once, it seems the original (click) on the button stops firing.