Skip to content

Commit 0ff7434

Browse files
committed
refactor(cdk/overlay): remove logic which tracks excluded elements from outside clicks
This removes the ability to track excluded elements from the overlay and only stops outside click event notifications if the click event occurred within an overlay element itself. The overlay should not track elements to be excluded from outside click - this should be up to the developer. This allows for custom closeout logic to be implemented by the developer leaving the cdk to be unopinionated.
1 parent db4b0cd commit 0ff7434

File tree

4 files changed

+23
-25
lines changed

4 files changed

+23
-25
lines changed

src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.spec.ts

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -125,26 +125,34 @@ describe('OverlayOutsideClickDispatcher', () => {
125125
overlayTwo.dispose();
126126
});
127127

128-
it(`should not dispatch click event when click on element
129-
included in excludeFromOutsideClick array`, () => {
128+
it('should dispatch the click event when click is on an element outside the overlay', () => {
129+
const portal = new ComponentPortal(TestComponent);
130130
const overlayRef = overlay.create();
131-
const spy = jasmine.createSpy('overlay mouse click event spy');
131+
overlayRef.attach(portal);
132+
const button = document.createElement('button');
133+
document.body.appendChild(button);
134+
135+
const spy = jasmine.createSpy('overlay mouse click spy');
132136
overlayRef.outsidePointerEvents().subscribe(spy);
133137

134-
const overlayConfig = overlayRef.getConfig();
135-
expect(overlayConfig.excludeFromOutsideClick).toBeDefined();
136-
expect(overlayConfig.excludeFromOutsideClick!.length).toBe(0);
138+
button.click();
139+
expect(spy).toHaveBeenCalled();
137140

138-
overlayRef.attach(new ComponentPortal(TestComponent));
141+
button.parentNode!.removeChild(button);
142+
overlayRef.dispose();
143+
});
144+
145+
it('should not dispatch the click event when click is on an element inside the overlay', () => {
146+
const portal = new ComponentPortal(TestComponent);
147+
const overlayRef = overlay.create();
148+
overlayRef.attach(portal);
139149

140-
const buttonShouldNotDetach = document.createElement('button');
141-
document.body.appendChild(buttonShouldNotDetach);
142-
overlayConfig.excludeFromOutsideClick!.push(buttonShouldNotDetach);
143-
buttonShouldNotDetach.click();
150+
const spy = jasmine.createSpy('overlay mouse click event spy');
151+
overlayRef.outsidePointerEvents().subscribe(spy);
144152

153+
overlayRef.overlayElement.click();
145154
expect(spy).not.toHaveBeenCalled();
146155

147-
buttonShouldNotDetach.parentNode!.removeChild(buttonShouldNotDetach);
148156
overlayRef.dispose();
149157
});
150158
});

src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -79,13 +79,9 @@ export class OverlayOutsideClickDispatcher extends BaseOverlayDispatcher {
7979
continue;
8080
}
8181

82-
const config = overlayRef.getConfig();
83-
const excludeElements = [...config.excludeFromOutsideClick!, overlayRef.overlayElement];
84-
const isInsideClick: boolean = excludeElements.some(e => e.contains(event.target as Node));
85-
86-
// If it is inside click just break - we should do nothing
87-
// If it is outside click dispatch the mouse event, and proceed with the next overlay
88-
if (isInsideClick) {
82+
// If it's a click inside the overlay, just break - we should do nothing
83+
// If it's an outside click dispatch the mouse event, and proceed with the next overlay
84+
if (overlayRef.overlayElement.contains(event.target as Node)) {
8985
break;
9086
}
9187

src/cdk/overlay/overlay-config.ts

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -59,11 +59,6 @@ export class OverlayConfig {
5959
*/
6060
disposeOnNavigation?: boolean = false;
6161

62-
/**
63-
* Array of HTML elements clicking on which should not be considered as outside click
64-
*/
65-
excludeFromOutsideClick?: HTMLElement[] = [];
66-
6762
constructor(config?: OverlayConfig) {
6863
if (config) {
6964
// Use `Iterable` instead of `Array` because TypeScript, as of 3.6.3,

tools/public_api_guard/cdk/overlay.d.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,6 @@ export declare class OverlayConfig {
205205
backdropClass?: string | string[];
206206
direction?: Direction | Directionality;
207207
disposeOnNavigation?: boolean;
208-
excludeFromOutsideClick?: HTMLElement[];
209208
hasBackdrop?: boolean;
210209
height?: number | string;
211210
maxHeight?: number | string;

0 commit comments

Comments
 (0)