From 2059e88b9c60482ca099a7bbbd33f823dc026d06 Mon Sep 17 00:00:00 2001
From: Miodec <jack@monkeytype.com>
Date: Tue, 1 Apr 2025 09:49:47 +0200
Subject: [PATCH] fix(tape mode): tape jumping around when words were removed
 off screen

---
 frontend/src/ts/test/test-ui.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/ts/test/test-ui.ts b/frontend/src/ts/test/test-ui.ts
index dbba5b12b..06bd403d6 100644
--- a/frontend/src/ts/test/test-ui.ts
+++ b/frontend/src/ts/test/test-ui.ts
@@ -928,7 +928,7 @@ export function scrollTape(): void {
     return;
   }
 
-  const wordIndex = TestState.activeWordIndex - activeWordElementOffset;
+  let wordIndex = TestState.activeWordIndex - activeWordElementOffset;
   const wordsWrapperWidth = (
     document.querySelector("#wordsWrapper") as HTMLElement
   ).offsetWidth;
@@ -951,6 +951,8 @@ export function scrollTape(): void {
       activeWordElementOffset += toHide.length;
       toHide.forEach((e) => e.remove());
       fullWordsWidth -= widthToHide;
+      //need to redefine wordIndex after removing words
+      wordIndex = TestState.activeWordIndex - activeWordElementOffset;
       const currentMargin = parseInt($("#words").css("margin-left"), 10);
       $("#words").css("margin-left", `${currentMargin + widthToHide}px`);
     }