Bug 1509465 [wpt PR 14201] - CSS: WPT for :first-child :last-child, a=testonly
☠☠ backed out by fb94ec981a7d ☠ ☠
authorEric Willigers <ericwilligers@chromium.org>
Fri, 30 Nov 2018 18:01:52 +0000
changeset 449789 f1d03b49d1d6cef7224942665761fbd4d7b15059
parent 449788 b8c86bd9d68efa87e3e72df40f9dff7a8df3f9a8
child 449790 f9c3cf504b7a16feffd79936df3d5daecea883a4
push id110426
push userwptsync@mozilla.com
push dateTue, 11 Dec 2018 03:07:11 +0000
treeherdermozilla-inbound@fcd0236d7afa [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1509465, 14201, 1348873, 610696
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1509465 [wpt PR 14201] - CSS: WPT for :first-child :last-child, a=testonly Automatic update from web-platform-tests CSS: WPT for :first-child :last-child Promote our :first-child :last-child invalidation layout test to WPT. https://drafts.csswg.org/selectors-4/#the-first-child-pseudo Change-Id: I3c2e1af82ef2dac58ec5bfe642b156289457bb22 Reviewed-on: https://chromium-review.googlesource.com/c/1348873 Reviewed-by: Rune Lillesveen <futhark@chromium.org> Commit-Queue: Eric Willigers <ericwilligers@chromium.org> Cr-Commit-Position: refs/heads/master@{#610696} -- wpt-commits: 732cc9161d1302127fd4b99a50c13bdff7e253ce wpt-pr: 14201
testing/web-platform/tests/css/selectors/invalidation/first-child-last-child.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/selectors/invalidation/first-child-last-child.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>CSS Selectors Invalidation: :first-child :last-child</title>
+    <link rel="help" href="https://drafts.csswg.org/selectors-4/#the-first-child-pseudo">
+    <meta name="assert" content="This tests that the :first-child and :last-child selectors are effective">
+    <script src="/resources/testharness.js"></script>
+    <script src="/resources/testharnessreport.js"></script>
+    <style>
+      div {
+        color: black;
+      }
+      span:first-child {
+        color: blue;
+      }
+      span:last-child {
+        color: red;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="target"><span>first-initially</span><span>last-initially</span></div>
+    <script>
+
+'use strict';
+const black = 'rgb(0, 0, 0)';
+const blue = 'rgb(0, 0, 255)';
+const red = 'rgb(255, 0, 0)';
+
+test(() => {
+  const target = document.querySelector('#target');
+  const first = target.firstChild;
+  assert_equals(getComputedStyle(first).color, blue);
+  target.insertAdjacentHTML('afterbegin', '\n<span>foo</span><span>bar</span>');
+  assert_equals(getComputedStyle(target.firstElementChild).color, blue);
+  assert_equals(getComputedStyle(first).color, black);
+  while (target.firstElementChild !== first)
+    target.removeChild(target.firstElementChild);
+  assert_equals(getComputedStyle(first).color, blue);
+}, 'Adding multiple nodes at once should invalidate :first-child correctly.');
+
+test(() => {
+  const target = document.querySelector('#target');
+  const last = target.lastChild;
+  assert_equals(getComputedStyle(last).color, red);
+  target.insertAdjacentHTML('beforeend', '\n<span>foo</span><span>bar</span>');
+  assert_equals(getComputedStyle(target.lastChild).color, red);
+  assert_equals(getComputedStyle(last).color, black);
+  while (target.lastChild !== last)
+    target.removeChild(target.lastChild);
+  assert_equals(getComputedStyle(last).color, red);
+}, 'Adding multiple nodes at once should invalidate :last-child correctly.');
+
+    </script>
+  </body>
+</html>