fix(core): take into account scrollbar in active zone (#6790)

taiga-family · Feb 20, 2024 · 372c780 · 372c780
1 parent da57038
commit 372c780
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/projects/cdk/components/scroll-controls/scrollbar.directive.ts b/projects/cdk/components/scroll-controls/scrollbar.directive.ts
@@ -2,12 +2,7 @@ import {DOCUMENT} from '@angular/common';
 import {Directive, ElementRef, Inject, Input, NgZone, Self} from '@angular/core';
 import {ANIMATION_FRAME} from '@ng-web-apis/common';
 import {POLLING_TIME} from '@taiga-ui/cdk/constants';
-import {
-    tuiScrollFrom,
-    tuiStopPropagation,
-    tuiTypedFromEvent,
-    tuiZonefree,
-} from '@taiga-ui/cdk/observables';
+import {tuiScrollFrom, tuiTypedFromEvent, tuiZonefree} from '@taiga-ui/cdk/observables';
 import {TuiDestroyService} from '@taiga-ui/cdk/services';
 import {TUI_SCROLL_REF} from '@taiga-ui/cdk/tokens';
 import {merge, Observable} from 'rxjs';
@@ -48,7 +43,6 @@ export class TuiScrollbarDirective {
         merge(
             mousedownWrapper$.pipe(map(event => this.getScrolled(event, 0.5, 0.5))),
             mousedown$.pipe(
-                tuiStopPropagation(),
                 switchMap(event => {
                     const rect = nativeElement.getBoundingClientRect();
                     const vertical = getOffsetVertical(event, rect);

diff --git a/projects/demo-playwright/tests/core/dropdown/dropdown.spec.ts b/projects/demo-playwright/tests/core/dropdown/dropdown.spec.ts
@@ -68,4 +68,15 @@ test.describe('Dropdown', () => {
         await page.keyboard.press('Escape');
         await expect(page).toHaveScreenshot('09-dropdown.png');
     });
+
+    test('Scrollbar dropdown in active zone', async ({page}) => {
+        await tuiGoto(page, '/directives/dropdown/API?tuiDropdownMaxHeight=150');
+
+        const api = new TuiDocumentationPagePO(page).apiPageExample;
+
+        await api.locator('button').click();
+        await expect(page).toHaveScreenshot('10-dropdown.png');
+        await page.locator('tui-dropdown').locator('tui-scrollbar .t-thumb').click();
+        await expect(page).toHaveScreenshot('11-dropdown.png');
+    });
 });