From 2a4563716aa15e4e774b1e033b36a178cf4d51e9 Mon Sep 17 00:00:00 2001 From: Sergey Mell Date: Wed, 11 Aug 2021 20:45:00 +0300 Subject: [PATCH] fix(styling): change transform parameters parsing (#9481) Fixed the incorrectly applied short form of "transform: translate" style property. closes #5202 --- apps/automated/src/ui/animation/css-animation-tests.ts | 2 +- packages/core/ui/styling/style-properties.ts | 8 +++++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/apps/automated/src/ui/animation/css-animation-tests.ts b/apps/automated/src/ui/animation/css-animation-tests.ts index d9d17d637..49e581257 100644 --- a/apps/automated/src/ui/animation/css-animation-tests.ts +++ b/apps/automated/src/ui/animation/css-animation-tests.ts @@ -212,7 +212,7 @@ export function test_ReadTranslateSingle() { TKUnit.assertEqual(translate.property, 'translate'); TKUnit.assertAreClose(translate.value.x, 30, DELTA); - TKUnit.assertAreClose(translate.value.y, 30, DELTA); + TKUnit.assertAreClose(translate.value.y, 0, DELTA); } export function test_ReadTranslateXY() { diff --git a/packages/core/ui/styling/style-properties.ts b/packages/core/ui/styling/style-properties.ts index 4ee4d25c9..c0fb01e4e 100644 --- a/packages/core/ui/styling/style-properties.ts +++ b/packages/core/ui/styling/style-properties.ts @@ -736,7 +736,13 @@ function normalizeTransformation({ property, value }: Transformation): Transform } function convertTransformValue(property: string, stringValue: string): TransformationValue { - const [x, y = x, z = y] = stringValue.split(',').map(parseFloat); + let [x, y, z] = stringValue.split(',').map(parseFloat); + if (property === 'translate') { + y ??= IDENTITY_TRANSFORMATION.translate.y; + } else { + y ??= x; + z ??= y; + } if (property === 'rotate' || property === 'rotateX' || property === 'rotateY') { return stringValue.slice(-3) === 'rad' ? radiansToDegrees(x) : x;