From 7ccff92e55fbfa27f022d9f61cbdf7d09d924f69 Mon Sep 17 00:00:00 2001
From: Zhaolin Liang <develop0304@outlook.com>
Date: Wed, 12 Jun 2024 03:39:02 +0800
Subject: [PATCH] fix(VAppBar): inability to scroll to the bottom (#19921)

fixes #19090
---
 .../VAppBar/__tests__/VAppBar.spec.cy.tsx     | 22 +++++++++++++++++++
 packages/vuetify/src/composables/scroll.ts    |  7 ++++++
 2 files changed, 29 insertions(+)

diff --git a/packages/vuetify/src/components/VAppBar/__tests__/VAppBar.spec.cy.tsx b/packages/vuetify/src/components/VAppBar/__tests__/VAppBar.spec.cy.tsx
index 6715d7e53b8..a9efd0b63d7 100644
--- a/packages/vuetify/src/components/VAppBar/__tests__/VAppBar.spec.cy.tsx
+++ b/packages/vuetify/src/components/VAppBar/__tests__/VAppBar.spec.cy.tsx
@@ -84,6 +84,28 @@ describe('VAppBar', () => {
         .get('.v-app-bar').should('not.be.visible')
     })
 
+    it('should hide correctly when scroll to the bottom', () => {
+      cy.mount(({ scrollBehavior }: any) => (
+        <VLayout>
+          <VAppBar scrollBehavior={ scrollBehavior } />
+
+          <VMain style="min-height: 300px">
+            {
+              Array.from({ length: 7 }, () => (
+                <div class="pa-16 ma-2 w-50 bg-green text-center">
+                  box
+                </div>
+              ))
+            }
+          </VMain>
+        </VLayout>
+      ))
+        .setProps({ scrollBehavior: 'hide' })
+        .get('.v-app-bar').should('be.visible')
+        .window().scrollTo('bottom')
+        .get('.v-app-bar').should('not.be.visible')
+    })
+
     it('collapses', () => {
       cy.mount(({ scrollBehavior }: any) => (
         <VLayout>
diff --git a/packages/vuetify/src/composables/scroll.ts b/packages/vuetify/src/composables/scroll.ts
index d131e4a1e33..179a3cbe294 100644
--- a/packages/vuetify/src/composables/scroll.ts
+++ b/packages/vuetify/src/composables/scroll.ts
@@ -44,6 +44,7 @@ export function useScroll (
 ) {
   const { canScroll } = args
   let previousScroll = 0
+  let previousScrollHeight = 0
   const target = ref<Element | Window | null>(null)
   const currentScroll = shallowRef(0)
   const savedScroll = shallowRef(0)
@@ -71,6 +72,12 @@ export function useScroll (
     previousScroll = currentScroll.value
     currentScroll.value = ('window' in targetEl) ? targetEl.pageYOffset : targetEl.scrollTop
 
+    const currentScrollHeight = targetEl instanceof Window ? document.documentElement.scrollHeight : targetEl.scrollHeight
+    if (previousScrollHeight !== currentScrollHeight) {
+      previousScrollHeight = currentScrollHeight
+      return
+    }
+
     isScrollingUp.value = currentScroll.value < previousScroll
     currentThreshold.value = Math.abs(currentScroll.value - scrollThreshold.value)
   }