fix: curved connector's control-point drag now tracks the cursor at any zoom/pan - #560
Open
bvnaik05 wants to merge 1 commit into
Open
fix: curved connector's control-point drag now tracks the cursor at any zoom/pan#560bvnaik05 wants to merge 1 commit into
bvnaik05 wants to merge 1 commit into
Conversation
…ny zoom/pan Dragging the midpoint control handle on a curved connector computed its screen→logical conversion via node.ownerSVGElement.getScreenCTM() — the root canvas <svg>'s own CTM, which excludes the ancestor <g>'s pan/zoom transform entirely (the root svg has no transform of its own; the g does). At the default 100% zoom / no pan this is indistinguishable from correct, but at any other zoom or pan the computed logical point diverges from the cursor's real position, worse the further the cursor sits from the pan/zoom origin — which reads as the handle "spinning off" during a drag. HoverArrows, MindmapHoverHandles, FlowchartHoverHandles, and HoverOutline already get this right: each calls getScreenCTM() on an element that sits *inside* the transformed <g>, which correctly includes it. Apply the same fix to ConnectorView's toLogical() — call getScreenCTM() on the dragged node itself. This also fixes the same latent bug in endpoint re-attach dragging and connector body dragging, which shared the same helper.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
Dragging the midpoint control handle on a curved connector (the dot used to bend the curve) would visibly jump away from the cursor mid-drag, worse the further the drag traveled — described as the dot "randomly spinning off somewhere" instead of tracing the pointer.
Root cause
ConnectorView.vue'stoLogical()converted the screen point to logical (world) coordinates via:ownerSVGElementis the root canvas<svg>, which has no transform of its own — the pan/zoom lives on a descendant<g :transform="groupTransform">that every connector and shape renders inside. CallinggetScreenCTM()on the root therefore returns a CTM that entirely excludes the pan/zoom transform. At the default 100% zoom with no pan this is indistinguishable from correct (identity difference), which is why it read as "no bug found" under static review — it only shows up once the canvas is panned or zoomed, which is exactly how anyone actually uses a connector mid-session.Four sibling files already get this right:
HoverArrows,MindmapHoverHandles,FlowchartHoverHandles, andHoverOutlineall callgetScreenCTM()on an element that sits inside the transformed<g>(their own root, via a template ref), which correctly includes the pan/zoom.ConnectorViewwas the outlier.Fix
Call
getScreenCTM()on the dragged node itself (the handle circle, or the connector's hit-path), not onownerSVGElement. The node already sits inside the transformed<g>, so its own CTM is exactly the coordinate space its owncx/cy(or the connector's endpoint coordinates) are expressed in.This helper is shared by all three connector drag gestures (control-point, endpoint re-attach, and whole-body move), so the fix corrects all three — endpoint dragging and body dragging had the identical latent bug, just less noticeable since endpoints snap to shapes.
Testing
yarn vitest run connector— 11 files / 63 tests pass.🤖 Generated with Claude Code