Web Animations: Use legacy cascade behaviour and the MatchedPropertiesCache

Source/core/css/resolver/StyleResolver.cpp

 /*
  * Copyright (C) 1999 Lars Knoll (knoll@kde.org)
  *           (C) 2004-2005 Allan Sandfeld Jensen (kde@carewolf.com)
  * Copyright (C) 2006, 2007 Nicholas Shanks (webkit@nickshanks.com)
  * Copyright (C) 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013 Apple Inc. All rights reserved.
  * Copyright (C) 2007 Alexey Proskuryakov <ap@webkit.org>
  * Copyright (C) 2007, 2008 Eric Seidel <eric@webkit.org>
  * Copyright (C) 2008, 2009 Torch Mobile Inc. All rights reserved. (http://www.torchmobile.com/)
  * Copyright (c) 2011, Code Aurora Forum. All rights reserved.
  * Copyright (C) Research In Motion Limited 2011. All rights reserved.
@@ skipping 513 matching lines @@
             // Inline style is immutable as long as there is no CSSOM wrapper.
             // FIXME: Media control shadow trees seem to have problems with caching.
             bool isInlineStyleCacheable = !state.element()->inlineStyle()->isMutable() && !state.element()->isInShadowTree();
             // FIXME: Constify.
             collector.addElementStyleProperties(state.element()->inlineStyle(), isInlineStyleCacheable);
         }
 
         // Now check SMIL animation override style.
         if (includeSMILProperties && state.element()->isSVGElement())
             collector.addElementStyleProperties(toSVGElement(state.element())->animatedSMILStyleProperties(), false /* isCacheable */);
