bug(cdk/overlay): OverlayRef.outsidePointerEvents() should not emit with mousedown inside overlay and mouseup outside it

Reproduction

Use StackBlitz to reproduce your issue: https://stackblitz.com/edit/components-issue-iikzo4?file=src%2Fmain.ts

Steps to reproduce:

1. Click open to open overlay
2. Mousedown inside the overlay, move mouse outside overlay and release click

Expected Behavior

OverlayRef.outsidePointerEvents() does not emit, since the mouse down did originate inside the overlay. This is useful in scenarios where users want to mark text inside and overlay and copy it, but might move the cursor outside the overlay.

Actual Behavior

OverlayRef.outsidePointerEvents() emits (see console)

Additional notes

I implemented a workaround by replacing the ‘click’ event with the ‘mousedown’; See overlay-outside-click-dispatcher.service.ts and main.ts:37-42 It is also certainly possible to implement a workaround that does not rely on outsidePointerEvents(), but it would be far easier to use it.

Unfortunately I don’t know whether the current behavior is intentional by the components team or merely an oversight.

Environment

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

[crisbeto]

This also feels a little weird to me since people would have to be familiar with the internals of the dispatcher in order to use the API. And as you mentioned, there’s the issue of double events. I’ll add this issue for discussion during our next team meeting to get some different perspectives on it.

[crisbeto]

We generally try not to have drastically different behavior between tests and the real component. The _isTestEnvironment is used in two very specific cases that wouldn’t have an effect on the actual application.