1 // Copyright 2020 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file.
4
5 #include "third_party/blink/renderer/core/inspector/inspector_style_resolver.h"
6
7 #include "testing/gtest/include/gtest/gtest.h"
8 #include "third_party/blink/renderer/core/css/css_value.h"
9 #include "third_party/blink/renderer/core/css/css_value_list.h"
10 #include "third_party/blink/renderer/core/css/style_engine.h"
11 #include "third_party/blink/renderer/core/html/html_element.h"
12 #include "third_party/blink/renderer/core/style/computed_style_constants.h"
13 #include "third_party/blink/renderer/core/testing/dummy_page_holder.h"
14
15 namespace blink {
16
17 class InspectorStyleResolverTest : public testing::Test {
18 protected:
19 void SetUp() override;
20
GetDocument()21 Document& GetDocument() { return dummy_page_holder_->GetDocument(); }
22
23 private:
24 std::unique_ptr<DummyPageHolder> dummy_page_holder_;
25 };
26
SetUp()27 void InspectorStyleResolverTest::SetUp() {
28 dummy_page_holder_ = std::make_unique<DummyPageHolder>(IntSize(800, 600));
29 }
30
TEST_F(InspectorStyleResolverTest,DirectlyMatchedRules)31 TEST_F(InspectorStyleResolverTest, DirectlyMatchedRules) {
32 GetDocument().body()->setInnerHTML(R"HTML(
33 <style>
34 #grid {
35 display: grid;
36 grid-gap: 10px;
37 grid-template-columns: 100px 1fr 20%;
38 }
39 </style>
40 <div id="grid">
41 </div>
42 )HTML");
43 Element* grid = GetDocument().getElementById("grid");
44 InspectorStyleResolver resolver(grid, kPseudoIdNone);
45 RuleIndexList* matched_rules = resolver.MatchedRules();
46 // Some rules are coming for UA.
47 EXPECT_EQ(2u, matched_rules->size());
48 auto rule = matched_rules->at(1);
49 EXPECT_EQ(
50 "#grid { display: grid; gap: 10px; grid-template-columns: 100px 1fr 20%; "
51 "}",
52 rule.first->cssText());
53 }
54
TEST_F(InspectorStyleResolverTest,ParentRules)55 TEST_F(InspectorStyleResolverTest, ParentRules) {
56 GetDocument().body()->setInnerHTML(R"HTML(
57 <style>
58 #grid-container {
59 display: inline-grid;
60 grid-gap: 5px;
61 grid-template-columns: 50px 1fr 10%;
62 }
63 #grid {
64 display: grid;
65 grid-gap: 10px;
66 grid-template-columns: 100px 2fr 20%;
67 }
68 </style>
69 <div id="grid-container">
70 <div id="grid"></div>
71 </div>
72 )HTML");
73 Element* grid = GetDocument().getElementById("grid");
74 InspectorStyleResolver resolver(grid, kPseudoIdNone);
75 HeapVector<Member<InspectorCSSMatchedRules>> parent_rules =
76 resolver.ParentRules();
77 Element* grid_container = GetDocument().getElementById("grid-container");
78 // Some rules are coming for UA.
79 EXPECT_EQ(3u, parent_rules.size());
80 // grid_container is the first parent.
81 EXPECT_EQ(grid_container, parent_rules.at(0)->element);
82 // Some rules are coming from UA.
83 EXPECT_EQ(2u, parent_rules.at(0)->matched_rules->size());
84 auto rule = parent_rules.at(0)->matched_rules->at(1);
85 EXPECT_EQ(
86 "#grid-container { display: inline-grid; gap: 5px; "
87 "grid-template-columns: 50px 1fr 10%; }",
88 rule.first->cssText());
89 }
90
91 } // namespace blink
92