Skip to content
Permalink
Browse files

fix(animation): properly clean up elements (#19210)

* fix destroy method

* wrap dom writes in raf

* Add comments
  • Loading branch information...
liamdebeasi committed Aug 28, 2019
1 parent da5d3f0 commit 93f206492775ad5ebd33dc092167a375edd6392e
Showing with 22 additions and 13 deletions.
  1. +22 −13 core/src/utils/animation/animation.ts
@@ -60,6 +60,10 @@ export const createAnimation = () => {
* Destroy the animation and all child animations.
*/
const destroy = () => {
childAnimations.forEach(childAnimation => {
childAnimation.destroy();
});

cleanUp();

elements.length = 0;
@@ -71,10 +75,6 @@ export const createAnimation = () => {
initialized = false;
shouldCalculateNumAnimations = true;

childAnimations.forEach(childAnimation => {
childAnimation.destroy();
});

return ani;
};

@@ -124,14 +124,16 @@ export const createAnimation = () => {
webAnimations.length = 0;
} else {
elements.forEach(element => {
removeStyleProperty(element, 'animation-name');
removeStyleProperty(element, 'animation-duration');
removeStyleProperty(element, 'animation-timing-function');
removeStyleProperty(element, 'animation-iteration-count');
removeStyleProperty(element, 'animation-delay');
removeStyleProperty(element, 'animation-play-state');
removeStyleProperty(element, 'animation-fill-mode');
removeStyleProperty(element, 'animation-direction');
requestAnimationFrame(() => {
removeStyleProperty(element, 'animation-name');
removeStyleProperty(element, 'animation-duration');
removeStyleProperty(element, 'animation-timing-function');
removeStyleProperty(element, 'animation-iteration-count');
removeStyleProperty(element, 'animation-delay');
removeStyleProperty(element, 'animation-play-state');
removeStyleProperty(element, 'animation-fill-mode');
removeStyleProperty(element, 'animation-direction');
});
});
}
};
@@ -142,7 +144,14 @@ export const createAnimation = () => {
*/
const cleanUpStyleSheets = () => {
stylesheets.forEach(stylesheet => {
stylesheet.parentNode!.removeChild(stylesheet);
/**
* When sharing stylesheets, it's possible
* for another animation to have already
* cleaned up a particular stylesheet
*/
if (stylesheet && stylesheet.parentNode) {
stylesheet.parentNode.removeChild(stylesheet);
}
});

stylesheets.length = 0;

0 comments on commit 93f2064

Please sign in to comment.
You can’t perform that action at this time.