--- a/dom/animation/KeyframeEffectReadOnly.cpp
+++ b/dom/animation/KeyframeEffectReadOnly.cpp
@@ -320,16 +320,40 @@ KeyframeEffectReadOnly::UpdateProperties
 
 void
 KeyframeEffectReadOnly::UpdateProperties(
   const ServoComputedValuesWithParent& aServoValues)
 {
   DoUpdateProperties(aServoValues);
 }
 
+static void
+PhysicalizeLogicalProperties(nsTArray<AnimationProperty>& aProperties,
+                             nsStyleContext* aStyleContext)
+{
+  uint8_t writingMode = aStyleContext->StyleVisibility()->mWritingMode;
+  uint8_t textOrientation = aStyleContext->StyleVisibility()->mTextOrientation;
+  uint8_t direction = aStyleContext->StyleVisibility()->mDirection;
+  for (AnimationProperty& property : aProperties) {
+    if (nsCSSProps::PropHasFlags(property.mProperty, CSS_PROPERTY_LOGICAL)) {
+      property.mProperty =
+        nsCSSProps::PhysicalProperty(property.mProperty, writingMode,
+                                     textOrientation, direction);
+    }
+  }
+}
+
+static void
+PhysicalizeLogicalProperties(nsTArray<AnimationProperty>& aProperties,
+                             const ServoComputedValuesWithParent& aServoValues)
+{
+  MOZ_ASSERT(false,
+             "PhysicalizeLogicalProperties does not support for stylo yet");
+}
+
 template<typename StyleType>
 void
 KeyframeEffectReadOnly::DoUpdateProperties(StyleType&& aStyle)
 {
   MOZ_ASSERT_IF(IsPointer<StyleType>::value, aStyle);
 
   // Skip updating properties when we are composing style.
   // FIXME: Bug 1324966. Drop this check once we have a function to get
@@ -338,16 +362,18 @@ KeyframeEffectReadOnly::DoUpdateProperti
                         "Should not be called while processing ComposeStyle()");
   if (mIsComposingStyle) {
     return;
   }
 
   nsTArray<AnimationProperty> properties =
     BuildProperties(Forward<StyleType>(aStyle));
 
+  PhysicalizeLogicalProperties(properties, aStyle);
+
   // We need to update base styles even if any properties are not changed at all
   // since base styles might have been changed due to parent style changes, etc.
   EnsureBaseStyles(aStyle, properties);
 
   if (mProperties == properties) {
     return;
   }
 

--- a/dom/base/nsDOMWindowUtils.cpp
+++ b/dom/base/nsDOMWindowUtils.cpp
@@ -2773,16 +2773,19 @@ nsDOMWindowUtils::GetAnimationTypeForLon
       aResult.AssignLiteral("shadow");
       break;
     case eStyleAnimType_Discrete:
       aResult.AssignLiteral("discrete");
       break;
     case eStyleAnimType_None:
       aResult.AssignLiteral("none");
       break;
