Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(12)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/inspector-protocol/css/cssom-matching-rules.html

Issue 1211813002: DevTools: allow injecting CSS rules without breaking styles sidebar. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « LayoutTests/http/tests/inspector-protocol/resources/protocol-test.html ('k') | LayoutTests/inspector-protocol/css/cssom-matching-rules-expected.txt » ('j') | Source/core/css/parser/CSSParser.h » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <html>
2 <head>
3
4 <style>
5 #modifyRule {
6 box-sizing: border-box;
7 }
8
9 #modifyRule {
10 height: 100%;
11 }
12
13 #modifyRule {
14 width: 100%;
15 }
16 </style>
17
18 <style>
19 #insertRule {
20 box-sizing: border-box;
21 }
22
23 #insertRule {
24 width: 100%;
25 }
26 </style>
27
28 <style>
29 #removeRule {
30 box-sizing: border-box;
31 }
32
33 #removeRule {
34 width: 100%;
35 }
36 </style>
37
38 <script type="text/javascript" src="../../http/tests/inspector-protocol/inspecto r-protocol-test.js"></script>
39 <script type="text/javascript" src="../../http/tests/inspector-protocol/css-prot ocol-test.js"></script>
40 <script type="text/javascript" src="../../http/tests/inspector-protocol/dom-prot ocol-test.js"></script>
41 <script type="text/javascript">
42
43 function test()
44 {
45 var documentNodeId;
46 var styleSheetIds = [];
47
48 InspectorTest.requestDocumentNodeId(onDocumentNodeId);
49
50 function onDocumentNodeId(nodeId)
51 {
52 documentNodeId = nodeId;
53 InspectorTest.eventHandler["CSS.styleSheetAdded"] = styleSheetAdded;
54 InspectorTest.sendCommandOrDie("CSS.enable", {}, function() {
55 InspectorTest.runTestSuite(testSuite);
56 });
57 }
58
59 function styleSheetAdded(result)
60 {
61 styleSheetIds.push(result.params.header.styleSheetId);
62 }
63
64 function dumpAndNext(next)
65 {
66 return InspectorTest.loadAndDumpMatchingRules.bind(InspectorTest, docume ntNodeId, "#test", InspectorTest.undoAndNext(next));
67 }
68
69 var testSuite = [
70 function testModifyRule(next)
71 {
72 InspectorTest.log("--------------");
73 InspectorTest.log("Original rule:");
74 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyRule" , step1, true);
75
76 function step1()
77 {
78 InspectorTest.evaluateInPage("document.styleSheets[0].rules[0].s tyle.setProperty('color', 'red')");
79 InspectorTest.log("--------------");
80 InspectorTest.log("Modified rule 1:");
81 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyR ule", step2, true);
82 }
83
84 function step2()
85 {
86 InspectorTest.evaluateInPage("document.styleSheets[0].rules[2].s tyle.setProperty('color', 'blue')");
87 InspectorTest.log("---------------");
88 InspectorTest.log("Modified rule 3:");
89 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyR ule", step3, true);
90 }
91
92 function step3()
93 {
94 InspectorTest.evaluateInPage("document.styleSheets[0].rules[1].s tyle.setProperty('color', 'green')");
95 InspectorTest.log("---------------");
96 InspectorTest.log("Modified rule 2:");
97 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyR ule", step4, true);
98 }
99
100 function step4()
101 {
102 InspectorTest.evaluateInPage("document.styleSheets[0].rules[1].s tyle.removeProperty('color')");
103 InspectorTest.log("---------------");
104 InspectorTest.log("Restored rule 2:");
105 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyR ule", step5, true);
106 }
107
108 function step5()
109 {
110 InspectorTest.evaluateInPage("document.styleSheets[0].rules[0].s tyle.removeProperty('color')");
111 InspectorTest.evaluateInPage("document.styleSheets[0].rules[2].s tyle.removeProperty('color')");
112 InspectorTest.log("-----------------");
113 InspectorTest.log("Restored rule 1,3:");
114 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#modifyR ule", next, true);
115 }
116 },
117
118 function testInsertFirstRule(next)
119 {
120 testInsertRule(0, next)
121 },
122
123 function testInsertMiddleRule(next)
124 {
125 testInsertRule(1, next)
126 },
127
128 function testInsertLastRule(next)
129 {
130 testInsertRule(2, next)
131 },
132
133 function testRemoveRule(next)
134 {
135 InspectorTest.log("Original rule:");
136 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#removeRule" , step1, true);
137
138 function step1()
139 {
140 InspectorTest.evaluateInPage("document.styleSheets[2].removeRule (0)");
141 InspectorTest.log("-------------------");
142 InspectorTest.log("After remove rule 1:");
143 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#removeR ule", step2, true);
144 }
145
146 function step2()
147 {
148 InspectorTest.evaluateInPage("document.styleSheets[2].removeRule (0)");
149 InspectorTest.log("-------------------");
150 InspectorTest.log("After remove rule 2:");
151 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#removeR ule", next, true);
152 }
153 }
154
155 ];
156
157 function testInsertRule(index, next)
158 {
159 InspectorTest.log("Original rule:");
160 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#insertRule", st ep1, true);
161
162 function step1()
163 {
164 InspectorTest.evaluateInPage("document.styleSheets[1].insertRule('#i nsertRule { color: red }', " + index + ")");
165 InspectorTest.log("--------------");
166 InspectorTest.log("After inserted rule:");
167 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#insertRule" , step2, true);
168 }
169
170 function step2()
171 {
172 InspectorTest.evaluateInPage("document.styleSheets[1].removeRule(" + index + ")");
173 InspectorTest.log("--------------");
174 InspectorTest.log("Restored rule:");
175 InspectorTest.loadAndDumpMatchingRules(documentNodeId, "#insertRule" , next, true);
176 }
177 }
178 }
179
180 </script>
181 </head>
182 <body onload="runTest();">
183 <p>The test verifies CSS.getMatchedStylesForNode when used concurrently with the CSSOM modifications.</p>
184 <article id="modifyRule"></article>
185 <article id="insertRule"></article>
186 <article id="removeRule"></article>
187 </body>
188 </html>
OLDNEW
« no previous file with comments | « LayoutTests/http/tests/inspector-protocol/resources/protocol-test.html ('k') | LayoutTests/inspector-protocol/css/cssom-matching-rules-expected.txt » ('j') | Source/core/css/parser/CSSParser.h » ('J')

Powered by Google App Engine
This is Rietveld 408576698