From 297b2e5afb020679f4b49570a3d785de7ac3ce64 Mon Sep 17 00:00:00 2001
From: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed, 6 Jul 2016 18:48:53 -0700
Subject: [PATCH] [fix] support for Animated transform styles (part 2)

Only add 'px' to numeric translate values
---
 .../__tests__/processTransform-test.js           |  3 ++-
 src/apis/StyleSheet/processTransform.js          | 16 ++++++++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/apis/StyleSheet/__tests__/processTransform-test.js b/src/apis/StyleSheet/__tests__/processTransform-test.js
index a8ef41e2..3b797914 100644
--- a/src/apis/StyleSheet/__tests__/processTransform-test.js
+++ b/src/apis/StyleSheet/__tests__/processTransform-test.js
@@ -8,13 +8,14 @@ suite('apis/StyleSheet/processTransform', () => {
     const style = {
       transform: [
         { scaleX: 20 },
+        { translateX: 20 },
         { rotate: '20deg' }
       ]
     }
 
     assert.deepEqual(
       processTransform(style),
-      { transform: 'scaleX(20px) rotate(20deg)' }
+      { transform: 'scaleX(20) translateX(20px) rotate(20deg)' }
     )
   })
 
diff --git a/src/apis/StyleSheet/processTransform.js b/src/apis/StyleSheet/processTransform.js
index cf9fc065..bc57e6c5 100644
--- a/src/apis/StyleSheet/processTransform.js
+++ b/src/apis/StyleSheet/processTransform.js
@@ -1,9 +1,21 @@
-import normalizeValue from './normalizeValue'
+const translateProperties = {
+  translateX: true,
+  translateY: true,
+  translateZ: true
+}
+
+const processTransformValue = (key, value) => {
+  if (translateProperties[key] && typeof value === 'number') {
+    value += 'px';
+  }
+  return value;
+}
 
 // { scale: 2 } => 'scale(2)'
+// { translateX: 20 } => 'translateX(20px)'
 const mapTransform = (transform) => {
   const type = Object.keys(transform)[0]
-  const value = normalizeValue('transform', transform[type])
+  const value = processTransformValue(type, transform[type])
   return `${type}(${value})`
 }