fix(cdk-experimental/menu): keep context menus open when mouse is released

Author: mmalerba

src/cdk-experimental/menu/context-menu.ts

@@ -8,28 +8,28 @@
 
 import {
   Directive,
-  Input,
-  ViewContainerRef,
-  Output,
   EventEmitter,
-  Optional,
-  OnDestroy,
   Inject,
   Injectable,
   InjectionToken,
+  Input,
+  OnDestroy,
+  Optional,
+  Output,
+  ViewContainerRef,
 } from '@angular/core';
 import {Directionality} from '@angular/cdk/bidi';
 import {
-  OverlayRef,
+  ConnectedPosition,
+  FlexibleConnectedPositionStrategy,
   Overlay,
   OverlayConfig,
-  FlexibleConnectedPositionStrategy,
-  ConnectedPosition,
+  OverlayRef,
 } from '@angular/cdk/overlay';
-import {TemplatePortal, Portal} from '@angular/cdk/portal';
-import {coerceBooleanProperty, BooleanInput} from '@angular/cdk/coercion';
-import {Subject, merge} from 'rxjs';
-import {takeUntil} from 'rxjs/operators';
+import {Portal, TemplatePortal} from '@angular/cdk/portal';
+import {BooleanInput, coerceBooleanProperty} from '@angular/cdk/coercion';
+import {merge, partition, Subject} from 'rxjs';
+import {skip, takeUntil} from 'rxjs/operators';
 import {CdkMenuPanel} from './menu-panel';
 import {MenuStack} from './menu-stack';
 import {throwExistingMenuStackError} from './menu-errors';
@@ -287,8 +287,11 @@ export class CdkContextMenuTrigger implements OnDestroy {
    */
   private _subscribeToOutsideClicks() {
     if (this._overlayRef) {
-      this._overlayRef
-        .outsidePointerEvents()
+      const allClicks = this._overlayRef.outsidePointerEvents();
+      const [auxClicks, nonAuxClicks] = partition(allClicks, ({type}) => type === 'auxclick');
+      // Skip the first auxclick event because it fires on mouseup after the
+      // contextmenu event that opened the menu.
+      merge(nonAuxClicks, auxClicks.pipe(skip(1)))
         .pipe(takeUntil(this._stopOutsideClicksListener))
         .subscribe(event => {
           if (!isClickInsideMenuOverlay(event.target as Element)) {