fix(scroll): snap to click-time scrollTop before smooth scroll
Capture mainApp.scrollTop synchronously when addStackedNote runs and snap the scroll back to that value before scrollIntoView fires, so the smooth scroll begins from where the user actually tapped rather than from a position drifted by momentum or async work.
This commit is contained in:
@@ -41,13 +41,21 @@ export const useOverlay = (listen = true) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const scrollToElement = (element: HTMLElement) => {
|
const scrollToElement = (element: HTMLElement) => {
|
||||||
requestAnimationFrame(() => {
|
|
||||||
const mainApp = document.getElementById("main-app")
|
const mainApp = document.getElementById("main-app")
|
||||||
|
const clickTop = (window as unknown as { __scrollAtClick?: number })
|
||||||
|
.__scrollAtClick
|
||||||
|
|
||||||
|
if (mainApp && clickTop !== undefined) {
|
||||||
|
mainApp.scrollTop = clickTop
|
||||||
|
}
|
||||||
|
|
||||||
|
requestAnimationFrame(() => {
|
||||||
const debug = document.getElementById("scroll-debug")
|
const debug = document.getElementById("scroll-debug")
|
||||||
if (debug && mainApp) {
|
if (debug && mainApp) {
|
||||||
const er = element.getBoundingClientRect()
|
const er = element.getBoundingClientRect()
|
||||||
const cr = mainApp.getBoundingClientRect()
|
const cr = mainApp.getBoundingClientRect()
|
||||||
const lines = [
|
const lines = [
|
||||||
|
`clickTop: ${clickTop ?? "n/a"}`,
|
||||||
`before scrollTop: ${mainApp.scrollTop}`,
|
`before scrollTop: ${mainApp.scrollTop}`,
|
||||||
`mainApp scrollH: ${mainApp.scrollHeight} clientH: ${mainApp.clientHeight}`,
|
`mainApp scrollH: ${mainApp.scrollHeight} clientH: ${mainApp.clientHeight}`,
|
||||||
`body scrollY: ${window.scrollY} innerH: ${window.innerHeight}`,
|
`body scrollY: ${window.scrollY} innerH: ${window.innerHeight}`,
|
||||||
|
|||||||
@@ -114,6 +114,10 @@ export const useRouteQueryStackedNotes = () => {
|
|||||||
selector?: string,
|
selector?: string,
|
||||||
hash?: string
|
hash?: string
|
||||||
) => {
|
) => {
|
||||||
|
const mainAppEl = document.getElementById("main-app")
|
||||||
|
;(window as unknown as { __scrollAtClick?: number }).__scrollAtClick =
|
||||||
|
mainAppEl?.scrollTop ?? 0
|
||||||
|
|
||||||
if (stackedNotes.value.includes(sha)) {
|
if (stackedNotes.value.includes(sha)) {
|
||||||
scrollToFocusedNote({
|
scrollToFocusedNote({
|
||||||
noteId: selector ?? sha,
|
noteId: selector ?? sha,
|
||||||
|
|||||||
Reference in New Issue
Block a user