fix: jumping when aligned at bottom (#69) #211
Merged
Conversation
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
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
So this fix itself is pretty much done. But I think it's hard to tell whether this is a sensible approach as there aren't any tests that confirm the expected behavior of auto-animate in general. This might very well break something that I didn't account for as I only checked whether the docs still animate like before. Unfortunately I don't have experience in testing things like this and cannot provide much help. But if this PR is of use to you, you might aswell try it in your applications @arjunsahai. |
…ze animation waits; upload videos in CI
justin-schroeder
added a commit
that referenced
this pull request
Aug 30, 2025
…t failures - Restored deltaBottom/deltaRight checks to detect anchored elements - Fixed immediate position updates after animations (debounce=false) - Restored proper parent coordinate calculations in deletePosition - Added named export for autoAnimate to fix exports test - Fixed flaky framework animation tests by ensuring elements are visible - Added scrollIntoViewIfNeeded and increased wait times for CI reliability All bottom-jump-fix tests now pass across all browsers
justin-schroeder
added a commit
that referenced
this pull request
Sep 5, 2025
* test(e2e): add Playwright visual tests (video + pixel diffs); stabilize animation waits; upload videos in CI * fix: jumping when aligned at bottom (#69) (#211) * fix: jumping when aligned at bottom (#69) * chore: use const instead of let * test(e2e): add Playwright visual tests (video + pixel diffs); stabilize animation waits; upload videos in CI --------- Co-authored-by: Justin Schroeder <[email protected]> * fix: #69 — nice * Adding bun to installation instructions (#205) * feat: allow useAutoAnimate with Vue component ref (#186) This adds support for using `useAutoAnimate` with a component as the parent. When you add `ref="parent"` to a component, the element is found at `parent.value.$el`. This update checks for component elements or a plain HTML element ref. * feat: adds component support to useAutoAnimate for Vue * Investigate and resolve auto-animate issues (#225) * Improve offscreen handling, Vue integration, and cleanup in AutoAnimate Co-authored-by: justin <[email protected]> * Add e2e tests for various autoAnimate scenarios and behaviors Co-authored-by: justin <[email protected]> * chore: remove playwright report * Angular 17.1+ support (#206) * Angular >v17.1 support * angular example rewrite * Angular docs change * Update package.json * angular pnpm-lock & usage import fix * ' -> " typo fix --------- Co-authored-by: Gergely Dremak <[email protected]> Co-authored-by: Justin Schroeder <[email protected]> * chore: lockfile bump * fix: bottom anchored animations * chore: remove local claude * fix: restore bottom-aligned animation fix from PR #211 and fix CI test failures - Restored deltaBottom/deltaRight checks to detect anchored elements - Fixed immediate position updates after animations (debounce=false) - Restored proper parent coordinate calculations in deletePosition - Added named export for autoAnimate to fix exports test - Fixed flaky framework animation tests by ensuring elements are visible - Added scrollIntoViewIfNeeded and increased wait times for CI reliability All bottom-jump-fix tests now pass across all browsers * fix: add build step to CI and make tests more robust for slow environments - Added 'pnpm build' step to GitHub Actions workflow before running tests - Fixed exports test by ensuring dist files are built in CI - Made framework animation tests more robust with polling approach - Added browser-specific timeouts for WebKit compatibility - Increased wait times and retry attempts for slow CI environments * fix: no nuxt build on ci * chore: gh caching --------- Co-authored-by: Maik Kowol <[email protected]> Co-authored-by: Abi <[email protected]> Co-authored-by: Marshall Thompson <[email protected]> Co-authored-by: Gergely Dremák <[email protected]> Co-authored-by: Gergely Dremak <[email protected]>
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.
This fixes #69, by only applying the
deltaX/Ywhen the element seems to have moved either viadeltaTopordeltaBottometc.FixedAAJump.mp4
I also added a debounce skip to
updatePos, for when the animations finish, as it delayed having accurateoldPos.This caused elements to be offset when triggering auto-animate shortly after the animations ended.
AASlowUpdatePos.mp4
Ultimately this makes it possible to use auto-animate for building trays/bottom-sheets like this
DynamicBottomSheetWithAutoanimate.mp4