diff --git a/src/apis/StyleSheet/__tests__/resolveTransform-test.js b/src/apis/StyleSheet/__tests__/resolveTransform-test.js index 18ee341a..b5639092 100644 --- a/src/apis/StyleSheet/__tests__/resolveTransform-test.js +++ b/src/apis/StyleSheet/__tests__/resolveTransform-test.js @@ -3,7 +3,18 @@ import resolveTransform from '../resolveTransform'; describe('apis/StyleSheet/resolveTransform', () => { - test('transform', () => { + // passthrough if transform value is ever a string + test('transform string', () => { + const resolvedStyle = {}; + const transform = 'perspective(50px) scaleX(20) translateX(20px) rotate(20deg)'; + + const style = { transform }; + resolveTransform(resolvedStyle, style); + + expect(resolvedStyle).toEqual({ transform }); + }); + + test('transform array', () => { const resolvedStyle = {}; const style = { transform: [{ perspective: 50 }, { scaleX: 20 }, { translateX: 20 }, { rotate: '20deg' }] diff --git a/src/apis/StyleSheet/i18nStyle.js b/src/apis/StyleSheet/i18nStyle.js index af1b2d1a..21f773ad 100644 --- a/src/apis/StyleSheet/i18nStyle.js +++ b/src/apis/StyleSheet/i18nStyle.js @@ -71,15 +71,17 @@ const i18nStyle = originalStyle => { continue; } + const value = style[prop]; + if (PROPERTIES_TO_SWAP[prop]) { const newProp = flipProperty(prop); - nextStyle[newProp] = style[prop]; + nextStyle[newProp] = value; } else if (PROPERTIES_SWAP_LEFT_RIGHT[prop]) { - nextStyle[prop] = swapLeftRight(style[prop]); + nextStyle[prop] = swapLeftRight(value); } else if (prop === 'textShadowOffset') { - nextStyle[prop] = style[prop]; - nextStyle[prop].width = additiveInverse(style[prop].width); - } else if (prop === 'transform') { + nextStyle[prop] = value; + nextStyle[prop].width = additiveInverse(value.width); + } else if (prop === 'transform' && Array.isArray(value)) { nextStyle[prop] = style[prop].map(flipTransform); } else { nextStyle[prop] = style[prop]; diff --git a/src/apis/StyleSheet/resolveTransform.js b/src/apis/StyleSheet/resolveTransform.js index 2bd77020..0e3ad203 100644 --- a/src/apis/StyleSheet/resolveTransform.js +++ b/src/apis/StyleSheet/resolveTransform.js @@ -15,13 +15,13 @@ const convertTransformMatrix = transformMatrix => { }; const resolveTransform = (resolvedStyle, style) => { + let transform = style.transform; if (Array.isArray(style.transform)) { - const transform = style.transform.map(mapTransform).join(' '); - resolvedStyle.transform = transform; + transform = style.transform.map(mapTransform).join(' '); } else if (style.transformMatrix) { - const transform = convertTransformMatrix(style.transformMatrix); - resolvedStyle.transform = transform; + transform = convertTransformMatrix(style.transformMatrix); } + resolvedStyle.transform = transform; }; module.exports = resolveTransform;