diff --git a/src/css/index.ts b/src/css/index.ts index 272c6acce..b338871ec 100644 --- a/src/css/index.ts +++ b/src/css/index.ts @@ -143,7 +143,6 @@ export class CSSParsedDeclaration { textTransform: ReturnType; transform: ReturnType; transformOrigin: ReturnType; - transitionDuration: ReturnType; visibility: ReturnType; webkitTextStrokeColor: Color; webkitTextStrokeWidth: ReturnType; @@ -221,7 +220,6 @@ export class CSSParsedDeclaration { this.textTransform = parse(context, textTransform, declaration.textTransform); this.transform = parse(context, transform, declaration.transform); this.transformOrigin = parse(context, transformOrigin, declaration.transformOrigin); - this.transitionDuration = parse(context, duration, declaration.transitionDuration); this.visibility = parse(context, visibility, declaration.visibility); this.webkitTextStrokeColor = parse(context, webkitTextStrokeColor, declaration.webkitTextStrokeColor); this.webkitTextStrokeWidth = parse(context, webkitTextStrokeWidth, declaration.webkitTextStrokeWidth); diff --git a/src/dom/document-cloner.ts b/src/dom/document-cloner.ts index e6c25884c..07dedb2b0 100644 --- a/src/dom/document-cloner.ts +++ b/src/dom/document-cloner.ts @@ -233,6 +233,7 @@ export class DocumentCloner { if (window && isElementNode(node) && (isHTMLElementNode(node) || isSVGElementNode(node))) { const clone = this.createElementClone(node); + clone.style.transitionProperty = 'none'; const style = window.getComputedStyle(node); const styleBefore = window.getComputedStyle(node, ':before'); diff --git a/src/dom/element-container.ts b/src/dom/element-container.ts index 01f50183b..151e0cd8f 100644 --- a/src/dom/element-container.ts +++ b/src/dom/element-container.ts @@ -23,15 +23,13 @@ export class ElementContainer { if (isDebugging(element, DebuggerType.PARSE)) { debugger; } + this.styles = new CSSParsedDeclaration(context, window.getComputedStyle(element, null)); if (isHTMLElementNode(element)) { if (this.styles.animationDuration.some((duration) => duration > 0)) { element.style.animationDuration = '0s'; } - if (this.styles.transitionDuration.some((duration) => duration > 0)) { - element.style.transitionDuration = '0s'; - } if (this.styles.transform !== null) { // getBoundingClientRect takes transforms into account diff --git a/tests/reftests/animation.html b/tests/reftests/animation.html index 552abc432..f7e9693c5 100644 --- a/tests/reftests/animation.html +++ b/tests/reftests/animation.html @@ -55,6 +55,11 @@ transform: rotate(45deg) } + .transition-delay { + transition: 1ms; + transition-delay: 50ms; + transform: rotate(45deg) + } div { float: left; @@ -84,5 +89,9 @@

Hello

+ +
+

Hello

+