-
-        if (state.element()->hasActiveAnimations())
-            collector.matchedResult().isCacheable = false;
     }
 }
 
 PassRefPtr<RenderStyle> StyleResolver::styleForDocument(Document& document, CSSFontSelector* fontSelector)
 {
     const Frame* frame = document.frame();
 
     // HTML5 states that seamless iframes should replace default CSS values
     // with values inherited from the containing iframe element. However,
     // some values (such as the case of designMode = "on") still need to
@@ skipping 622 matching lines @@
 }
 
 void StyleResolver::applyMatchedProperties(StyleResolverState& state, const MatchResult& matchResult, Element* animatingElement)
 {
     const Element* element = state.element();
     ASSERT(element);
     STYLE_STATS_ADD_MATCHED_PROPERTIES_SEARCH();
 
     unsigned cacheHash = matchResult.isCacheable ? computeMatchedPropertiesHash(matchResult.matchedProperties.data(), matchResult.matchedProperties.size()) : 0;
     bool applyInheritedOnly = false;
+    bool applyAnimatedOnly = false;
     const CachedMatchedProperties* cachedMatchedProperties = 0;
 
     if (cacheHash && (cachedMatchedProperties = m_matchedPropertiesCache.find(cacheHash, state, matchResult))
         && MatchedPropertiesCache::isCacheable(element, state.style(), state.parentStyle())) {
         STYLE_STATS_ADD_MATCHED_PROPERTIES_HIT();
         // We can build up the style by copying non-inherited properties from an earlier style object built using the same exact
         // style declarations. We then only need to apply the inherited properties, if any, as their values can depend on the
         // element context. This is fast and saves memory by reusing the style data structures.
         state.style()->copyNonInheritedFrom(cachedMatchedProperties->renderStyle.get());
         if (state.parentStyle()->inheritedDataShared(cachedMatchedProperties->parentRenderStyle.get()) && !isAtShadowBoundary(element)) {
             STYLE_STATS_ADD_MATCHED_PROPERTIES_HIT_SHARED_INHERITED();
 
             EInsideLink linkStatus = state.style()->insideLink();
             // If the cache item parent style has identical inherited properties to the current parent style then the
             // resulting style will be identical too. We copy the inherited properties over from the cache and are done.
             state.style()->inheritFrom(cachedMatchedProperties->renderStyle.get());
 
             // Unfortunately the link status is treated like an inherited property. We need to explicitly restore it.
             state.style()->setInsideLink(linkStatus);
-            return;
+
+            if (RuntimeEnabledFeatures::webAnimationsEnabled()) {

[Steve Block, 2013/11/14 02:17:18]

This should probably be WebAnimationsCSSEnabled()

[dstockwell, 2013/11/14 02:59:49]

It's a bit mixed up, we could just kill the 'WebAnimations' runtime flag and
block enabling the other web animations features on having enabled
WebAnimationsCSS.

Either way will work for now. We can remove it in a separate patch.

[Timothy Loh, 2013/11/14 03:06:31]

Erm; changed the callers in this file anyway.

+                applyAnimatedOnly = element->hasActiveAnimations()

[dstockwell, 2013/11/13 23:37:19]

Would it be cleaner to pull out the application of animated properties into a
separate function and just call that here (and below)?

[Steve Block, 2013/11/14 02:17:18]

Agreed

[Timothy Loh, 2013/11/14 03:06:31]

Done. I wasn't sure if this would make it cleaner, but given that it makes the
diff much simpler I'm pretty sure this is better.

+                    || (state.style()->transitions() && !state.style()->transitions()->isEmpty())
+                    || (state.style()->animations() && !state.style()->animations()->isEmpty());
+            }
+            if (!applyAnimatedOnly)
+                return;
         }
         applyInheritedOnly = true;
     }
 
-    // First apply all variable definitions, as they may be used during application of later properties.
-    applyMatchedProperties<VariableDefinitions>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
-    applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-    applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-    applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
+    if (!applyAnimatedOnly) {
+        // First apply all variable definitions, as they may be used during application of later properties.
+        applyMatchedProperties<VariableDefinitions>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
+        applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
+        applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
+        applyMatchedProperties<VariableDefinitions>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
 
-    // Apply animation properties in order to apply animation results and trigger transitions below.
-    applyMatchedProperties<AnimationProperties>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
-    applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-    applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-    applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
+        // Apply animation properties in order to apply animation results and trigger transitions below.
+        applyMatchedProperties<AnimationProperties>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
+        applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
+        applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
+        applyMatchedProperties<AnimationProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
 
-    // Match transition-property / animation-name length by trimming and
-    // lengthening other transition / animation property lists
-    // FIXME: This is wrong because we shouldn't affect the computed values
-    state.style()->adjustAnimations();
-    state.style()->adjustTransitions();
+        // Match transition-property / animation-name length by trimming and
+        // lengthening other transition / animation property lists
+        // FIXME: This is wrong because we shouldn't affect the computed values
+        state.style()->adjustAnimations();
+        state.style()->adjustTransitions();
 
-    // Now we have all of the matched rules in the appropriate order. Walk the rules and apply
-    // high-priority properties first, i.e., those properties that other properties depend on.
-    // The order is (1) high-priority not important, (2) high-priority important, (3) normal not important
-    // and (4) normal important.
-    state.setLineHeightValue(0);
-    applyMatchedProperties<HighPriorityProperties>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
-    applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-    applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-    applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
+        // Now we have all of the matched rules in the appropriate order. Walk the rules and apply
+        // high-priority properties first, i.e., those properties that other properties depend on.
+        // The order is (1) high-priority not important, (2) high-priority important, (3) normal not important
+        // and (4) normal important.
+        state.setLineHeightValue(0);
+        applyMatchedProperties<HighPriorityProperties>(state, matchResult, false, 0, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
+        applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
+        applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
+        applyMatchedProperties<HighPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
 
-    if (cachedMatchedProperties && cachedMatchedProperties->renderStyle->effectiveZoom() != state.style()->effectiveZoom()) {
-        state.fontBuilder().setFontDirty(true);
-        applyInheritedOnly = false;
+        if (cachedMatchedProperties && cachedMatchedProperties->renderStyle->effectiveZoom() != state.style()->effectiveZoom()) {
+            state.fontBuilder().setFontDirty(true);
+            applyInheritedOnly = false;
+        }
+
+        // If our font got dirtied, go ahead and update it now.
+        updateFont(state);
+
+        // Line-height is set when we are sure we decided on the font-size.
+        if (state.lineHeightValue())
+            StyleBuilder::applyProperty(CSSPropertyLineHeight, state, state.lineHeightValue());
+
+        // Many properties depend on the font. If it changes we just apply all properties.
+        if (cachedMatchedProperties && cachedMatchedProperties->renderStyle->fontDescription() != state.style()->fontDescription())
+            applyInheritedOnly = false;
+
+        // Now do the normal priority UA properties.
+        applyMatchedProperties<LowPriorityProperties>(state, matchResult, false, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
+
+        // Cache the UA properties to pass them to RenderTheme in adjustRenderStyle.
+        state.cacheUserAgentBorderAndBackground();
+
+        // Now do the author and user normal priority properties and all the !important properties.
+        applyMatchedProperties<LowPriorityProperties>(state, matchResult, false, matchResult.ranges.lastUARule + 1, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
+        applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
+        applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
+        applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
+
+        // Start loading resources referenced by this style.
+        m_styleResourceLoader.loadPendingResources(state.style(), state.elementStyleResources());
+
+#ifdef STYLE_STATS
+        if (!cachedMatchedProperties)
+            STYLE_STATS_ADD_MATCHED_PROPERTIES_TO_CACHE();
+#endif
+
+        if (!cachedMatchedProperties && cacheHash && MatchedPropertiesCache::isCacheable(element, state.style(), state.parentStyle())) {
+            STYLE_STATS_ADD_MATCHED_PROPERTIES_ENTERED_INTO_CACHE();
+            m_matchedPropertiesCache.add(state.style(), state.parentStyle(), cacheHash, matchResult);
+        }
     }
 
-    // If our font got dirtied, go ahead and update it now.
-    updateFont(state);
-
-    // Line-height is set when we are sure we decided on the font-size.
-    if (state.lineHeightValue())
-        StyleBuilder::applyProperty(CSSPropertyLineHeight, state, state.lineHeightValue());
-
-    // Many properties depend on the font. If it changes we just apply all properties.
-    if (cachedMatchedProperties && cachedMatchedProperties->renderStyle->fontDescription() != state.style()->fontDescription())
-        applyInheritedOnly = false;
-
-    // Now do the normal priority UA properties.
-    applyMatchedProperties<LowPriorityProperties>(state, matchResult, false, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
-
-    // Cache the UA properties to pass them to RenderTheme in adjustRenderStyle.
-    state.cacheUserAgentBorderAndBackground();
-
-    // Now do the author and user normal priority properties and all the !important properties.
-    applyMatchedProperties<LowPriorityProperties>(state, matchResult, false, matchResult.ranges.lastUARule + 1, matchResult.matchedProperties.size() - 1, applyInheritedOnly);
-    applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-    applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-    applyMatchedProperties<LowPriorityProperties>(state, matchResult, true, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
-
     // animatingElement may be null, for example if we're calculating the
     // style for a potential pseudo element that has yet to be created.
     if (RuntimeEnabledFeatures::webAnimationsEnabled() && animatingElement) {
         state.setAnimationUpdate(CSSAnimations::calculateUpdate(animatingElement, *state.style(), this));
         if (state.animationUpdate()) {
-            ASSERT(!applyInheritedOnly);
             const AnimationEffect::CompositableValueMap& compositableValuesForAnimations = state.animationUpdate()->compositableValuesForAnimations();
             const AnimationEffect::CompositableValueMap& compositableValuesForTransitions = state.animationUpdate()->compositableValuesForTransitions();
-            // Apply animated properties, then reapply any rules marked important.
-            if (applyAnimatedProperties<HighPriorityProperties>(state, compositableValuesForAnimations)) {
-                bool important = true;
-                applyMatchedProperties<HighPriorityProperties>(state, matchResult, important, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-                applyMatchedProperties<HighPriorityProperties>(state, matchResult, important, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-                applyMatchedProperties<HighPriorityProperties>(state, matchResult, important, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
-            }
+            applyAnimatedProperties<HighPriorityProperties>(state, compositableValuesForAnimations);
             applyAnimatedProperties<HighPriorityProperties>(state, compositableValuesForTransitions);
-            if (applyAnimatedProperties<LowPriorityProperties>(state, compositableValuesForAnimations)) {
-                bool important = true;
-                applyMatchedProperties<LowPriorityProperties>(state, matchResult, important, matchResult.ranges.firstAuthorRule, matchResult.ranges.lastAuthorRule, applyInheritedOnly);
-                applyMatchedProperties<LowPriorityProperties>(state, matchResult, important, matchResult.ranges.firstUserRule, matchResult.ranges.lastUserRule, applyInheritedOnly);
-                applyMatchedProperties<LowPriorityProperties>(state, matchResult, important, matchResult.ranges.firstUARule, matchResult.ranges.lastUARule, applyInheritedOnly);
-            }
+            applyAnimatedProperties<LowPriorityProperties>(state, compositableValuesForAnimations);
             applyAnimatedProperties<LowPriorityProperties>(state, compositableValuesForTransitions);
         }
     }
 
-    // Start loading resources referenced by this style.
-    m_styleResourceLoader.loadPendingResources(state.style(), state.elementStyleResources());
-
     ASSERT(!state.fontBuilder().fontDirty());
-
-#ifdef STYLE_STATS
-    if (!cachedMatchedProperties)
-        STYLE_STATS_ADD_MATCHED_PROPERTIES_TO_CACHE();
-#endif
-
-    if (cachedMatchedProperties || !cacheHash)
-        return;
-    if (!MatchedPropertiesCache::isCacheable(element, state.style(), state.parentStyle()))
-        return;
-    STYLE_STATS_ADD_MATCHED_PROPERTIES_ENTERED_INTO_CACHE();
-    m_matchedPropertiesCache.add(state.style(), state.parentStyle(), cacheHash, matchResult);
 }
 
 CSSPropertyValue::CSSPropertyValue(CSSPropertyID id, const StylePropertySet& propertySet)
     : property(id), value(propertySet.getPropertyCSSValue(id).get())
 { }
 
 void StyleResolver::applyPropertiesToStyle(const CSSPropertyValue* properties, size_t count, RenderStyle* style)
 {
     StyleResolverState state(document(), document().documentElement(), style);
     state.setStyle(style);
@@ skipping 57 matching lines @@
         m_matchedPropertiesSearches, m_matchedPropertiesHit, m_matchedPropertiesSharedInheritedHit, m_matchedPropertiesToCache, m_matchedPropertiesEnteredIntoCache);
 
     fprintf(stderr, "Total:\n");
     printStyleStats(m_totalSearches, m_totalElementsEligibleForSharing, m_totalStylesShared, m_totalSearchFoundSiblingForSharing, m_totalSearchesMissedSharing,
         m_totalMatchedPropertiesSearches, m_totalMatchedPropertiesHit, m_totalMatchedPropertiesSharedInheritedHit, m_totalMatchedPropertiesToCache, m_totalMatchedPropertiesEnteredIntoCache);
     fprintf(stderr, "--------------------------------------------------------------------------------\n");
 }
 #endif
 
 } // namespace WebCore