bug(cdk/overlay): use of ngZoneRunCoalescing opens the overlay at wrong position

[michael-hein]

Reproduction

Use StackBlitz to reproduce your issue:

• Components: https://stackblitz.com/edit/angular-wgkr2a

Steps to reproduce:

1. setting"ngZoneRunCoalescing" to "true" in the main.ts

platformBrowserDynamic()
  .bootstrapModule(AppModule, { ngZoneRunCoalescing: true })
  .catch(err => console.error(err));

2. open any CDK overlay or any angular-material component which uses them (mat-select, mat-bottom-sheet..)

Expected Behavior

• the overlay should open at the right position
  

Actual Behavior

• overlay opens at top left
  

Environment

• Angular: 11.1.0
• CDK/Material: 11.1.0
• Browser(s): chrome
• Operating System (e.g. Windows, macOS, Ubuntu):

[crisbeto]

The issue comes from the fact that NgZone.onStable doesn't emit when the option is enabled. There are other places in Material and the CDK that are broken by this behavior as well. Is this intended @JiaLiPassion?

[JiaLiPassion]

@crisbeto , this is a bug of ngZoneRunCoalescing, and in fact, there is a dead loop when enable this option, I will create a PR to fix it asap.