DevTools: use FlatTreeTraversal in InspectorCSSCascade

This CL address a TODO and adds a basic test to cover the logic
changed.

Change-Id: I14a23de8860c2379e88eb5d2e442197f2443e978
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2339074Reviewed-by: Peter Marshall <petermarshall@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Cr-Commit-Position: refs/heads/master@{#795001}

third_party/blink/renderer/core/inspector/inspector_css_cascade.cc

@@ -10,6 +10,7 @@
 #include "third_party/blink/renderer/core/css/css_value.h"
 #include "third_party/blink/renderer/core/css/resolver/style_resolver.h"
 #include "third_party/blink/renderer/core/dom/element.h"
+#include "third_party/blink/renderer/core/dom/flat_tree_traversal.h"
 #include "third_party/blink/renderer/core/dom/pseudo_element.h"
 #include "third_party/blink/renderer/core/style/computed_style_constants.h"
 #include "third_party/blink/renderer/platform/heap/heap.h"
@@ -33,6 +34,9 @@ InspectorCSSCascade::InspectorCSSCascade(Element* element,
   matched_rules_ = style_resolver.PseudoCSSRulesForElement(
       element_, element_pseudo_id, StyleResolver::kAllCSSRules);
 
+  if (element_pseudo_id)
+    return;
+
   for (PseudoId pseudo_id = kFirstPublicPseudoId;
        pseudo_id < kAfterLastInternalPseudoId;
        pseudo_id = static_cast<PseudoId>(pseudo_id + 1)) {
@@ -56,9 +60,7 @@ InspectorCSSCascade::InspectorCSSCascade(Element* element,
   }
 
   // Parent rules.
-  // TODO (alexrudenko): Use the flat-tree parent (FlatTreeTraversal::Parent)
-  // (not ParentOrShadowHostElement).
-  Element* parent_element = element_->ParentOrShadowHostElement();
+  Element* parent_element = FlatTreeTraversal::ParentElement(*element);
   while (parent_element) {
     RuleIndexList* parent_matched_rules = style_resolver.CssRulesForElement(
         parent_element, StyleResolver::kAllCSSRules);
@@ -68,7 +70,7 @@ InspectorCSSCascade::InspectorCSSCascade(Element* element,
     match->matched_rules = parent_matched_rules;
     match->pseudo_id = kPseudoIdNone;
     parent_rules_.push_back(match);
-    parent_element = parent_element->ParentOrShadowHostElement();
+    parent_element = FlatTreeTraversal::ParentElement(*parent_element);
   }
 }
 

third_party/blink/renderer/core/inspector/inspector_css_cascade_test.cc

@@ -44,10 +44,46 @@ TEST_F(InspectorCSSCascadeTest, DirectlyMatchedRules) {
   const CSSValue* value =
       cascade.GetCascadedProperty(CSSPropertyID::kGridTemplateColumns);
   const CSSValueList* value_list = DynamicTo<CSSValueList>(value);
-  EXPECT_EQ((unsigned)3, value_list->length());
+  EXPECT_EQ(3u, value_list->length());
   EXPECT_EQ("100px", value_list->Item(0).CssText());
   EXPECT_EQ("1fr", value_list->Item(1).CssText());
   EXPECT_EQ("20%", value_list->Item(2).CssText());
 }
 
+TEST_F(InspectorCSSCascadeTest, ParentRules) {
+  GetDocument().body()->setInnerHTML(R"HTML(
+    <style>
+      #grid-container {
+        display: inline-grid;
+        grid-gap: 5px;
+        grid-template-columns: 50px 1fr 10%;
+      }
+      #grid {
+        display: grid;
+        grid-gap: 10px;
+        grid-template-columns: 100px 2fr 20%;
+      }
+    </style>
+    <div id="grid-container">
+      <div id="grid"></div>
+    </div>
+  )HTML");
+  Element* grid = GetDocument().getElementById("grid");
+  InspectorCSSCascade cascade(grid, kPseudoIdNone);
+  HeapVector<Member<InspectorCSSMatchedRules>> parent_rules =
+      cascade.ParentRules();
+  Element* grid_container = GetDocument().getElementById("grid-container");
+  // Some rules are coming for UA.
+  EXPECT_EQ(3u, parent_rules.size());
+  // grid_container is the first parent.
+  EXPECT_EQ(grid_container, parent_rules.at(0)->element);
+  // Some rules are coming from UA.
+  EXPECT_EQ(2u, parent_rules.at(0)->matched_rules->size());
+  auto rule = parent_rules.at(0)->matched_rules->at(1);
+  EXPECT_EQ(
+      "#grid-container { display: inline-grid; gap: 5px; "
+      "grid-template-columns: 50px 1fr 10%; }",
+      rule.first->cssText());
+}
+
 }  // namespace blink