Always honor scroll intent on mousewheel

This commit introduces a change in the way we respond to mousewheel
events. In particular, if `delta * scrollSensitivity` is less than 1 or
greater than -1, we will round it up or down in an attempt to honor the
user's scroll intent.
This commit is contained in:
Antonio Scandurra
2017-08-29 13:39:11 +02:00
parent 90f872ae1c
commit 76e2e03139
2 changed files with 40 additions and 3 deletions

View File

@@ -1209,7 +1209,6 @@ describe('TextEditorComponent', () => {
}
{
global.debug = true
const expectedScrollTop = component.getScrollTop()
const expectedScrollLeft = 20 * (scrollSensitivity / 100)
component.didMouseWheel({deltaX: 20, deltaY: -10})
@@ -1228,6 +1227,40 @@ describe('TextEditorComponent', () => {
}
})
it('always scrolls by a minimum of 1, even when the delta is small or the scroll sensitivity is low', () => {
const scrollSensitivity = 10
const {component, editor} = buildComponent({height: 50, width: 50, scrollSensitivity})
{
component.didMouseWheel({deltaX: 0, deltaY: 3})
expect(component.getScrollTop()).toBe(1)
expect(component.getScrollLeft()).toBe(0)
expect(component.refs.content.style.transform).toBe(`translate(0px, -1px)`)
}
{
component.didMouseWheel({deltaX: 4, deltaY: 0})
expect(component.getScrollTop()).toBe(1)
expect(component.getScrollLeft()).toBe(1)
expect(component.refs.content.style.transform).toBe(`translate(-1px, -1px)`)
}
editor.update({scrollSensitivity: 100})
{
component.didMouseWheel({deltaX: 0, deltaY: -0.3})
expect(component.getScrollTop()).toBe(0)
expect(component.getScrollLeft()).toBe(1)
expect(component.refs.content.style.transform).toBe(`translate(-1px, 0px)`)
}
{
component.didMouseWheel({deltaX: -0.1, deltaY: 0})
expect(component.getScrollTop()).toBe(0)
expect(component.getScrollLeft()).toBe(0)
expect(component.refs.content.style.transform).toBe(`translate(0px, 0px)`)
}
})
it('inverts deltaX and deltaY when holding shift on Windows and Linux', async () => {
const scrollSensitivity = 50
const {component, editor} = buildComponent({height: 50, width: 50, scrollSensitivity})

View File

@@ -1511,11 +1511,15 @@ class TextEditorComponent {
let {deltaX, deltaY} = event
if (Math.abs(deltaX) > Math.abs(deltaY)) {
deltaX = deltaX * scrollSensitivity
deltaX = (Math.sign(deltaX) === 1)
? Math.max(1, deltaX * scrollSensitivity)
: Math.min(-1, deltaX * scrollSensitivity)
deltaY = 0
} else {
deltaX = 0
deltaY = deltaY * scrollSensitivity
deltaY = (Math.sign(deltaY) === 1)
? Math.max(1, deltaY * scrollSensitivity)
: Math.min(-1, deltaY * scrollSensitivity)
}
if (this.getPlatform() !== 'darwin' && event.shiftKey) {