Skip to content

Account for screen density for mouse wheel scrolling on web (#2724) #2725

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Kpotko merged 1 commit into from
Jan 29, 2026
+12 −11
Merged

Account for screen density for mouse wheel scrolling on web (#2724) #2725

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion ...on/foundation/src/webMain/kotlin/androidx/compose/foundation/gestures/JsScrollable.web.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import androidx.compose.ui.input.pointer.PointerEvent
import androidx.compose.ui.node.CompositionLocalConsumerModifierNode
import androidx.compose.ui.unit.Density
import androidx.compose.ui.unit.IntSize
import androidx.compose.ui.unit.dp
import androidx.compose.ui.util.fastFold

internal actual fun CompositionLocalConsumerModifierNode.platformScrollConfig(): ScrollConfig = JsConfig
Expand All @@ -35,7 +36,7 @@ private object JsConfig : ScrollConfig {
// 2. Provides satisfactory UI behavior
// In future iterations, this value could be refined to enhance UI behavior.
// However, keep in mind that any modifications would also necessitate adjustments to the corresponding tests.
return event.totalScrollDelta * -1f
return event.totalScrollDelta * -1.dp.toPx()
}
}

Expand Down
2 changes: 1 addition & 1 deletion compose/ui/ui/src/webTest/kotlin/androidx/compose/ui/input/ScrollTests.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ class ScrollTests : OnCanvasTests {
}
}

dispatchEvents(createWheelEvent(clientX = 100, clientY = 100, deltaX = 0.0, deltaY = 200.0))
dispatchEvents(createWheelEvent(clientX = 50, clientY = 50, deltaX = 0.0, deltaY = 100.0))

awaitIdle()

Expand Down
18 changes: 9 additions & 9 deletions compose/ui/ui/src/webTest/kotlin/androidx/compose/ui/window/WheelEventTests.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,11 +53,11 @@ class WheelEventTests : OnCanvasTests {
assertEquals(0, verticalScrollState.value)

// do horizontal scroll, and check that scroll state didn't change
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 10.0)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 5.0)))
assertEquals(0, verticalScrollState.value, "vertical scroll was not expected to change")

// vertical scroll
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0)))
assertEquals(10, verticalScrollState.value, "vertical scroll was expected to change")
}

Expand All @@ -78,11 +78,11 @@ class WheelEventTests : OnCanvasTests {
assertEquals(0, horizontalScrollState.value)

// do vertical scroll, and check that scroll state didn't change
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0)))
assertEquals(0, horizontalScrollState.value, "horizontal scroll was not expected to change")

// horizontal scroll
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 10.0)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 5.0)))
assertEquals(10, horizontalScrollState.value, "horizontal scroll was expected to change")
}

Expand All @@ -104,11 +104,11 @@ class WheelEventTests : OnCanvasTests {
assertEquals(0, horizontalScrollState.value)

// do vertical scroll w/o Shift, and check that scroll state didn't change
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0)))
assertEquals(0, horizontalScrollState.value, "horizontal scroll was not expected to change")

// do vertical scroll with Shift
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0, shiftKey = true)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0, shiftKey = true)))
assertEquals(10, horizontalScrollState.value, "horizontal scroll was expected to change")
}

Expand All @@ -129,15 +129,15 @@ class WheelEventTests : OnCanvasTests {
assertEquals(0, verticalScrollState.value)

// press shift and do horizontal scroll (X-axis)
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 10.0, shiftKey = true)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaX = 5.0, shiftKey = true)))
assertEquals(0, verticalScrollState.value, "horizontal scroll was not expected to change")

// press shift and do vertical scroll (Y-axis) - verticalScrollState won't change because Shift is pressed
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0, shiftKey = true)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0, shiftKey = true)))
assertEquals(0, verticalScrollState.value, "horizontal scroll was not expected to change")

// no Shift, do vertical scroll (Y-axis)
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 10.0, shiftKey = false)))
getCanvas().dispatchEvent(WheelEvent("wheel", WheelEventInit(deltaY = 5.0, shiftKey = false)))
assertEquals(10, verticalScrollState.value, "horizontal scroll expected to change")
}
}