+    case eStyleAnimType_Logical:
+      aResult.AssignLiteral("logical");
+      break;
   }
   return NS_OK;
 }
 
 NS_IMETHODIMP
 nsDOMWindowUtils::GetUnanimatedComputedStyle(nsIDOMElement* aElement,
                                              const nsAString& aPseudoElement,
                                              const nsAString& aProperty,

--- a/dom/base/test/test_domwindowutils.html
+++ b/dom/base/test/test_domwindowutils.html
@@ -69,16 +69,20 @@ function test_getAnimationType() {
       propertyName: "background-color",
       expectedType: "color"
     },
     {
       propertyName: "background-size",
       expectedType: "custom"
     },
     {
+      propertyName: "block-size",
+      expectedType: "logical"
+    },
+    {
       propertyName: "border-bottom-left-radius",
       expectedType: "coord"
     },
     {
       propertyName: "border-bottom-right-radius",
       expectedType: "coord"
     },
     {

--- a/layout/style/StyleAnimationValue.cpp
+++ b/layout/style/StyleAnimationValue.cpp
@@ -4186,30 +4186,56 @@ StyleClipBasicShapeToCSSArray(const Styl
     default:
       MOZ_ASSERT_UNREACHABLE("Unknown shape type");
       return false;
   }
   aResult->Item(1).SetEnumValue(aClipPath.GetReferenceBox());
   return true;
 }
 
+static bool
+ExtractDiscreteValue(nsCSSPropertyID aProperty,
+                     nsStyleContext* aStyleContext,
+                     const void* aSyleStruct,
+                     StyleAnimationValue& aComputedValue)
+{
+  if (aProperty == eCSSProperty_visibility) {
+    aComputedValue.SetIntValue(
+      static_cast<const nsStyleVisibility*>(aSyleStruct)->mVisible,
+      StyleAnimationValue::eUnit_Visibility);
+    return true;
+  }
+  if (aStyleContext->StyleSource().IsServoComputedValues()) {
+    NS_ERROR("stylo: extracting discretely animated values not supported");
+    return false;
+  }
+
+  auto cssValue = MakeUnique<nsCSSValue>(eCSSUnit_Unset);
+  aStyleContext->RuleNode()->GetDiscretelyAnimatedCSSValue(aProperty,
+                                                           cssValue.get());
+  aComputedValue.SetAndAdoptCSSValueValue(
+    cssValue.release(), StyleAnimationValue::eUnit_DiscreteCSSValue);
+  return true;
+}
+
 bool
 StyleAnimationValue::ExtractComputedValue(nsCSSPropertyID aProperty,
                                           nsStyleContext* aStyleContext,
                                           StyleAnimationValue& aComputedValue)
 {
   MOZ_ASSERT(0 <= aProperty && aProperty < eCSSProperty_COUNT_no_shorthands,
              "bad property");
   const void* styleStruct =
     aStyleContext->StyleData(nsCSSProps::kSIDTable[aProperty]);
   ptrdiff_t ssOffset = nsCSSProps::kStyleStructOffsetTable[aProperty];
   nsStyleAnimType animType = nsCSSProps::kAnimTypeTable[aProperty];
   MOZ_ASSERT(0 <= ssOffset ||
              animType == eStyleAnimType_Custom ||
-             animType == eStyleAnimType_Discrete,
+             animType == eStyleAnimType_Discrete ||
+             animType == eStyleAnimType_Logical,
              "all animation types other than Custom and Discrete must " \
              "specify a style struct offset to extract values from");
   switch (animType) {
     case eStyleAnimType_Custom:
       switch (aProperty) {
         // For border-width, ignore the border-image business (which
         // only exists until we update our implementation to the current
         // spec) and use GetComputedBorder
@@ -4745,32 +4771,35 @@ StyleAnimationValue::ExtractComputedValu
       for (uint32_t i = 0, i_end = shadowArray->Length(); i < i_end; ++i) {
         AppendCSSShadowValue(shadowArray->ShadowAt(i), resultTail);
       }
       aComputedValue.SetAndAdoptCSSValueListValue(result.forget(),
                                                   eUnit_Shadow);
       return true;
     }
     case eStyleAnimType_Discrete: {
-      if (aProperty == eCSSProperty_visibility) {
-        aComputedValue.SetIntValue(
-          static_cast<const nsStyleVisibility*>(styleStruct)->mVisible,
-          eUnit_Visibility);
-        return true;
-      }
-      if (aStyleContext->StyleSource().IsServoComputedValues()) {
-        NS_ERROR("stylo: extracting discretely animated values not supported");
-        return false;
-      }
-      auto cssValue = MakeUnique<nsCSSValue>(eCSSUnit_Unset);
-      aStyleContext->RuleNode()->GetDiscretelyAnimatedCSSValue(aProperty,
-                                                               cssValue.get());
-      aComputedValue.SetAndAdoptCSSValueValue(cssValue.release(),
-                                              eUnit_DiscreteCSSValue);
-      return true;
+      return ExtractDiscreteValue(aProperty, aStyleContext,
+                                  styleStruct, aComputedValue);
+    }
+    case eStyleAnimType_Logical: {
+      MOZ_ASSERT(nsCSSProps::PropHasFlags(aProperty, CSS_PROPERTY_LOGICAL),
+                 "aProperty should be logical property");
+      nsCSSPropertyID physical =
+        nsCSSProps::PhysicalProperty(
+          aProperty, aStyleContext->StyleVisibility()->mWritingMode,
+          aStyleContext->StyleVisibility()->mTextOrientation,
+          aStyleContext->StyleVisibility()->mDirection);
+      // Basicaly, pass to ExtractComputedValue again with a physical property.
+      // However, if animation type of physical property is discrete,
+      // can't do since have to get the value from aStyleContext->RuleNode
+      // directly with logical property.
+      return nsCSSProps::kAnimTypeTable[physical] == eStyleAnimType_Discrete
+             ? ExtractDiscreteValue(aProperty, aStyleContext,
+                                    styleStruct, aComputedValue)
+             : ExtractComputedValue(physical, aStyleContext, aComputedValue);
     }
     case eStyleAnimType_None:
       NS_NOTREACHED("shouldn't use on non-animatable properties");
   }
   return false;
 }
 
 gfxSize

--- a/layout/style/nsCSSPropList.h
+++ b/layout/style/nsCSSPropList.h
@@ -664,17 +664,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_AXIS |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Size,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_SHORTHAND(
     border,
     border,
     Border,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_SHORTHAND(
     border-block-end,
@@ -692,33 +692,33 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HC,
     nullptr,
     BorderColor,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-block-end-style,
     border_block_end_style,
     BorderBlockEndStyle,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HK,
     kBorderStyleKTable,
     BorderStyle,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-block-end-width,
     border_block_end_width,
     BorderBlockEndWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
@@ -726,17 +726,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HKL | VARIANT_CALC,
     kBorderWidthKTable,
     BorderWidth,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_SHORTHAND(
     border-block-start,
     border_block_start,
     BorderBlockStart,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_LOGICAL(
     border-block-start-color,
@@ -747,49 +747,49 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_HC,
     nullptr,
     BorderColor,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-block-start-style,
     border_block_start_style,
     BorderBlockStartStyle,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_HK,
     kBorderStyleKTable,
     BorderStyle,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-block-start-width,
     border_block_start_width,
     BorderBlockStartWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_HKL | VARIANT_CALC,
     kBorderWidthKTable,
     BorderWidth,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_SHORTHAND(
     border-bottom,
     border_bottom,
     BorderBottom,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_BORDER(
     border-bottom-color,
@@ -961,49 +961,49 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HC,
     nullptr,
     BorderColor,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-inline-end-style,
     border_inline_end_style,
     BorderInlineEndStyle,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HK,
     kBorderStyleKTable,
     BorderStyle,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-inline-end-width,
     border_inline_end_width,
     BorderInlineEndWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HKL | VARIANT_CALC,
     kBorderWidthKTable,
     BorderWidth,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_SHORTHAND(
     border-inline-start,
     border_inline_start,
     BorderInlineStart,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_LOGICAL(
     border-inline-start-color,
@@ -1013,47 +1013,47 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_HC,
     nullptr,
     BorderColor,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-inline-start-style,
     border_inline_start_style,
     BorderInlineStartStyle,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_HK,
     kBorderStyleKTable,
     BorderStyle,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     border-inline-start-width,
     border_inline_start_width,
     BorderInlineStartWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_HKL | VARIANT_CALC,
     kBorderWidthKTable,
     BorderWidth,
     Border,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_SHORTHAND(
     border-left,
     border_left,
     BorderLeft,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_BORDER(
     border-left-color,
@@ -2367,17 +2367,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_AXIS,
     "",
     VARIANT_AHKLP | VARIANT_CALC,
     kWidthKTable,
     Size,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_DISPLAY(
     isolation,
     isolation,
     Isolation,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_CREATES_STACKING_CONTEXT,
     "layout.css.isolation.enabled",
     VARIANT_HK,
@@ -2539,17 +2539,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Margin,
     Margin,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     margin-block-start,
     margin_block_start,
     MarginBlockStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_APPLIES_TO_PAGE_RULE |
@@ -2557,17 +2557,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Margin,
     Margin,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_MARGIN(
     margin-bottom,
     margin_bottom,
     MarginBottom,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK |
@@ -2589,33 +2589,33 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Margin,
     Margin,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     margin-inline-start,
     margin_inline_start,
     MarginInlineStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_APPLIES_TO_PAGE_RULE |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Margin,
     Margin,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_MARGIN(
     margin-left,
     margin_left,
     MarginLeft,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         CSS_PROPERTY_STORES_CALC |
@@ -2873,17 +2873,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_AXIS |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_HLPO | VARIANT_CALC,
     nullptr,
     MaxSize,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_POSITION(
     max-height,
     max_height,
     MaxHeight,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK,
@@ -2903,17 +2903,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_AXIS,
     "",
     VARIANT_HKLPO | VARIANT_CALC,
     kWidthKTable,
     MaxSize,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_POSITION(
     max-width,
     max_width,
     MaxWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK,
@@ -2934,17 +2934,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_AXIS |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     MinSize,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 #ifndef CSS_PROP_LIST_EXCLUDE_INTERNAL
 CSS_PROP_FONT(
     -moz-min-font-size-ratio,
     _moz_min_font_size_ratio,
     CSS_PROP_DOMPROP_PREFIXED(MinFontSizeRatio),
     CSS_PROPERTY_INTERNAL |
         CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_ENABLED_IN_UA_SHEETS,
@@ -2978,17 +2978,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_AXIS,
     "",
     VARIANT_AHKLP | VARIANT_CALC,
     kWidthKTable,
     MinSize,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_POSITION(
     min-width,
     min_width,
     MinWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK,
@@ -3040,64 +3040,64 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Offset,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     offset-block-start,
     offset_block_start,
     OffsetBlockStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Offset,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     offset-inline-end,
     offset_inline_end,
     OffsetInlineEnd,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Offset,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     offset-inline-start,
     offset_inline_start,
     OffsetInlineStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_STORES_CALC |
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_AHLP | VARIANT_CALC,
     nullptr,
     Offset,
     Position,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_EFFECTS(
     opacity,
     opacity,
     Opacity,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_APPLIES_TO_PLACEHOLDER |
         CSS_PROPERTY_CAN_ANIMATE_ON_COMPOSITOR |
         CSS_PROPERTY_CREATES_STACKING_CONTEXT,
@@ -3304,17 +3304,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HLP | VARIANT_CALC,
     nullptr,
     Padding,
     Padding,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     padding-block-start,
     padding_block_start,
     PaddingBlockStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         // This is required by the UA stylesheet and can't be overridden.
@@ -3324,17 +3324,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_BLOCK_AXIS,
     "",
     VARIANT_HLP | VARIANT_CALC,
     nullptr,
     Padding,
     Padding,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_PADDING(
     padding-bottom,
     padding_bottom,
     PaddingBottom,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         // This is required by the UA stylesheet and can't be overridden.
@@ -3361,17 +3361,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_LOGICAL |
         CSS_PROPERTY_LOGICAL_END_EDGE,
     "",
     VARIANT_HLP | VARIANT_CALC,
     nullptr,
     Padding,
     Padding,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_LOGICAL(
     padding-inline-start,
     padding_inline_start,
     PaddingInlineStart,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |
         // This is required by the UA stylesheet and can't be overridden.
@@ -3380,17 +3380,17 @@ CSS_PROP_LOGICAL(
         CSS_PROPERTY_GETCS_NEEDS_LAYOUT_FLUSH |
         CSS_PROPERTY_LOGICAL,
     "",
     VARIANT_HLP | VARIANT_CALC,
     nullptr,
     Padding,
     Padding,
     CSS_PROP_NO_OFFSET,
-    eStyleAnimType_None)
+    eStyleAnimType_Logical)
 CSS_PROP_PADDING(
     padding-left,
     padding_left,
     PaddingLeft,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE |
         CSS_PROPERTY_UNITLESS_LENGTH_QUIRK |
         CSS_PROPERTY_APPLIES_TO_FIRST_LETTER |

--- a/layout/style/nsCSSProps.h
+++ b/layout/style/nsCSSProps.h
@@ -324,16 +324,19 @@ enum nsStyleAnimType {
   eStyleAnimType_PaintServer,
 
   // RefPtr<nsCSSShadowArray> values
   eStyleAnimType_Shadow,
 
   // discrete values
   eStyleAnimType_Discrete,
 
+  // logical property's animation
+  eStyleAnimType_Logical,
+
   // property not animatable
   eStyleAnimType_None
 };
 
 class nsCSSProps {
 public:
   typedef mozilla::CSSEnabledState EnabledState;