diff --git a/components/style/gecko/wrapper.rs b/components/style/gecko/wrapper.rs
index f64703dfd9c..b598bb0a799 100644
--- a/components/style/gecko/wrapper.rs
+++ b/components/style/gecko/wrapper.rs
@@ -775,7 +775,7 @@ impl<'le> TElement for GeckoElement<'le> {
                                 after_change_style: &Arc<ComputedValues>,
                                 pseudo: Option<&PseudoElement>) -> bool {
         use gecko_bindings::structs::nsCSSPropertyID;
-        use properties::animated_properties;
+        use properties::{PropertyId, animated_properties};
         use std::collections::HashSet;
 
         debug_assert!(self.might_need_transitions_update(&Some(before_change_style),
@@ -825,16 +825,24 @@ impl<'le> TElement for GeckoElement<'le> {
                 }
                 false
             };
-            // FIXME: Bug 1353628: Shorthand properties are parsed failed now, so after fixing
-            //        that, we have to handle shorthand.
             if property == nsCSSPropertyID::eCSSPropertyExtra_all_properties {
                 if TransitionProperty::any(property_check_helper) {
                     return true;
                 }
             } else {
-                if animated_properties::nscsspropertyid_is_animatable(property) &&
-                   property_check_helper(property.into()) {
-                    return true;
+                let is_shorthand = PropertyId::from_nscsspropertyid(property).ok().map_or(false, |p| {
+                        p.as_shorthand().is_ok()
+                });
+                if is_shorthand {
+                    let shorthand: TransitionProperty = property.into();
+                    if shorthand.longhands().iter().any(|&p| property_check_helper(p)) {
+                        return true;
+                    }
+                } else {
+                    if animated_properties::nscsspropertyid_is_animatable(property) &&
+                       property_check_helper(property.into()) {
+                        return true;
+                    }
                 }
             }
         }
diff --git a/components/style/properties/helpers/animated_properties.mako.rs b/components/style/properties/helpers/animated_properties.mako.rs
index 7c6031ca09c..721b858e59b 100644
--- a/components/style/properties/helpers/animated_properties.mako.rs
+++ b/components/style/properties/helpers/animated_properties.mako.rs
@@ -54,10 +54,16 @@ pub enum TransitionProperty {
             ${prop.camel_case},
         % endif
     % endfor
+    // Shorthand properties may or may not contain any animatable property. Either should still be
+    // parsed properly.
+    % for prop in data.shorthands_except_all():
+        /// ${prop.name}
+        ${prop.camel_case},
+    % endfor
 }
 
 impl TransitionProperty {
-    /// Iterates over each property that is not `All`.
+    /// Iterates over each longhand property.
     pub fn each<F: FnMut(TransitionProperty) -> ()>(mut cb: F) {
         % for prop in data.longhands:
             % if prop.animatable:
@@ -88,6 +94,9 @@ impl TransitionProperty {
                     "${prop.name}" => Ok(TransitionProperty::${prop.camel_case}),
                 % endif
             % endfor
+            % for prop in data.shorthands_except_all():
+                "${prop.name}" => Ok(TransitionProperty::${prop.camel_case}),
+            % endfor
             _ => Err(())
         }
     }
@@ -118,7 +127,8 @@ impl TransitionProperty {
         }
     }
 
-    /// Returns true if this TransitionProperty is one of the discrete animatable properties.
+    /// Returns true if this TransitionProperty is one of the discrete animatable properties and
+    /// this TransitionProperty should be a longhand property.
     pub fn is_discrete(&self) -> bool {
         match *self {
             % for prop in data.longhands:
@@ -129,6 +139,25 @@ impl TransitionProperty {
             _ => false
         }
     }
+
+    /// Return animatable longhands of this shorthand TransitionProperty, except for "all".
+    pub fn longhands(&self) -> &'static [TransitionProperty] {
+        % for prop in data.shorthands_except_all():
+            static ${prop.ident.upper()}: &'static [TransitionProperty] = &[
+                % for sub in prop.sub_properties:
+                    % if sub.animatable:
+                        TransitionProperty::${sub.camel_case},
+                    % endif
+                % endfor
+            ];
+        % endfor
+        match *self {
+            % for prop in data.shorthands_except_all():
+                TransitionProperty::${prop.camel_case} => ${prop.ident.upper()},
+            % endfor
+            _ => panic!("Not allowed to call longhands() for this TransitionProperty")
+        }
+    }
 }
 
 /// Returns true if this nsCSSPropertyID is one of the animatable properties.
