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

Unified Diff: third_party/WebKit/LayoutTests/fast/css/invalidation/first-last-only-child.html

Issue 2229503002: Style invalidation support for :first/last/only-child. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fixed review issue Created 4 years, 4 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/css/RuleFeature.cpp » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/LayoutTests/fast/css/invalidation/first-last-only-child.html
diff --git a/third_party/WebKit/LayoutTests/fast/css/invalidation/first-last-only-child.html b/third_party/WebKit/LayoutTests/fast/css/invalidation/first-last-only-child.html
new file mode 100644
index 0000000000000000000000000000000000000000..6addd87c8240b7fb3362f3a0973088db54d068b7
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/css/invalidation/first-last-only-child.html
@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+<script src="../../../resources/testharness.js"></script>
+<script src="../../../resources/testharnessreport.js"></script>
+<style>
+ #first_child:first-child,
+ #first_child:first-child #first_child_inner,
+ #last_child:last-child,
+ #last_child:last-child #last_child_inner,
+ #only_child:only-child,
+ #only_child:only-child #only_child_inner {
+ background-color: green
+ }
+
+ span:first-child {
+ color: green;
+ }
+</style>
+<div>
+ <div id="first_child">
+ <div></div>
+ <div></div>
+ <div id="first_child_inner"></div>
+ <div></div>
+ </div>
+</div>
+<div>
+ <div id="last_child">
+ <div></div>
+ <div></div>
+ <div id="last_child_inner"></div>
+ <div></div>
+ </div>
+</div>
+<div>
+ <div id="only_child">
+ <div></div>
+ <div></div>
+ <div id="only_child_inner"></div>
+ <div></div>
+ </div>
+</div>
+
+<div>
+ <span></span>
+ XXX
+ <span id="after_text_node"></span>
+</div>
+
+<script>
+ function backgroundIsGreen(element) {
+ assert_equals(getComputedStyle(element).backgroundColor, "rgb(0, 128, 0)");
+ }
+
+ function backgroundIsTransparent(element) {
+ assert_equals(getComputedStyle(element).backgroundColor, "rgba(0, 0, 0, 0)");
+ }
+
+ test(() => {
+ backgroundIsGreen(first_child);
+ backgroundIsGreen(first_child_inner);
+ backgroundIsGreen(last_child);
+ backgroundIsGreen(last_child_inner);
+ backgroundIsGreen(only_child);
+ backgroundIsGreen(only_child_inner);
+ }, "Check initial computed styles");
+
+ var div = document.createElement("div");
+
+ test(() => {
+ first_child.offsetTop;
+ first_child.parentNode.insertBefore(div, first_child);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);
+ backgroundIsTransparent(first_child);
+ backgroundIsTransparent(first_child_inner);
+ }, "Insert element before first child.");
+
+ test(() => {
+ first_child.offsetTop;
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);
+ backgroundIsGreen(first_child);
+ backgroundIsGreen(first_child_inner);
+ }, "Remove first child.");
+
+ test(() => {
+ last_child.offsetTop;
+ last_child.parentNode.insertBefore(div, null);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);
+ backgroundIsTransparent(last_child);
+ backgroundIsTransparent(last_child_inner);
+ }, "Insert element before after last child.");
+
+ test(() => {
+ last_child.offsetTop;
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);
+ backgroundIsGreen(last_child);
+ backgroundIsGreen(last_child_inner);
+ }, "Remove last child.");
+
+ test(() => {
+ only_child.offsetTop;
+ only_child.parentNode.insertBefore(div, only_child);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);
+ backgroundIsTransparent(only_child);
+ backgroundIsTransparent(only_child_inner);
+ }, "Insert element before only child.");
+
+ test(() => {
+ only_child.offsetTop;
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);
+ backgroundIsGreen(only_child);
+ backgroundIsGreen(only_child_inner);
+ }, "Remove element before only child.");
+
+ test(() => {
+ only_child.offsetTop;
+ only_child.parentNode.insertBefore(div, null);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);
+ backgroundIsTransparent(only_child);
+ backgroundIsTransparent(only_child_inner);
+ }, "Insert element after only child.");
+
+ test(() => {
+ only_child.offsetTop;
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);
+ backgroundIsGreen(only_child);
+ backgroundIsGreen(only_child_inner);
+ }, "Remove element after only child.");
+
+ test(() => {
+ first_child.offsetTop;
+ first_child.parentNode.insertBefore(div, null);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1);
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 0);
+ }, "No first-child mutation.");
+
+ test(() => {
+ last_child.offsetTop;
+ last_child.parentNode.insertBefore(div, last_child);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1);
+ div.remove();
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 0);
+ }, "No last-child mutation.");
+
+ test(() => {
+ document.body.offsetTop;
+ after_text_node.parentNode.insertBefore(div, after_text_node);
+ if (window.internals)
+ assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1);
+ }, "Inserting sibling before text-node should not update for :first-child if text-node has element predecessor.");
+
+</script>
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/css/RuleFeature.cpp » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698