#6163 Scroll bar in the Property Grid is not responding to clicks (#6165

) Fixes #6163
surveyjs · Nov 30, 2024 · 8eb1827 · 8eb1827
1 parent 76be17d
commit 8eb1827
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 2 deletions.
diff --git a/functionalTests/property-grid/survey.ts b/functionalTests/property-grid/survey.ts
@@ -220,4 +220,19 @@ test("Drop-down menus do not close on second click", async (t) => {
 
     .click(panel.find(".spg-panel__content"), { offsetX: 10, offsetY: 10 })
     .expect(popupContainer.visible).notOk();
+});
+
+test("tabbed mode", async (t) => {
+  const json = {
+    elements: [
+      {
+        type: "dropdown",
+        name: "q1",
+        title: "title"
+      }
+    ]
+  };
+  await setJSON(json);
+  await t.hover(Selector(".svc-side-bar .svc-scroll__wrapper").filterVisible());
+  await t.expect(Selector(".svc-side-bar .svc-scroll__scrollbar").visible).notOk();
 });
diff --git a/packages/survey-creator-core/src/components/scroll.scss b/packages/survey-creator-core/src/components/scroll.scss
@@ -33,7 +33,7 @@
   overflow-x: hidden;
   width: fit-content;
   margin-inline-start: -1px;
-  display: none;
+  visibility: hidden;
   z-index: 30;
   inset-inline-end: 0;
   inset-inline-start: initial;
@@ -44,7 +44,7 @@
 }
 
 .svc-scroll__wrapper:hover .svc-scroll__scrollbar {
-  display: block;
+  visibility: visible;
 }
 
 .svc-scroll__scrollbar-sizer {

diff --git a/packages/survey-creator-core/src/components/scroll.ts b/packages/survey-creator-core/src/components/scroll.ts
@@ -33,6 +33,7 @@ export class ScrollViewModel {
           ? entry.contentBoxSize[0].blockSize
           : entry.contentRect.width;
         this._scrollbarSizerElement.style.height = height + "px";
+        this._scrollbarElement.style.visibility = this._scrollbarElement.clientHeight >= height ? "hidden" : "";
       }
     });
     this._containerBodyResizeObserver.observe(this._containerBodyElement);