Merge pull request #2910 from Harald-1/animation-with-delay

follow-up fix to #2871

src/compiler/compile/render-dom/wrappers/Element/index.ts

@@ -763,6 +763,7 @@ export default class ElementWrapper extends Wrapper {
 		if (!this.node.animation) return;
 
 		const { component } = this.renderer;
+		const { outro } = this.node;
 
 		const rect = block.get_unique_name('rect');
 		const stop_animation = block.get_unique_name('stop_animation');
@@ -777,6 +778,7 @@ export default class ElementWrapper extends Wrapper {
 		block.builders.fix.add_block(deindent`
 			@fix_position(${this.var});
 			${stop_animation}();
+			${outro && `@add_transform(${this.var}, ${rect});`}
 		`);
 
 		const params = this.node.animation.expression ? this.node.animation.expression.render(block) : '{}';

src/runtime/internal/animations.ts

@@ -86,6 +86,11 @@ export function fix_position(node: Element & ElementCSSInlineStyle) {
 		node.style.position = 'absolute';
 		node.style.width = width;
 		node.style.height = height;
+		add_transform(node, a);
+	}
+}
+
+export function add_transform(node: Element & ElementCSSInlineStyle, a: PositionRect) {
 	const b = node.getBoundingClientRect();
 
 	if (a.left !== b.left || a.top !== b.top) {
@@ -94,5 +99,4 @@ export function fix_position(node: Element & ElementCSSInlineStyle) {
 
 		node.style.transform = `${transform} translate(${a.left - b.left}px, ${a.top - b.top}px)`;
 	}
-	}
 }