https://github.com/zestia/animation-utils
🎞 Basic utils for dealing with animations & transitions
https://github.com/zestia/animation-utils
Last synced: 4 months ago
JSON representation
🎞 Basic utils for dealing with animations & transitions
- Host: GitHub
- URL: https://github.com/zestia/animation-utils
- Owner: zestia
- Created: 2021-09-30T18:57:06.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-05-14T11:26:33.000Z (about 1 year ago)
- Last Synced: 2025-10-30T01:45:03.945Z (8 months ago)
- Language: JavaScript
- Homepage:
- Size: 1.52 MB
- Stars: 0
- Watchers: 12
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# @zestia/animation-utils
Utils for working with animations and transitions.
## Installation
```
npm install --save-dev @zestia/animation-utils
```
Add the following to `~/.npmrc` to pull @zestia scoped packages from Github instead of NPM.
```
@zestia:registry=https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=
```
## waitForAnimation
```javascript
// Wait for animations to start and finish
await waitForAnimation(element);
// Wait for animations to finish, if there are any
await waitForAnimation(element, { maybe: true });
// Wait for animations to start and finish, including descendants
await waitForAnimation(element, { subtree: true });
// Wait for an animation to start and finish by name
await waitForAnimation(element, { animationName: 'fade-out' });
// Wait for a transition to start and finish by name
await waitForAnimation(element, { transitionProperty: 'margin-left' });
// Wait for an animation to start and finish by name, including descendants
await waitForAnimation(element, { subtree: true, animationName: 'move' });
```
## Contributing
- `npx testem` to run the tests in-browser
- `npx testem ci` to run the tests in headless mode