Skip to content

Conversation

TodePond
Copy link
Collaborator

@TodePond TodePond commented Aug 4, 2025

This PR fixes dragging interactions when using multiple tldraw components on the same page. eg: Inset editors with fixed sizes and Common practices with inset editors

The bug happened because we're now handling pointer move events on a document basis, not an editor-by-editor basis. This meant that different tldraw editors were killing the pointer move event, preventing other editors from handling it.
This PR fixes the bug by no longer killing the event. If we do need to kill the event, perhaps we could kill the event on an editor-by-editor basis by tracking this as a map instead of a boolean or something.

Change type

  • bugfix
  • improvement
  • feature
  • api
  • other

Test plan

  1. Try the "Inset editor (fixed sizes)" and "Inset editor (common practices)" examples.
  2. Try drawing in multiple editors. Make sure you can draw in more than just one of them.
  • Unit tests
  • End to end tests

@TodePond TodePond requested a review from steveruizok August 4, 2025 10:59
Copy link

vercel bot commented Aug 4, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
analytics ✅ Ready (Inspect) Visit Preview Aug 4, 2025 10:59am
examples ✅ Ready (Inspect) Visit Preview Aug 4, 2025 10:59am
1 Skipped Deployment
Name Status Preview Updated (UTC)
tldraw-docs ⬜️ Ignored (Inspect) Aug 4, 2025 10:59am

@@ -151,9 +151,6 @@ export function useCanvasEvents() {
let lastX: number, lastY: number

function onPointerMove(e: PointerEvent) {
if ((e as any).isKilled) return
;(e as any).isKilled = true
Copy link
Contributor

@MitjaBezensek MitjaBezensek Aug 13, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this was added in the drag out of toolbar PR. @SomeHats did this prevent some issues with that feature? Can we safely remove it?

https://github.com/tldraw/tldraw/pull/6563/files#diff-980beb0aa0ee9aa6d1cd386cef3dc05a500c030638ffb58d45fd11b79126103fR155

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i'm not sure - i think @steveruizok added this?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To me it looks like the early return was there before, but the killing of the event was added in that PR https://github.com/tldraw/tldraw/pull/6563/files#diff-980beb0aa0ee9aa6d1cd386cef3dc05a500c030638ffb58d45fd11b79126103fL48

Copy link
Collaborator

@steveruizok steveruizok Aug 14, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We do this to avoid loops when events are re-dispatched to the canvas, or when events would bubble through shapes. I don't think we rely on this as much since moving away from DOM based hit testing in 2023.

@steveruizok steveruizok added this pull request to the merge queue Aug 14, 2025
Merged via the queue into main with commit a531b80 Aug 14, 2025
20 of 21 checks passed
@steveruizok steveruizok deleted the lu/fix-multiple-editors branch August 14, 2025 14:04
SomeHats added a commit that referenced this pull request Aug 15, 2025
github-merge-queue bot pushed a commit that referenced this pull request Aug 15, 2025
Reverts #6543

This was causing events to get dispatched multiple times (maybe 3???),
resulting in v janky drawing:

<img width="1731" height="739" alt="image"
src="https://github.com/user-attachments/assets/16e56cb9-f42f-4ec8-b9ee-f3abd971892d"
/>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bugfix Bug fix
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants