From 943c1deb9bdf33bde775e4129ea891a10bf9d4fd Mon Sep 17 00:00:00 2001 From: Miodec Date: Fri, 5 Dec 2025 19:05:32 +0100 Subject: [PATCH] fix(tape mode): rare issue where previous line would be shifted on line jump --- frontend/src/ts/test/test-ui.ts | 41 ++++++++++++++------------------- 1 file changed, 17 insertions(+), 24 deletions(-) diff --git a/frontend/src/ts/test/test-ui.ts b/frontend/src/ts/test/test-ui.ts index ec867261d..d1c1641ec 100644 --- a/frontend/src/ts/test/test-ui.ts +++ b/frontend/src/ts/test/test-ui.ts @@ -217,7 +217,7 @@ export function updateActiveElement( | { direction: "forward" | "back"; initial?: undefined } | { direction?: undefined; initial: true }, ): void { - requestDebouncedAnimationFrame("test-ui.updateActiveElement", () => { + requestDebouncedAnimationFrame("test-ui.updateActiveElement", async () => { const { direction, initial } = options; let previousActiveWordTop: number | null = null; @@ -251,10 +251,6 @@ export function updateActiveElement( updateWordsInputPosition(); - if (!initial && Config.tapeMode !== "off") { - void scrollTape(); - } - if (previousActiveWordTop === null) return; const isTimedTest = @@ -265,9 +261,13 @@ export function updateActiveElement( if (isTimedTest || !Config.showAllLines) { const newActiveWordTop = newActiveWord.offsetTop; if (newActiveWordTop > previousActiveWordTop) { - void lineJump(previousActiveWordTop); + await lineJump(previousActiveWordTop); } } + + if (!initial && Config.tapeMode !== "off") { + await scrollTape(); + } }); } @@ -942,7 +942,7 @@ export async function updateWordLetters({ if (!Config.showAllLines) { const wordTopAfterUpdate = wordAtIndex.offsetTop; if (wordTopAfterUpdate > activeWordTop) { - void lineJump(activeWordTop, true); + await lineJump(activeWordTop, true); } } } @@ -1210,14 +1210,13 @@ export async function lineJump( currentTop: number, force = false, ): Promise { - const { resolve, promise } = Misc.promiseWithResolvers(); //last word of the line if (currentTestLine > 0 || force) { const hideBound = currentTop; const activeWordEl = getActiveWordElement(); if (!activeWordEl) { - resolve(); + // resolve(); return; } @@ -1244,10 +1243,9 @@ export async function lineJump( } if (lastElementIndexToRemove === undefined) { - resolve(); currentTestLine++; updateWordsWrapperHeight(); - return promise; + return; } currentLinesJumping++; @@ -1265,29 +1263,24 @@ export async function lineJump( if (Config.smoothLineScroll) { lineTransition = true; - animate(wordsEl, { + await Misc.promiseAnimate(wordsEl, { marginTop: newMarginTop, duration, - onComplete: () => { - currentLinesJumping = 0; - activeWordTop = activeWordEl.offsetTop; - activeWordHeight = activeWordEl.offsetHeight; - removeTestElements(lastElementIndexToRemove); - wordsEl.style.marginTop = "0"; - lineTransition = false; - resolve(); - }, }); + currentLinesJumping = 0; + activeWordTop = activeWordEl.offsetTop; + activeWordHeight = activeWordEl.offsetHeight; + removeTestElements(lastElementIndexToRemove); + wordsEl.style.marginTop = "0"; + lineTransition = false; } else { currentLinesJumping = 0; removeTestElements(lastElementIndexToRemove); - resolve(); } } currentTestLine++; updateWordsWrapperHeight(); - - return promise; + return; } export function setRightToLeft(isEnabled: boolean): void {