From 8ee612b14d102252f2b808d753fe0b61a8d4df89 Mon Sep 17 00:00:00 2001
From: tsv2013 <tsv2013@noreply.github.com>
Date: Fri, 12 Jul 2024 14:29:00 +0300
Subject: [PATCH] Fixed #8513 - Sticky progress bar doesn't hide (at least
 safari/chrome mac os)

---
 src/survey.ts        | 14 ++++++++++++--
 tests/surveytests.ts | 22 ++++++++++++++++++++++
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/src/survey.ts b/src/survey.ts
index 5b296a7600..6ccfdf9189 100644
--- a/src/survey.ts
+++ b/src/survey.ts
@@ -7729,10 +7729,20 @@ export class SurveyModel extends SurveyElementCore
   disposeCallback: () => void;
 
   private onScrollCallback: () => void;
+  // private _lastScrollTop = 0;
+  public _isElementShouldBeSticky(selector: string): boolean {
+    if (!selector) return false;
+    const topStickyContainer = this.rootElement.querySelector(selector);
+    if (!!topStickyContainer) {
+      // const scrollDirection = this.rootElement.scrollTop > this._lastScrollTop ? "down" : "up";
+      // this._lastScrollTop = this.rootElement.scrollTop;
+      return this.rootElement.scrollTop > 0 && topStickyContainer.getBoundingClientRect().y <= this.rootElement.getBoundingClientRect().y;
+    }
+    return false;
+  }
   public onScroll(): void {
     if (!!this.rootElement) {
-      const topStickyContainer = this.rootElement.querySelector(".sv-components-container-center");
-      if (!!topStickyContainer && topStickyContainer.getBoundingClientRect().y <= this.rootElement.getBoundingClientRect().y) {
+      if (this._isElementShouldBeSticky(".sv-components-container-center")) {
         this.rootElement.classList && this.rootElement.classList.add("sv-root--sticky-top");
       } else {
         this.rootElement.classList && this.rootElement.classList.remove("sv-root--sticky-top");
diff --git a/tests/surveytests.ts b/tests/surveytests.ts
index 1f8a7f33ee..d1a42276c7 100644
--- a/tests/surveytests.ts
+++ b/tests/surveytests.ts
@@ -20048,3 +20048,25 @@ QUnit.test("Delete panel with questions", (assert) => {
   assert.notOk(survey.getPanelByName("panel1"), "#5");
   assert.notOk(survey.getQuestionByName("question1"), "#6");
 });
+QUnit.test("_isElementShouldBeSticky", (assert) => {
+  const survey = new SurveyModel({});
+  const topStickyContainer: any = {
+    getBoundingClientRect: () => ({ y: 64 })
+  };
+  const rootElement: any = {
+    getBoundingClientRect: () => ({ y: 64 }),
+    querySelector: () => topStickyContainer,
+    scrollTop: 0
+  };
+  survey.rootElement = rootElement;
+
+  assert.notOk(survey._isElementShouldBeSticky(".test"), "no scrolling");
+
+  rootElement.scrollTop = 50;
+  assert.ok(survey._isElementShouldBeSticky(".test"), "content is scrolled");
+
+  assert.notOk(survey._isElementShouldBeSticky(""), "empty selector - always false (with scroll)");
+
+  rootElement.scrollTop = 0;
+  assert.notOk(survey._isElementShouldBeSticky(""), "empty selector - always false (no scroll)");
+});
\ No newline at end of file