@@ -155,6 +184,9 @@ impl ToCss for TransitionProperty {
                     TransitionProperty::${prop.camel_case} => dest.write_str("${prop.name}"),
                 % endif
             % endfor
+            % for prop in data.shorthands_except_all():
+                TransitionProperty::${prop.camel_case} => dest.write_str("${prop.name}"),
+            % endfor
         }
     }
 }
@@ -171,6 +203,10 @@ impl From<TransitionProperty> for nsCSSPropertyID {
                         => ${helpers.to_nscsspropertyid(prop.ident)},
                 % endif
             % endfor
+            % for prop in data.shorthands_except_all():
+                TransitionProperty::${prop.camel_case}
+                    => ${helpers.to_nscsspropertyid(prop.ident)},
+            % endfor
             TransitionProperty::All => nsCSSPropertyID::eCSSPropertyExtra_all_properties,
         }
     }
@@ -188,6 +224,10 @@ impl From<nsCSSPropertyID> for TransitionProperty {
                         => TransitionProperty::${prop.camel_case},
                 % endif
             % endfor
+            % for prop in data.shorthands_except_all():
+                ${helpers.to_nscsspropertyid(prop.ident)}
+                    => TransitionProperty::${prop.camel_case},
+            % endfor
             nsCSSPropertyID::eCSSPropertyExtra_all_properties => TransitionProperty::All,
             _ => panic!("Unsupported Servo transition property: {:?}", property),
         }
@@ -206,7 +246,7 @@ impl<'a> From<TransitionProperty> for PropertyDeclarationId<'a> {
                         => PropertyDeclarationId::Longhand(LonghandId::${prop.camel_case}),
                 % endif
             % endfor
-            TransitionProperty::All => panic!(),
+            _ => panic!(),
         }
     }
 }
@@ -304,6 +344,7 @@ impl AnimatedProperty {
                     }
                 % endif
             % endfor
+            other => panic!("Can't use TransitionProperty::{:?} here", other),
         }
     }
 }
@@ -459,6 +500,7 @@ impl AnimationValue {
                     }
                 % endif
             % endfor
+            other => panic!("Can't use TransitionProperty::{:?} here.", other),
         }
     }
 }
diff --git a/components/style/properties/properties.mako.rs b/components/style/properties/properties.mako.rs
index d3d4d807659..767bb39385c 100644
--- a/components/style/properties/properties.mako.rs
+++ b/components/style/properties/properties.mako.rs
@@ -257,7 +257,7 @@ impl LonghandIdSet {
                     TransitionProperty::${prop.camel_case} => self.insert(LonghandId::${prop.camel_case}),
                 % endif
             % endfor
-            TransitionProperty::All => unreachable!("Tried to set TransitionProperty::All in a PropertyBitfield"),
+            other => unreachable!("Tried to set TransitionProperty::{:?} in a PropertyBitfield", other),
         }
     }
 
@@ -270,7 +270,7 @@ impl LonghandIdSet {
                     TransitionProperty::${prop.camel_case} => self.contains(LonghandId::${prop.camel_case}),
                 % endif
             % endfor
-            TransitionProperty::All => unreachable!("Tried to get TransitionProperty::All in a PropertyBitfield"),
+            other => unreachable!("Tried to get TransitionProperty::{:?} in a PropertyBitfield", other),
         }
     }
 }