components icon indicating copy to clipboard operation
components copied to clipboard

bug(cdk overlay): open/close overlay behavior

Open AnkitaSood opened this issue 2 months ago • 1 comments

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:

  1. Click on a button to open the overlay.
  2. Click anywhere outside of the overlay, notice the overlay closes.
  3. Click on a button to open the overlay again.
  4. 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

AnkitaSood avatar Apr 24 '24 13:04 AnkitaSood

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.

PsychoSpike avatar Apr 28 '24 12:04 PsychoSpike