Skip to content

fix(snap): use horizontal coordinate for start alignment - #565

Open
hakarrr wants to merge 2 commits into
darkroomengineering:mainfrom
hakarrr:fix/snap-horizontal-start
Open

hakarrr wants to merge 2 commits into
darkroomengineering:mainfrom
hakarrr:fix/snap-horizontal-start

Conversation

@hakarrr

@hakarrr hakarrr commented Oct 27, 2026

Copy link
Copy Markdown

What & why

computeSnaps() uses rect.top for align: 'start' regardless of the Lenis orientation. A horizontal instance therefore scrolls to the element's vertical position instead of its horizontal position. Center and end alignment already use the appropriate axis.

Use rect.left for horizontal start alignment, keeping vertical start unchanged. No API or default changes.

This was found while testing the existing horizontal snap behavior, so there is no separate issue.

How to verify

bun install --frozen-lockfile
bun test packages/snap/tests/align.test.js
bun run build
bunx biome check packages/snap/src/snap.ts packages/snap/tests/align.test.js

The regression exercises Snap.addElement() and goTo() for start, center, and end on both axes. Before the source change: 5 pass, 1 fail (horizontal start requests 20 instead of 640). After: 6 pass.

Also verified the built browser bundles in Chromium with a real horizontal Lenis instance and an element positioned at left: 1400px; top: 180px:

const lenis = new Lenis({ orientation: 'horizontal' })
const snap = new Snap(lenis, { duration: 0 })
snap.addElement(document.querySelector('#target'), { align: 'start' })
snap.goTo(0)
lenis.raf(100)
lenis.raf(1100)
lenis.raf(2100)

With a 3200px-wide page and 1000px viewport, the unmodified bundle scrolls to x=180, leaving the target at viewport x=1220. The fixed bundle scrolls to x=1400, placing the target at viewport x=0.

bun run build, the focused tests, and the focused Biome check pass. Standalone tsc --noEmit reports the same existing workspace module-resolution errors on both the base and this change (including lenis, lenis/vue, and Nuxt #imports); no standalone all-green typecheck claim.

Checklist

  • PR is focused on a single logical change
  • Linked the related issue (or explained why there isn't one)
  • Lint/format/tests pass locally (focused commands above)
  • Updated docs/types where relevant (not needed for this coordinate fix)

hakarrr and others added 2 commits October 27, 2026 12:46
Co-authored-by: generaltony007 <144252170+GeneralTony007@users.noreply.github.com>
Co-authored-by: generaltony007 <144252170+GeneralTony007@users.noreply.github.com>
@hakarrr
hakarrr requested a review from a team as a code owner October 27, 2026 07:18
@hakarrr
hakarrr requested review from GFier and clementroche October 27, 2026 07:18
@vercel

vercel Bot commented Oct 27, 2026

Copy link
Copy Markdown

@hakarrr is attempting to deploy a commit to the Darkroom Team on Vercel.

A member of the Team first needs to authorize it.

@hakarrr

hakarrr commented Nov 1, 2026

Copy link
Copy Markdown
Author

Could you review this horizontal snap alignment fix and the separate observer-cleanup fix in #566? Is there anything you need changed in the implementation or regression coverage before they can move forward? I can address specific feedback on each PR. Thanks.

This branch has not been deployed

No deployments
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.

1 participant