Skip to content

Commit 8a7b737

Browse files
fix: do not consider touchstart event as outside click (ng-select#2697)
`touchstart` events were considered as outside clicks, which caused the dropdown to be closed when scrolling outside the select component on mobile devices. `click` events are sufficient to detect outside clicks on mobile devices. Tapping outside the select component still closes the dropdown. Reverts ng-select#737. Fixes ng-select#2594. Co-authored-by: Pavan Kumar Jadda <17564080+pavankjadda@users.noreply.github.com>
1 parent b9e079c commit 8a7b737

File tree

2 files changed

+2
-11
lines changed

2 files changed

+2
-11
lines changed

src/ng-select/lib/ng-dropdown-panel.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import {
1919
viewChild,
2020
} from '@angular/core';
2121

22-
import { animationFrameScheduler, asapScheduler, fromEvent, merge, Subject } from 'rxjs';
22+
import { animationFrameScheduler, asapScheduler, fromEvent, Subject } from 'rxjs';
2323
import { auditTime, takeUntil } from 'rxjs/operators';
2424
import { NgDropdownPanelService, PanelDimensions } from './ng-dropdown-panel.service';
2525

@@ -231,7 +231,7 @@ export class NgDropdownPanelComponent implements OnInit, OnChanges, OnDestroy {
231231
}
232232

233233
this._zone.runOutsideAngular(() => {
234-
merge(fromEvent(this._document, 'touchstart', { capture: true }), fromEvent(this._document, 'click', { capture: true }))
234+
fromEvent(this._document, 'click', { capture: true })
235235
.pipe(takeUntil(this._destroy$))
236236
.subscribe(($event) => this._checkToClose($event));
237237
});

src/ng-select/lib/ng-select.component.spec.ts

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2399,15 +2399,6 @@ describe('NgSelectComponent', () => {
23992399
expect(fixture.componentInstance.select().isOpen()).toBeFalsy();
24002400
}));
24012401

2402-
it('should close dropdown if opened and touched outside dropdown container', fakeAsync(() => {
2403-
triggerKeyDownEvent(getNgSelectElement(fixture), KeyCode.Space);
2404-
expect(fixture.componentInstance.select().isOpen()).toBeTruthy();
2405-
const event = new TouchEvent('touchstart', { bubbles: true });
2406-
document.getElementById('outside').dispatchEvent(event);
2407-
tickAndDetectChanges(fixture);
2408-
expect(fixture.componentInstance.select().isOpen()).toBeFalsy();
2409-
}));
2410-
24112402
it('should prevent dropdown close if clicked on select', fakeAsync(() => {
24122403
triggerKeyDownEvent(getNgSelectElement(fixture), KeyCode.Space);
24132404
expect(select.isOpen()).toBeTruthy();

0 commit comments

Comments
 (0)