Index: LayoutTests/fast/css/invalidation/scrollbar-pseudo-classes.html |
diff --git a/LayoutTests/fast/css/invalidation/scrollbar-pseudo-classes.html b/LayoutTests/fast/css/invalidation/scrollbar-pseudo-classes.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..f29db013b3dc92b90ae370cb30ae99448025539d |
--- /dev/null |
+++ b/LayoutTests/fast/css/invalidation/scrollbar-pseudo-classes.html |
@@ -0,0 +1,113 @@ |
+<!DOCTYPE html> |
+<style> |
+.scroller { |
+ width: 100px; |
+ height: 30px; |
+ overflow: scroll; |
+} |
+.scroller::-webkit-scrollbar { |
+ width: 10px; |
+ height: 10px; |
+} |
+ |
+#t1 .scroller::-webkit-scrollbar:corner-present { background-color: red; } |
+#t1.t1 .scroller::-webkit-scrollbar:corner-present { background-color: green; } |
+ |
+#t2 .scroller::-webkit-scrollbar-button:decrement { background-color: red; } |
+#t2.t2 .scroller::-webkit-scrollbar-button:decrement { background-color: green; } |
+ |
+#t3 .scroller::-webkit-scrollbar-button:increment { background-color: red; } |
+#t3.t3 .scroller::-webkit-scrollbar-button:increment { background-color: green; } |
+ |
+#t4 .scroller::-webkit-scrollbar:horizontal { background-color: red; } |
+#t4.t4 .scroller::-webkit-scrollbar:horizontal { background-color: green; } |
+ |
+#t5 .scroller::-webkit-scrollbar:vertical { background-color: red; } |
+#t5.t5 .scroller::-webkit-scrollbar:vertical { background-color: green; } |
+ |
+#t6 .scroller::-webkit-scrollbar-button:start { background-color: red; } |
+#t6.t6 .scroller::-webkit-scrollbar-button:start { background-color: green; } |
+ |
+#t7 .scroller::-webkit-scrollbar-button:end { background-color: red; } |
+#t7.t7 .scroller::-webkit-scrollbar-button:end { background-color: green; } |
+ |
+#t8 .scroller::-webkit-scrollbar-button:single-button { background-color: red; } |
+#t8.t8 .scroller::-webkit-scrollbar-button:single-button { background-color: green; } |
+#t8 .scroller::-webkit-scrollbar-button:double-button { background-color: red; } |
+#t8.t8 .scroller::-webkit-scrollbar-button:double-button { background-color: green; } |
+ |
+</style> |
+<div id="t1"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t2"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t3"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t4"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t5"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t6"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t7"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<div id="t8"> |
+ <div> |
+ <div class="scroller">FAIL</div> |
+ </div> |
+ <div></div><div></div><div></div><div></div><div></div><div></div><div></div> |
+</div> |
+<script> |
+function invalidateScroller(testId, expectedCount) { |
+ var testElement = document.getElementById(testId); |
+ var scroller = testElement.querySelector(".scroller"); |
+ testElement.offsetTop; // Force recalc; |
+ testElement.className = testId; |
+ if (window.internals) { |
+ var count = internals.updateStyleAndReturnAffectedElementCount(); |
+ if (count == expectedCount) |
+ scroller.innerText = "PASS"; |
+ else |
+ scroller.innerText = "FAIL: "+count; |
+ } |
+} |
+ |
+// Invalidation counts are 2 (#t<n> and .scroller) plus pseudo elements |
+ |
+invalidateScroller("t1", 4); // pseudo count 2: 2 bars |
+invalidateScroller("t2", 8); // pseudo count 6: 2 bars + 4 buttons |
+invalidateScroller("t3", 8); // pseudo count 6: 2 bars + 4 buttons |
+invalidateScroller("t4", 4); // pseudo count 6: 2 bars + 4 buttons |
+invalidateScroller("t5", 4); // pseudo count 2: 2 bars |
+invalidateScroller("t6", 8); // pseudo count 6: 2 bars + 4 buttons |
+invalidateScroller("t7", 8); // pseudo count 6: 2 bars + 4 buttons |
+invalidateScroller("t8", 8); // pseudo count 6: 2 bars + 4 buttons |
+</script> |