Skip to content

fix(explorer): the drag label hangs off the cursor's bottom right (#310) - #311

Merged
Maxaubert merged 2 commits into
mainfrom
fix/310-drag-label
Oct 7, 2026
Merged

Maxaubert merged 2 commits into
mainfrom
fix/310-drag-label

Conversation

@Maxaubert

Copy link
Copy Markdown
Owner

Closes #310.

Owner, 2026-10-07: "when you pick up an item with left click drag the label is to its bottom left but also not attached to the cursor, its off by maybe like 10 to 20 px. it should be attached and it should be from the bottom right".

Cause

The drag label is not a native drag image. lib/internalFileDrag.ts cancels Chromium's drag at dragstart (its native loop swallows Ctrl+Tab) and carries an in-page position: fixed element that follows mousemove. Its placement was written as "below and left of the hand":

  • left = x - width - 4: the label's whole width sat LEFT of the pointer, so its right edge was 4 px left of the tip.
  • top = y + 12: 12 px below the tip, which with the 4 px on the side read as a label floating 10 to 20 px away.

Everything is in CSS px from the pointer's client coordinates, so display scale was never part of it (measured identical at 150% and 225%).

Fix

lib/dragBadgePlace.ts (pure, unit-tested): the label's top-left corner sits 8 px right of and 8 px below the pointer tip, File Explorer's way, so the pointer never covers the name. Only where the window edge leaves no room does it flip to the other side of the pointer, never sliding under it. The hook calls it on every move. One rule for every drag the hook carries: tree, Explorer list, one or several items, files and folders, places panel pins.

Also: patch bump 0.92.1 to 0.92.2, CLAUDE.md rule quoting the owner.

Measured

New e2e dragLabel: a real press and travel, label box read mid-drag against the pointer at two positions, under --force-device-scale-factor 1, 1.5 and 2.25.

  • On main: 15 failures, offsets like (-76, 12) at every scale.
  • After: offset (8, 8) at dpr 1, 1.5 and 2.25, for a tree file, tree folder, list file, list folder, 2 marked items ("2 items") and a places pin; it stays the same as the pointer travels and the label goes when the drag ends. Screenshots .e2e/shots/drag-label-*.png looked at.

Gates

  • npm run typecheck: clean
  • npm run lint: 0 errors (7 existing warnings, none in changed files)
  • npx vitest run: 171 files passed, 2532 tests passed (2 skipped)
  • e2e, serial: dragLabel, drag, sidebarPlaces, zipWrites, sidebarPeek all ok (228 checks)
  • npm run e2e:terminal: all 18 scenarios ok (553 checks)

🤖 Generated with Claude Code

https://claude.ai/code/session_01FHHaWKR4M5QtW7Wecyuk4t

Maxaubert and others added 2 commits October 7, 2026 04:00
@Maxaubert
Maxaubert merged commit cc3e85a into main Oct 7, 2026
3 checks passed
@Maxaubert
Maxaubert deleted the fix/310-drag-label branch October 7, 2026 15:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Drag label sits below left of the cursor, 10 to 20 px away; it should hang off the cursor's bottom right

1 participant