fix(animations): ensure web-animations understands a numeric CSS pers…

…pective value Closes #14007
angular · Jun 3, 2017 · 819514a · 819514a
1 parent b55adee
commit 819514a
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/packages/animations/browser/src/dsl/style_normalization/web_animations_style_normalizer.ts b/packages/animations/browser/src/dsl/style_normalization/web_animations_style_normalizer.ts
@@ -35,7 +35,7 @@ export class WebAnimationsStyleNormalizer extends AnimationStyleNormalizer {
 }
 
 const DIMENSIONAL_PROP_MAP = makeBooleanMap(
-    'width,height,minWidth,minHeight,maxWidth,maxHeight,left,top,bottom,right,fontSize,outlineWidth,outlineOffset,paddingTop,paddingLeft,paddingBottom,paddingRight,marginTop,marginLeft,marginBottom,marginRight,borderRadius,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,textIndent'
+    'width,height,minWidth,minHeight,maxWidth,maxHeight,left,top,bottom,right,fontSize,outlineWidth,outlineOffset,paddingTop,paddingLeft,paddingBottom,paddingRight,marginTop,marginLeft,marginBottom,marginRight,borderRadius,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,textIndent,perspective'
         .split(','));
 
 function makeBooleanMap(keys: string[]): {[key: string]: boolean} {

diff --git a/...ages/animations/browser/test/dsl/style_normalizer/web_animations_style_normalizer_spec.ts b/...ages/animations/browser/test/dsl/style_normalizer/web_animations_style_normalizer_spec.ts
@@ -59,6 +59,12 @@ export function main() {
            expect(normalize('borderWidth', 'inherit')).toEqual('inherit');
            expect(normalize('paddingTop', 'calc(500px + 200px)')).toEqual('calc(500px + 200px)');
          });
+
+      it('should allow `perspective` to be a numerical property', () => {
+        expect(normalize('perspective', 10)).toEqual('10px');
+        expect(normalize('perspective', '100pt')).toEqual('100pt');
+        expect(normalize('perspective', 'none')).toEqual('none');
+      });
     });
   });
 }