PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

[fix] line tool bug with tool locked (#1841)

Browse source 
This PR fixes a bug where tool lock would cause the line tool to not
work properly.

### Change Type

- [x] `patch` — Bug fix

### Test Plan

1. Turn on tool lock.
2. Draw two line shapes

- [x] Unit Tests
This commit is contained in:
Steve Ruiz 2023-09-05 09:33:56 +01:00 committed by GitHub
parent 249bacf50b
commit e7ad05fbf5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 59 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
packages/tldraw/src/lib/shapes/line/LineShapeTool.test.ts
View file

@ -209,3 +209,20 @@ describe('When extending the line with the shift-key in tool-lock mode', () => {
expect(handles.length).toBe(3) expect(handles.length).toBe(3)
}) })
}) })
describe('tool lock bug', () => {
it('works as expected when tool lock is on but shift is off', () => {
expect(editor.currentPageShapes.length).toBe(0)
editor
.updateInstanceState({ isToolLocked: true })
.setCurrentTool('line')
.pointerDown(0, 0)
.pointerMove(10, 10)
.pointerUp(10, 10)
.pointerDown(100, 100)
.pointerMove(110, 110)
.pointerUp(100, 100)
.pointerUp(120, 110)
expect(editor.currentPageShapes.length).toBe(2)
})
})

86
packages/tldraw/src/lib/shapes/line/toolStates/Pointing.ts
View file

@ -29,60 +29,58 @@ export class Pointing extends StateNode {
const shape = info.shapeId && this.editor.getShape<TLLineShape>(info.shapeId) const shape = info.shapeId && this.editor.getShape<TLLineShape>(info.shapeId)
if (shape) { if (shape && inputs.shiftKey) {
this.markId = `creating:${shape.id}` this.markId = `creating:${shape.id}`
this.editor.mark(this.markId) this.editor.mark(this.markId)
this.shape = shape this.shape = shape
if (inputs.shiftKey) { const handles = this.editor.getShapeHandles(this.shape)
const handles = this.editor.getShapeHandles(this.shape) if (!handles) return
if (!handles) return
const vertexHandles = handles.filter((h) => h.type === 'vertex').sort(sortByIndex) const vertexHandles = handles.filter((h) => h.type === 'vertex').sort(sortByIndex)
const endHandle = vertexHandles[vertexHandles.length - 1] const endHandle = vertexHandles[vertexHandles.length - 1]
const shapePagePoint = Matrix2d.applyToPoint( const shapePagePoint = Matrix2d.applyToPoint(
this.editor.getShapeParentTransform(this.shape)!, this.editor.getShapeParentTransform(this.shape)!,
new Vec2d(this.shape.x, this.shape.y) new Vec2d(this.shape.x, this.shape.y)
) )
let nextEndHandleIndex: string, nextEndHandleId: string, nextEndHandle: TLHandle let nextEndHandleIndex: string, nextEndHandleId: string, nextEndHandle: TLHandle
if (vertexHandles.length === 2 && vertexHandles[1].x === 1 && vertexHandles[1].y === 1) { if (vertexHandles.length === 2 && vertexHandles[1].x === 1 && vertexHandles[1].y === 1) {
nextEndHandleIndex = vertexHandles[1].index nextEndHandleIndex = vertexHandles[1].index
nextEndHandleId = vertexHandles[1].id nextEndHandleId = vertexHandles[1].id
nextEndHandle = { nextEndHandle = {
...vertexHandles[1], ...vertexHandles[1],
x: currentPagePoint.x - shapePagePoint.x, x: currentPagePoint.x - shapePagePoint.x,
y: currentPagePoint.y - shapePagePoint.y, y: currentPagePoint.y - shapePagePoint.y,
} }
} else { } else {
nextEndHandleIndex = getIndexAbove(endHandle.index) nextEndHandleIndex = getIndexAbove(endHandle.index)
nextEndHandleId = 'handle:' + nextEndHandleIndex nextEndHandleId = 'handle:' + nextEndHandleIndex
nextEndHandle = { nextEndHandle = {
x: currentPagePoint.x - shapePagePoint.x, x: currentPagePoint.x - shapePagePoint.x,
y: currentPagePoint.y - shapePagePoint.y, y: currentPagePoint.y - shapePagePoint.y,
index: nextEndHandleIndex, index: nextEndHandleIndex,
canBind: false, canBind: false,
type: 'vertex', type: 'vertex',
id: nextEndHandleId, id: nextEndHandleId,
}
} }
const nextHandles = structuredClone(this.shape.props.handles)
nextHandles[nextEndHandle.id] = nextEndHandle
this.editor.updateShapes([
{
id: this.shape.id,
type: this.shape.type,
props: {
handles: nextHandles,
},
},
])
} }
const nextHandles = structuredClone(this.shape.props.handles)
nextHandles[nextEndHandle.id] = nextEndHandle
this.editor.updateShapes([
{
id: this.shape.id,
type: this.shape.type,
props: {
handles: nextHandles,
},
},
])
} else { } else {
const id = createShapeId() const id = createShapeId()