javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 11:17:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf(animation): remove display: none check (#19086)

Browse Source 
* wrap offsetParent in raf

* Revert "wrap offsetParent in raf"
merge
This reverts commit 9910032964b01d9b58b3b1a199fce52853089257.

* remove display none check, add note to document
This commit is contained in:
Liam DeBeasi
2019-08-13 14:46:40 -04:00
committed by GitHub
parent a2b7d57336
commit 0b1e23f754
2 changed files with 18 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
core/src/utils/animation/animation.ts
View File

@ -923,22 +923,20 @@ export const createAnimation = () => {
}
});
const animationDelay = getDelay() || 0;
const animationDuration = getDuration() || 0;
const visibleElements = elements.filter(element => element.offsetParent !== null);
if (visibleElements.length === 0 || _keyframes.length === 0 || elements.length === 0) {
if (_keyframes.length === 0 || elements.length === 0) {
animationFinish();
} else {
/**
* This is a catchall in the event that a CSS Animation did not finish.
* The Web Animations API has mechanisms in place for preventing this.
* CSS Animations will not fire an `animationend` event
* for elements with `display: none`. The Web Animations API
* accounts for this, but using raw CSS Animations requires
* this workaround.
*/
animationFinish();
} else if (_keyframes.length > 0 && elements.length > 0) {
/**
* This is a catchall in the event that a CSS Animation did not finish.
* The Web Animations API has mechanisms in place for preventing this.
*/
const animationDelay = getDelay() || 0;
const animationDuration = getDuration() || 0;
cssAnimationsTimerFallback = setTimeout(onAnimationEndFallback, animationDelay + animationDuration + ANIMATION_END_FALLBACK_PADDING_MS);
animationEnd(elements[0], () => {