From 9efa7e94bd162bde092443185d5577f807efda2d Mon Sep 17 00:00:00 2001
From: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed, 6 Jul 2016 17:10:27 -0700
Subject: [PATCH] [fix] support for Animated transform styles

Animated uses 'setNativeProps' to update styles. This mutates the DOM
without using React. But the code path was not adding 'px' units to
transform values and browsers were ignoring the style.

Fix #129
---
 src/apis/StyleSheet/__tests__/processTransform-test.js | 2 +-
 src/apis/StyleSheet/processTransform.js                | 7 +++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/apis/StyleSheet/__tests__/processTransform-test.js b/src/apis/StyleSheet/__tests__/processTransform-test.js
index 35d5966e..a8ef41e2 100644
--- a/src/apis/StyleSheet/__tests__/processTransform-test.js
+++ b/src/apis/StyleSheet/__tests__/processTransform-test.js
@@ -14,7 +14,7 @@ suite('apis/StyleSheet/processTransform', () => {
 
     assert.deepEqual(
       processTransform(style),
-      { transform: 'scaleX(20) rotate(20deg)' }
+      { transform: 'scaleX(20px) rotate(20deg)' }
     )
   })
 
diff --git a/src/apis/StyleSheet/processTransform.js b/src/apis/StyleSheet/processTransform.js
index 41f33208..cf9fc065 100644
--- a/src/apis/StyleSheet/processTransform.js
+++ b/src/apis/StyleSheet/processTransform.js
@@ -1,7 +1,10 @@
+import normalizeValue from './normalizeValue'
+
 // { scale: 2 } => 'scale(2)'
 const mapTransform = (transform) => {
-  var key = Object.keys(transform)[0]
-  return `${key}(${transform[key]})`
+  const type = Object.keys(transform)[0]
+  const value = normalizeValue('transform', transform[type])
+  return `${type}(${value})`
 }
 
 // [1,2,3,4,5,6] => 'matrix3d(1,2,3,4,5,6)'