jgraham · jgraham · Jan 16, 2018 · Jan 16, 2018 · Jan 16, 2018 · Jan 16, 2018
diff --git a/.taskcluster.yml b/.taskcluster.yml
diff --git a/css/css-align/content-distribution/place-content-shorthand-002.html b/css/css-align/content-distribution/place-content-shorthand-002.html
@@ -8,9 +8,9 @@
 <script src="../resources/alignment-parsing-utils.js"></script>
 <div id="log"></div>
 <script>
-    var values = ["normal"].concat(contentPositionValues, distributionValues, baselineValues);
-    values.forEach(function(alignValue) {
-        values.forEach(function(justifyValue) {
+    var values = ["normal"].concat(contentPositionValues, distributionValues);
+    baselineValues.concat(values).forEach(function(alignValue) {
+        ["left", "right"].concat(values).forEach(function(justifyValue) {
            test(function() {
                checkPlaceShorhandLonghands("place-content", "align-content", "justify-content", alignValue, justifyValue);
            }, "Checking place-content: " + alignValue + " " + justifyValue);

diff --git a/css/css-align/content-distribution/place-content-shorthand-007-ref.html b/css/css-align/content-distribution/place-content-shorthand-007-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test Reference</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<style>
+div {
+  width: 400px;
+  height: 400px;
+  background: blue;
+  position: relative;
+}
+span {
+  background: green;
+  width: 200px;
+  height: 200px;
+  position: absolute;
+  bottom: 0;
+  left: 100px;
+}
+</style>
+Should see a green square centered and at the bottom of the blue square.
+<div><span></span></div>
diff --git a/css/css-align/content-distribution/place-content-shorthand-007.html b/css/css-align/content-distribution/place-content-shorthand-007.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Box Alignment: place-content shorthand with fallback</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://drafts.csswg.org/css-align/#propdef-place-content">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1430622">
+<link rel="match" href="place-content-shorthand-007-ref.html">
+<style>
+div {
+  display: grid;
+  grid: 200px / 200px;
+  width: 400px;
+  height: 400px;
+  background: blue;
+  place-content: end space-evenly;
+}
+span {
+  background: green;
+}
+</style>
+Should see a green square centered and at the bottom of the blue square.
+<div><span></span></div>
diff --git a/css/css-align/resources/alignment-parsing-utils.js b/css/css-align/resources/alignment-parsing-utils.js
@@ -1,5 +1,5 @@
-var selfPositionValues = [ "start", "end", "self-start", "self-end", "left", "right", "center", "flex-start", "flex-end"];
-var contentPositionValues = [ "start", "end", "left", "right", "center", "flex-start", "flex-end"];
+var selfPositionValues = [ "start", "end", "self-start", "self-end", "center", "flex-start", "flex-end"];
+var contentPositionValues = [ "start", "end", "center", "flex-start", "flex-end"];
 var distributionValues = [ "stretch", "space-around", "space-between", "space-evenly"];
 var baselineValues = [ "baseline", "first baseline", "last baseline"];
 
@@ -33,6 +33,10 @@ function checkPlaceShorhandLonghands(shorthand, alignLonghand, justifyLonghand,
     var div = document.createElement("div");
     div.setAttribute("style", shorthand + ": " + alignValue + " " + justifyValue);
     document.body.appendChild(div);
+    if (alignValue === "first baseline")
+        alignValue = "baseline";
+    if (justifyValue === "first baseline")
+        justifyValue = "baseline";
     if (justifyValue === "")
         justifyValue = alignValue;
     assert_equals(div.style[alignLonghand],

diff --git a/css/css-align/self-alignment/place-self-shorthand-002.html b/css/css-align/self-alignment/place-self-shorthand-002.html
@@ -8,9 +8,9 @@
 <script src="../resources/alignment-parsing-utils.js"></script>
 <div id="log"></div>
 <script>
-    var values = ["auto", "normal", "stretch"].concat(selfPositionValues, baselineValues);
-    values.forEach(function(alignValue) {
-        values.forEach(function(justifyValue) {
+    var values = ["auto", "normal", "stretch"].concat(selfPositionValues);
+    baselineValues.concat(values).forEach(function(alignValue) {
+        values.concat(["left", "right"]).forEach(function(justifyValue) {
             test(function() {
                 checkPlaceShorhandLonghands("place-self", "align-self", "justify-self", alignValue, justifyValue);
             }, "Checking place-self: " + alignValue + " " + justifyValue);

diff --git a/css/css-align/self-alignment/place-self-shorthand-006.html b/css/css-align/self-alignment/place-self-shorthand-006.html
@@ -8,9 +8,9 @@
 <script src="../resources/alignment-parsing-utils.js"></script>
 <div id="log"></div>
 <script>
-    var values = ["auto", "normal", "stretch"].concat(selfPositionValues, baselineValues);
-    values.forEach(function(alignValue) {
-        [""].concat(values).forEach(function(justifyValue) {
+    var values = ["auto", "normal", "stretch"].concat(selfPositionValues);
+    values.concat(baselineValues).forEach(function(alignValue) {
+        ["left", "right"].concat(values).forEach(function(justifyValue) {
             var value = (alignValue + " " + justifyValue).trim();
             test(function() {
                 checkPlaceShorhand("place-self", alignValue, justifyValue)

diff --git a/css/css-scoping/slotted-invalidation.html b/css/css-scoping/slotted-invalidation.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<title>CSS Test: Style invalidation for ::slotted()</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://drafts.csswg.org/css-scoping/#slotted-pseudo">
+<div id="host">
+  <div>
+    <span></span>
+    <span></span>
+  </div>
+  <div id="slotted">
+    <span></span>
+    <span></span>
+  </div>
+  <div>
+    <span></span>
+    <span></span>
+  </div>
+</div>
+<script>
+test(function() {
+  var root = host.attachShadow({"mode":"open"});
+  root.innerHTML = '<style>.outer ::slotted(#slotted) { background-color: red } .outer .inner::slotted(#slotted) { background-color: green }</style><div id="outer"><slot id="inner"></slot></div>';
+
+  assert_equals(window.getComputedStyle(slotted).backgroundColor, "rgba(0, 0, 0, 0)");
+
+  root.querySelector("#outer").className = "outer";
+  assert_equals(window.getComputedStyle(slotted).backgroundColor, "rgb(255, 0, 0)");
+
+  root.querySelector("#inner").className = "inner";
+  assert_equals(window.getComputedStyle(slotted).backgroundColor, "rgb(0, 128, 0)");
+})
+</script>
diff --git a/css/css-text/astral-bidi/adlam-anti-ref.html b/css/css-text/astral-bidi/adlam-anti-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Adlam</title>
+    <link href="support/adlam.css" rel="stylesheet">
+    <link href="adlam.html" rel="mismatch">
+</head>
+<body>
+<p><bdo dir="ltr">𞤀𞤁𞤂𞤁𞤄</bdo></p>
+<p>U+1E900 U+1E901 U+1E902 U+1E901 U+1E904</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/adlam-ref.html b/css/css-text/astral-bidi/adlam-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Adlam</title>
+    <link href="support/adlam.css" rel="stylesheet">
+</head>
+<body>
+<p><bdo dir="rtl">𞤀𞤁𞤂𞤁𞤄</bdo></p>
+<p>U+1E900 U+1E901 U+1E902 U+1E901 U+1E904</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/adlam.html b/css/css-text/astral-bidi/adlam.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Adlam</title>
+    <link href="support/adlam.css" rel="stylesheet">
+    <link href="adlam-ref.html" rel="match">
+    <link href="https://www.unicode.org/roadmaps/smp/" rel="help">
+    <meta name="assert" content="Upper astral RTL range is treated as RTL.">
+</head>
+<body>
+<p>𞤀𞤁𞤂𞤁𞤄</p>
+<p>U+1E900 U+1E901 U+1E902 U+1E901 U+1E904</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/cypriot-anti-ref.html b/css/css-text/astral-bidi/cypriot-anti-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Cypriot</title>
+    <link href="support/cypriot.css" rel="stylesheet">
+    <link href="cypriot.html" rel="mismatch">
+</head>
+<body>
+<p><bdo dir="ltr">𐠀𐠰𐠦𐠡𐠩</bdo></p>
+<p>U+10800 U+10830 U+10826 U+10821 U+10829</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/cypriot-ref.html b/css/css-text/astral-bidi/cypriot-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Cypriot</title>
+    <link href="support/cypriot.css" rel="stylesheet">
+</head>
+<body>
+<p><bdo dir="rtl">𐠀𐠰𐠦𐠡𐠩</bdo></p>
+<p>U+10800 U+10830 U+10826 U+10821 U+10829</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/cypriot.html b/css/css-text/astral-bidi/cypriot.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>Cypriot</title>
+    <link href="support/cypriot.css" rel="stylesheet">
+    <link href="cypriot-ref.html" rel="match">
+    <link href="https://www.unicode.org/roadmaps/smp/" rel="help">
+    <meta name="assert" content="Lower astral RTL range is treated as RTL.">
+</head>
+<body>
+<p>𐠀𐠰𐠦𐠡𐠩</p>
+<p>U+10800 U+10830 U+10826 U+10821 U+10829</p>
+</body>
+</html>
diff --git a/css/css-text/astral-bidi/support/adlam.css b/css/css-text/astral-bidi/support/adlam.css
@@ -0,0 +1,9 @@
+@font-face {
+    font-family: "Noto Sans Adlam";
+    font-weight: normal;
+    font-style: normal;
+    src: url("../../../fonts/noto/NotoSansAdlam-hinted/NotoSansAdlam-Regular.ttf") format("truetype");
+}
+p {
+    font-family: "Noto Sans Adlam";
+}
diff --git a/css/css-text/astral-bidi/support/cypriot.css b/css/css-text/astral-bidi/support/cypriot.css
@@ -0,0 +1,9 @@
+@font-face {
+    font-family: "Noto Sans Cypriot";
+    font-weight: normal;
+    font-style: normal;
+    src: url("../../../fonts/noto/NotoSansCypriot-hinted/NotoSansCypriot-Regular.ttf") format("truetype");
+}
+p {
+    font-family: "Noto Sans Cypriot";
+}
diff --git a/css/css-values/calc-ch-ex-lang-ref.html b/css/css-values/calc-ch-ex-lang-ref.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Test Reference</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<style>
+div {
+  width: calc(1ex + 1ch + 1em);
+  height: calc(1ex + 1ch + 1em);
+  background: green;
+}
+</style>
+<div></div>
diff --git a/css/css-values/calc-ch-ex-lang.html b/css/css-values/calc-ch-ex-lang.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Test: Calc in font-size with ch / ex units across lang changes</title>
+<link rel="help" href="https://drafts.csswg.org/css-values/#ch">
+<link rel="help" href="https://drafts.csswg.org/css-values/#ex">
+<link rel="help" href="https://drafts.csswg.org/css-values/#funcdef-calc">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1431031">
+<link rel="match" href="calc-ch-ex-lang-ref.html">
+<style>
+div[lang] {
+  font-size: calc(1ex + 1ch + 1em);
+}
+</style>
+<div lang="en">
+  <div style="width: 1em; height: 1em; background: green;"></div>
+</div>
diff --git a/css/css-values/calc-rem-lang-ref.html b/css/css-values/calc-rem-lang-ref.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Test Reference</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<p>You should see a green box twice-the-initial-font-size wide.</p>
+<div style="width: 2em; height: 2em; background: green;"></div>
diff --git a/css/css-values/calc-rem-lang.html b/css/css-values/calc-rem-lang.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en"><!-- The lang is important! -->
+<meta charset="utf-8">
+<title>CSS Test: Calc with rem and relative units on the root element</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://drafts.csswg.org/css-values/#rem">
+<link rel="help" href="https://drafts.csswg.org/css-values/#funcdef-calc">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1431031">
+<link rel="match" href="calc-rem-lang-ref.html">
+<style>
+  html {
+    font-size: calc(1rem + 1em);
+  }
+</style>
+<p style="font-size: initial">You should see a green box twice-the-initial-font-size wide.</p>
+<div style="width: 1em; height: 1em; background: green;"></div>
+</html>
diff --git a/css/cssom-view/elementFromPoint-dynamic-anon-box.html b/css/cssom-view/elementFromPoint-dynamic-anon-box.html
@@ -0,0 +1,44 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Test: Hit testing on element previously hidden by an anonymous scroll box</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1433591">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+html, body {
+  margin: 0;
+  padding: 0;
+}
+/*
+  Create a hidden scrollbox that occupies the whole viewport, then give it
+  visibility: hidden dynamically. The link previously under the scrollbox
+  should be clickable.
+ */
+.scrollable {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  overflow: scroll;
+}
+
+.scrollable .inner {
+  display: table-cell;
+  width: 100vw;
+  height: 100vh;
+}
+</style>
+<div class="scrollable">
+  <div class="inner"></div>
+</div>
+<a href="#">Should be clickable</a>
+<script>
+test(function() {
+  assert_equals(document.elementFromPoint(10, 10).tagName, "DIV",
+                "Should hit the scrollbox contents");
+  document.querySelector('div').style.visibility = "hidden";
+  assert_equals(document.elementFromPoint(10, 10), document.querySelector('a'));
+}, "Link should be clickable after hiding a scrollbox with an anonymous table inside");
+</script>