scroll acceleration ghostty fix

Author: remorses

packages/core/src/lib/scroll-acceleration.ts

@@ -36,6 +36,10 @@ export class MacOSScrollAccel implements ScrollAcceleration {
   private velocityHistory: number[] = []
   private readonly historySize = 3
   private readonly streakTimeout = 150
+  // some terminals send 2 or more ticks for each mouse wheel ticks, for example Ghostty, with a small delay between each, 3ms on averate.
+  // We ignore these ticks otherwise they would cause faster acceleration to kick in
+  // https://github.com/ghostty-org/ghostty/discussions/7577
+  private readonly minTickInterval = 6
 
   constructor(
     private opts: {
@@ -51,32 +55,30 @@ export class MacOSScrollAccel implements ScrollAcceleration {
     const maxMultiplier = this.opts.maxMultiplier ?? 6
 
     const dt = this.lastTickTime ? now - this.lastTickTime : Infinity
-    this.lastTickTime = now
 
-    // Reset streak if too much time has passed
-    if (dt > this.streakTimeout) {
+    // Reset streak if too much time has passed or first tick
+    if (dt === Infinity || dt > this.streakTimeout) {
+      this.lastTickTime = now
       this.velocityHistory = []
       return 1
     }
 
-    // Track recent intervals
-    if (dt !== Infinity) {
-      this.velocityHistory.push(dt)
-      if (this.velocityHistory.length > this.historySize) {
-        this.velocityHistory.shift()
-      }
+    // Ignore ticks closer than minTickInterval (they're part of the same logical tick)
+    if (dt < this.minTickInterval) {
+      return 1
     }
 
-    // Calculate average interval (lower = faster scrolling)
-    const avgInterval =
-      this.velocityHistory.length > 0
-        ? this.velocityHistory.reduce((a, b) => a + b, 0) / this.velocityHistory.length
-        : Infinity
+    this.lastTickTime = now
 
-    if (avgInterval === Infinity) {
-      return 1
+
+    this.velocityHistory.push(dt)
+    if (this.velocityHistory.length > this.historySize) {
+      this.velocityHistory.shift()
     }
 
+    // Calculate average interval (lower = faster scrolling)
+    const avgInterval = this.velocityHistory.reduce((a, b) => a + b, 0) / this.velocityHistory.length
+
     // Convert interval to velocity: faster ticks = higher velocity
     // Normalize to a reference interval (e.g., 100ms = velocity of 1)
     const referenceInterval = 100

packages/core/src/renderables/ScrollBox.ts

@@ -204,9 +204,8 @@ export class ScrollBoxRenderable extends BoxRenderable {
       this.scrollAccel = scrollAcceleration
     } else if (process.platform === "darwin") {
       this.scrollAccel = new MacOSScrollAccel()
-    } else {
-      this.scrollAccel = new LinearScrollAccel()
     }
+    this.scrollAccel ??= new LinearScrollAccel()
 
     this.wrapper = new BoxRenderable(ctx, {
       flexDirection: "column",

packages/core/src/tests/scrollbox.test.ts

@@ -3,7 +3,7 @@ import { createTestRenderer, type TestRenderer, type MockMouse } from "../testin
 import { ScrollBoxRenderable } from "../renderables/ScrollBox"
 import { BoxRenderable } from "../renderables/Box"
 import { TextRenderable } from "../renderables/Text"
-import { MacOSScrollAccel } from "../lib/scroll-acceleration"
+import { LinearScrollAccel, MacOSScrollAccel } from "../lib/scroll-acceleration"
 
 let testRenderer: TestRenderer
 let mockMouse: MockMouse
@@ -108,6 +108,40 @@ describe("ScrollBoxRenderable - Mouse interaction", () => {
     expect(scrollBox.scrollTop).toBeGreaterThan(0)
   })
 
+  test("single isolated scroll has same distance as linear", async () => {
+    const linearBox = new ScrollBoxRenderable(testRenderer, {
+      width: 50,
+      height: 20,
+      scrollAcceleration: new LinearScrollAccel(),
+    })
+
+    for (let i = 0; i < 100; i++) linearBox.add(new TextRenderable(testRenderer, { text: `Line ${i}` }))
+    testRenderer.root.add(linearBox)
+    await renderOnce()
+
+    await mockMouse.scroll(25, 10, "down")
+    await renderOnce()
+    const linearDistance = linearBox.scrollTop
+
+    testRenderer.destroy()
+    ;({ renderer: testRenderer, mockMouse, renderOnce } = await createTestRenderer({ width: 80, height: 24 }))
+
+    const accelBox = new ScrollBoxRenderable(testRenderer, {
+      width: 50,
+      height: 20,
+      scrollAcceleration: new MacOSScrollAccel(),
+    })
+
+    for (let i = 0; i < 100; i++) accelBox.add(new TextRenderable(testRenderer, { text: `Line ${i}` }))
+    testRenderer.root.add(accelBox)
+    await renderOnce()
+
+    await mockMouse.scroll(25, 10, "down")
+    await renderOnce()
+
+    expect(accelBox.scrollTop).toBe(linearDistance)
+  })
+
   test("acceleration makes rapid scrolls cover more distance", async () => {
     const scrollBox = new ScrollBoxRenderable(testRenderer, {
       width: 50,