[bugfix] Cleanup input state after middle-click-to-pan (#3792)

closes #3013 
closes #3733

This fixes a bug wherein the `inputs.isPanning` state was not being
unset correctly after a middle-click-to-pan gesture with a mouse.

### Change Type

<!--  Please select a 'Scope' label ️ -->

- [x] `sdk` — Changes the tldraw SDK
- [ ] `dotcom` — Changes the tldraw.com web app
- [ ] `docs` — Changes to the documentation, examples, or templates.
- [ ] `vs code` — Changes to the vscode plugin
- [ ] `internal` — Does not affect user-facing stuff

<!--  Please select a 'Type' label ️ -->

- [x] `bugfix` — Bug fix
- [ ] `feature` — New feature
- [ ] `improvement` — Improving existing features
- [ ] `chore` — Updating dependencies, other boring stuff
- [ ] `galaxy brain` — Architectural changes
- [ ] `tests` — Changes to any test code
- [ ] `tools` — Changes to infrastructure, CI, internal scripts,
debugging tools, etc.
- [ ] `dunno` — I don't know


### Test Plan

1. Add a step-by-step description of how to test your PR here.
2.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Add a brief release note for your PR here.
This commit is contained in:
David Sheldrick 2024-05-21 09:45:22 +01:00 committed by GitHub
parent ec128da55b
commit 1452978246
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 33 additions and 0 deletions

View file

@ -8645,6 +8645,9 @@ export class Editor extends EventEmitter<TLEventMap> {
} }
if (inputs.isPanning) { if (inputs.isPanning) {
if (!inputs.keys.has('Space')) {
inputs.isPanning = false
}
const slideDirection = this.inputs.pointerVelocity const slideDirection = this.inputs.pointerVelocity
const slideSpeed = Math.min(2, slideDirection.len()) const slideSpeed = Math.min(2, slideDirection.len())

View file

@ -646,3 +646,33 @@ describe('when the user prefers light UI', () => {
expect(editor.user.getIsDarkMode()).toBe(false) expect(editor.user.getIsDarkMode()).toBe(false)
}) })
}) })
describe('middle-click panning', () => {
it('clears the isPanning state on mouse up', () => {
editor.pointerDown(0, 0, {
// middle mouse button
button: 1,
})
editor.pointerMove(100, 100)
expect(editor.inputs.isPanning).toBe(true)
editor.pointerUp(100, 100)
expect(editor.inputs.isPanning).toBe(false)
})
it('does not clear thee isPanning state if the space bar is down', () => {
editor.pointerDown(0, 0, {
// middle mouse button
button: 1,
})
editor.pointerMove(100, 100)
expect(editor.inputs.isPanning).toBe(true)
editor.keyDown(' ')
editor.pointerUp(100, 100, {
button: 1,
})
expect(editor.inputs.isPanning).toBe(true)
editor.keyUp(' ')
expect(editor.inputs.isPanning).toBe(false)
})
})