Fix lines being draggable via their background (#1920)

Fixes #1914 

### Change Type

- [x] `patch` — Bug fix

### Test Plan

1. Draw a line shape at a 45 degree angle.
2. Select the line.
3. Click and drag the empty space next to the line.
4. It should select the canvas.

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

### Release Notes

- None - unreleased bug
This commit is contained in:
Lu Wilson 2023-09-19 13:16:38 +01:00 committed by GitHub
parent 52a838f3ff
commit 5dc1436d80
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 35 additions and 0 deletions

View file

@ -786,6 +786,8 @@ export class LineShapeUtil extends ShapeUtil<TLLineShape> {
// (undocumented) // (undocumented)
hideRotateHandle: () => boolean; hideRotateHandle: () => boolean;
// (undocumented) // (undocumented)
hideSelectionBoundsBg: () => boolean;
// (undocumented)
hideSelectionBoundsFg: () => boolean; hideSelectionBoundsFg: () => boolean;
// (undocumented) // (undocumented)
indicator(shape: TLLineShape): JSX.Element; indicator(shape: TLLineShape): JSX.Element;

View file

@ -41,6 +41,7 @@ export class LineShapeUtil extends ShapeUtil<TLLineShape> {
override hideResizeHandles = () => true override hideResizeHandles = () => true
override hideRotateHandle = () => true override hideRotateHandle = () => true
override hideSelectionBoundsFg = () => true override hideSelectionBoundsFg = () => true
override hideSelectionBoundsBg = () => true
override getDefaultProps(): TLLineShape['props'] { override getDefaultProps(): TLLineShape['props'] {
return { return {

View file

@ -312,6 +312,38 @@ describe('when shape is hollow', () => {
editor.expectToBeIn('select.pointing_canvas') editor.expectToBeIn('select.pointing_canvas')
editor.pointerUp() editor.pointerUp()
}) })
it('does not drag line shape', () => {
editor
.selectAll()
.deleteShapes(editor.selectedShapeIds)
.setCurrentTool('line')
.pointerMove(500, 500)
.pointerDown()
.pointerMove(600, 600)
.pointerUp()
.selectAll()
.setCurrentTool('select')
expect(editor.selectedShapeIds.length).toBe(1)
// Not inside of the shape but inside of the selection bounds
editor.pointerMove(510, 590)
expect(editor.hoveredShapeId).toBe(null)
// Line shapes have `hideSelectionBoundsBg` set to true
editor.pointerDown()
editor.expectToBeIn('select.pointing_canvas')
editor.selectAll()
editor.rotateSelection(Math.PI)
editor.setCurrentTool('select')
editor.pointerMove(590, 510)
editor.pointerDown()
editor.expectToBeIn('select.pointing_canvas')
editor.pointerUp()
})
}) })
describe('when shape is a frame', () => { describe('when shape is a frame', () => {