Update web-platform-tests to revision 68a256f49be380ca4add535ce8ece9de28820e6b

tests/wpt/metadata/2dcontext/imagebitmap/createImageBitmap-drawImage.html.ini

@@ -75,3 +75,108 @@
   [createImageBitmap from a vector SVGImageElement with negative sw/sh, and drawImage on the created ImageBitmap]
     expected: FAIL
 
+  [createImageBitmap from an HTMLCanvasElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLCanvasElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLCanvasElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement from a data URL, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement from a data URL scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement from a data URL scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement from a data URL resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an HTMLVideoElement from a data URL with negative sw/sh, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap HTMLImageElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap HTMLImageElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap HTMLImageElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector HTMLImageElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector HTMLImageElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector HTMLImageElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap SVGImageElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap SVGImageElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a bitmap SVGImageElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector SVGImageElement scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector SVGImageElement scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a vector SVGImageElement resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an OffscreenCanvas scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an OffscreenCanvas scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an OffscreenCanvas resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageData scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageData scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageData resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageBitmap scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageBitmap scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from an ImageBitmap resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a Blob scaled down, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a Blob scaled up, and drawImage on the created ImageBitmap]
+    expected: FAIL
+
+  [createImageBitmap from a Blob resized, and drawImage on the created ImageBitmap]
+    expected: FAIL
+

tests/wpt/metadata/2dcontext/imagebitmap/createImageBitmap-invalid-args.html.ini

@@ -194,16 +194,16 @@
     expected: FAIL
 
   [createImageBitmap with a a vector HTMLImageElement source and sw set to 0]
-    expected: TIMEOUT
+    expected: FAIL
 
   [createImageBitmap with a a vector HTMLImageElement source and sh set to 0]
-    expected: NOTRUN
+    expected: FAIL
 
   [createImageBitmap with a a vector HTMLImageElement source and oversized (unallocatable) crop region]
-    expected: NOTRUN
+    expected: FAIL
 
   [createImageBitmap with a a bitmap SVGImageElement source and sw set to 0]
-    expected: NOTRUN
+    expected: TIMEOUT
 
   [createImageBitmap with a a bitmap SVGImageElement source and sh set to 0]
     expected: NOTRUN
@@ -238,3 +238,12 @@
   [createImageBitmap with an available but zero width image source.]
     expected: NOTRUN
 
+  [createImageBitmap with a an HTMLVideoElement from a data URL source and sw set to 0]
+    expected: FAIL
+
+  [createImageBitmap with a an HTMLVideoElement from a data URL source and sh set to 0]
+    expected: FAIL
+
+  [createImageBitmap with a an HTMLVideoElement from a data URL source and oversized (unallocatable) crop region]
+    expected: FAIL
+

tests/wpt/metadata/2dcontext/imagebitmap/createImageBitmap-origin.sub.html.ini

@@ -14,3 +14,6 @@
   [unclean ImageBitmap]
     expected: FAIL
 
+  [redirected to cross-origin HTMLVideoElement]
+    expected: FAIL
+

tests/wpt/metadata/FileAPI/reading-data-section/filereader_readAsBinaryString.html.ini

@@ -0,0 +1,4 @@
+[filereader_readAsBinaryString.html]
+  [FileAPI Test: filereader_readAsBinaryString]
+    expected: FAIL
+

tests/wpt/metadata/FileAPI/url/url-in-tags-revoke.window.js.ini

@@ -0,0 +1,8 @@
+[url-in-tags-revoke.window.html]
+  expected: TIMEOUT
+  [Fetching a blob URL immediately before revoking it works in an iframe.]
+    expected: FAIL
+
+  [Fetching a blob URL immediately before revoking it works in <script> tags.]
+    expected: TIMEOUT
+

tests/wpt/metadata/css/css-fonts/font-feature-settings-serialization-001.html.ini

@@ -2,3 +2,6 @@
   [font-feature-settings should have its feature tag serialized with double quotes]
     expected: FAIL
 
+  [font-feature-settings should be serialized with double quotes, and the default value of 1 should be omitted]
+    expected: FAIL
+

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-1.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-1.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-2a.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-2a.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-2b.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-2b.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-2c.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-2c.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-2d.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-2d.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/individual-transform/individual-transform-2e.html.ini

@@ -0,0 +1,2 @@
+[individual-transform-2e.html]
+  expected: FAIL

tests/wpt/metadata/css/css-transforms/transform-transformed-tr-percent-height-child.html.ini

@@ -0,0 +1,2 @@
+[transform-transformed-tr-percent-height-child.html]
+  expected: FAIL

tests/wpt/metadata/css/css-values/vh_not_refreshing_on_chrome.html.ini

@@ -1,2 +0,0 @@
-[vh_not_refreshing_on_chrome.html]
-  expected: FAIL

tests/wpt/metadata/css/selectors/invalidation/matches.html.ini

@@ -8,3 +8,12 @@
   [Invalidate :matches() for compound selector arguments.]
     expected: FAIL
 
+  [Invalidate :matches() for complex selector arguments.]
+    expected: FAIL
+
+  [Invalidate nested :matches().]
+    expected: FAIL
+
+  [Test specificity of :matches().]
+    expected: FAIL
+

tests/wpt/metadata/custom-elements/Document-createElement.html.ini

@@ -0,0 +1,4 @@
+[Document-createElement.html]
+  [document.createElement with unknown "is" value should create "undefined" state element]
+    expected: FAIL
+

tests/wpt/metadata/html/semantics/forms/the-input-element/image-click-form-data.html.ini

@@ -0,0 +1,5 @@
+[image-click-form-data.html]
+  expected: TIMEOUT
+  [Image submit button should not add extra form data if 'value' attribute is present with non-empty value]
+    expected: TIMEOUT
+

tests/wpt/web-platform-tests/.travis.yml

@@ -73,7 +73,7 @@ matrix:
       python: "2.7"
       env:
         - secure: "YTSXPwI0DyCA1GhYrLT9KMEV6b7QQKuEeaQgeFDP38OTzJ1+cIj3CC4SRNqbnJ/6SJwPGcdqSxLuV8m4e5HFFnyCcQnJe6h8EMsTehZ7W3j/fP9UYrJqYqvGpe3Vj3xblO5pwBYmq7sg3jAmmuCgAgOW6VGf7cRMucrsmFeo7VM="
-        - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=sauce:MicrosoftEdge:14.14393 PLATFORM='Windows 10'
+        - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=sauce:MicrosoftEdge:16.16299 PLATFORM='Windows 10'
     - python: 2.7
       env: JOB=tools_unittest TOXENV=py27 HYPOTHESIS_PROFILE=ci SCRIPT=tools/ci/ci_tools_unittest.sh
     - python: 3.6
@@ -97,7 +97,7 @@ matrix:
         - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=chrome:dev
     - env:
         - secure: "YTSXPwI0DyCA1GhYrLT9KMEV6b7QQKuEeaQgeFDP38OTzJ1+cIj3CC4SRNqbnJ/6SJwPGcdqSxLuV8m4e5HFFnyCcQnJe6h8EMsTehZ7W3j/fP9UYrJqYqvGpe3Vj3xblO5pwBYmq7sg3jAmmuCgAgOW6VGf7cRMucrsmFeo7VM="
-        - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=sauce:MicrosoftEdge:14.14393 PLATFORM='Windows 10'
+        - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=sauce:MicrosoftEdge:16.16299 PLATFORM='Windows 10'
     - env:
         - secure: "YTSXPwI0DyCA1GhYrLT9KMEV6b7QQKuEeaQgeFDP38OTzJ1+cIj3CC4SRNqbnJ/6SJwPGcdqSxLuV8m4e5HFFnyCcQnJe6h8EMsTehZ7W3j/fP9UYrJqYqvGpe3Vj3xblO5pwBYmq7sg3jAmmuCgAgOW6VGf7cRMucrsmFeo7VM="
         - JOB=stability SCRIPT=tools/ci/ci_stability.sh PRODUCT=sauce:safari:11.0 PLATFORM='macOS 10.12'

tests/wpt/web-platform-tests/2dcontext/building-paths/canvas_complexshapes_arcto_001-ref.htm

@@ -4,7 +4,6 @@
         <title>HTML5 Canvas Test:  arcTo() adds to subpath if same point</title>
         <link rel="author" title="Microsoft" href="http://www.microsoft.com" />
     </head>
-    lol
     <body>
         <p>Description: If x1,y1 and x2,y2 are the same point, then arcTo must add x1,y1 to the subpath, and connect that point to x0,y0 with a straight line.</p>
         <div><img src="/images/canvas-line.png" alt="line" /></div>

tests/wpt/web-platform-tests/2dcontext/imagebitmap/common.sub.js

@@ -43,13 +43,34 @@ function makeVideo() {
     });
 }
 
+function makeDataUrlVideo() {
+    const toDataUrl = (type, buffer) => {
+        const encoded = btoa(String.fromCodePoint(...new Uint8Array(buffer)));
+        return `data:${type};base64,${encoded}`
+    };
+
+    return fetch(getVideoURI("/images/pattern"))
+        .then(response => Promise.all([response.headers.get("Content-Type"), response.arrayBuffer()]))
+        .then(([type, data]) => {
+            return new Promise(function(resolve, reject) {
+                var video = document.createElement("video");
+                video.oncanplaythrough = function() {
+                    resolve(video);
+                };
+                video.onerror = reject;
+                video.src = toDataUrl(type, data);
+            });
+        });
+}
+
 function makeMakeHTMLImage(src) {
     return function() {
-        return new Promise(resolve => {
+        return new Promise((resolve, reject) => {
             var img = new Image();
             img.onload = function() {
                 resolve(img);
             };
+            img.onerror = reject;
             img.src = src;
         });
     }
@@ -115,6 +136,7 @@ function makeBlob() {
 var imageSourceTypes = [
     { name: 'an HTMLCanvasElement', factory: makeCanvas },
     { name: 'an HTMLVideoElement',  factory: makeVideo },
+    { name: 'an HTMLVideoElement from a data URL', factory: makeDataUrlVideo },
     { name: 'a bitmap HTMLImageElement', factory: makeMakeHTMLImage("/images/pattern.png") },
     { name: 'a vector HTMLImageElement', factory: makeMakeHTMLImage("/images/pattern.svg") },
     { name: 'a bitmap SVGImageElement', factory: makeMakeSVGImage("/images/pattern.png") },

tests/wpt/web-platform-tests/2dcontext/imagebitmap/createImageBitmap-drawImage.html

@@ -10,25 +10,28 @@
 <link rel="stylesheet" href="/common/canvas-tests.css">
 <body>
 <script>
-function testCanvasDisplayingPattern(canvas)
+function testCanvasDisplayingPattern(canvas, width, height)
 {
-    var tolerance = 5; // for creating ImageBitmap from a video, the tolerance needs to be high
-    _assertPixelApprox(canvas, 5,5, 255,0,0,255, "5,5", "255,0,0,255", tolerance);
-    _assertPixelApprox(canvas, 15,5, 0,255,0,255, "15,5", "0,255,0,255", tolerance);
-    _assertPixelApprox(canvas, 5,15, 0,0,255,255, "5,15", "0,0,255,255", tolerance);
-    _assertPixelApprox(canvas, 15,15, 0,0,0,255, "15,15", "0,0,0,255", tolerance);
+    var tolerance = 10; // for creating ImageBitmap from a video, the tolerance needs to be high
+    const check = (x, y, r, g, b, a) =>
+        _assertPixelApprox(canvas, x,y, r,g,b,a, `${x},${y}`, `${r},${g},${b},${a}`, tolerance);
+    check(1 * width / 4, 1 * height / 4, 255,0,0,255);
+    check(3 * width / 4, 1 * height / 4, 0,255,0,255);
+    check(1 * width / 4, 3 * height / 4, 0,0,255,255);
+    check(3 * width / 4, 3 * height / 4, 0,0,0,255);
 }
 
-function testDrawImageBitmap(source, args = [])
+function testDrawImageBitmap(source, args = [], { resizeWidth = 20, resizeHeight = 20 } = {})
 {
     var canvas = document.createElement("canvas");
-    canvas.width = 20;
-    canvas.height = 20;
+    canvas.width = resizeWidth;
+    canvas.height = resizeHeight;
     var ctx = canvas.getContext("2d");
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
     return createImageBitmap(source, ...args).then(imageBitmap => {
+        assert_equals(imageBitmap.width, resizeWidth);
+        assert_equals(imageBitmap.height, resizeHeight);
         ctx.drawImage(imageBitmap, 0, 0);
-        testCanvasDisplayingPattern(canvas);
+        testCanvasDisplayingPattern(canvas, resizeWidth, resizeHeight);
     });
 }
 
@@ -39,6 +42,27 @@ for (let { name, factory } of imageSourceTypes) {
         });
     }, `createImageBitmap from ${name}, and drawImage on the created ImageBitmap`);
 
+    promise_test(function() {
+        return factory().then(function(img) {
+            const options = { resizeWidth: 10, resizeHeight: 10 };
+            return testDrawImageBitmap(img, [options], options);
+        });
+    }, `createImageBitmap from ${name} scaled down, and drawImage on the created ImageBitmap`);
+
+    promise_test(function() {
+        return factory().then(function(img) {
+            const options = { resizeWidth: 40, resizeHeight: 40 };
+            return testDrawImageBitmap(img, [options], options);
+        });
+    }, `createImageBitmap from ${name} scaled up, and drawImage on the created ImageBitmap`);
+
+    promise_test(function() {
+        return factory().then(function(img) {
+            const options = { resizeWidth: 10, resizeHeight: 40 };
+            return testDrawImageBitmap(img, [options], options);
+        });
+    }, `createImageBitmap from ${name} resized, and drawImage on the created ImageBitmap`);
+
     promise_test(function() {
         return factory().then(function(img) {
             return testDrawImageBitmap(img, [20, 20, -20, -20]);

tests/wpt/web-platform-tests/2dcontext/imagebitmap/createImageBitmap-origin.sub.html

@@ -58,6 +58,18 @@ const arguments = [
     },
   },
 
+  {
+    name: "redirected to cross-origin HTMLVideoElement",
+    factory: () => {
+      return new Promise((resolve, reject) => {
+        const video = document.createElement("video");
+        video.oncanplaythrough = () => resolve(video);
+        video.onerror = reject;
+        video.src = "/common/redirect.py?location=" + getVideoURI("http://{{domains[www1]}}:{{ports[http][0]}}/media/movie_300");
+      });
+    },
+  },
+
   {
     name: "unclean HTMLCanvasElement",
     factory: () => {

tests/wpt/web-platform-tests/FileAPI/reading-data-section/filereader_readAsBinaryString.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>FileAPI Test: filereader_readAsBinaryString</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="help" href="https://w3c.github.io/FileAPI/#readAsBinaryString">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script>
+
+async_test(t => {
+  const blob = new Blob(["σ"]);
+  const reader = new FileReader();
+
+  reader.onload = t.step_func_done(() => {
+    assert_equals(typeof reader.result, "string", "The result is string");
+    assert_equals(reader.result.length, 2, "The result length is 2");
+    assert_equals(reader.result, "\xcf\x83", "The result is \xcf\x83");
+    assert_equals(reader.readyState, reader.DONE);
+  });
+
+  reader.onloadstart = t.step_func(() => {
+    assert_equals(reader.readyState, reader.LOADING);
+  });
+
+  reader.onprogress = t.step_func(() => {
+    assert_equals(reader.readyState, reader.LOADING);
+  });
+
+  reader.readAsBinaryString(blob);
+});
+
+</script>

tests/wpt/web-platform-tests/FileAPI/url/url-in-tags-revoke.window.js

@@ -0,0 +1,33 @@
+async_test(t => {
+  const run_result = 'test_frame_OK';
+  const blob_contents = '<!doctype html>\n<meta charset="utf-8">\n' +
+    '<script>window.test_result = "' + run_result + '";</script>';
+  const blob = new Blob([blob_contents], {type: 'text/html'});
+  const url = URL.createObjectURL(blob);
+
+  const frame = document.createElement('iframe');
+  frame.setAttribute('src', url);
+  frame.setAttribute('style', 'display:none;');
+  document.body.appendChild(frame);
+  URL.revokeObjectURL(url);
+
+  frame.onload = t.step_func_done(() => {
+    assert_equals(frame.contentWindow.test_result, run_result);
+  });
+}, 'Fetching a blob URL immediately before revoking it works in an iframe.');
+
+async_test(t => {
+  const run_result = 'test_script_OK';
+  const blob_contents = 'window.script_test_result = "' + run_result + '";';
+  const blob = new Blob([blob_contents]);
+  const url = URL.createObjectURL(blob);
+
+  const e = document.createElement('script');
+  e.setAttribute('src', url);
+  e.onload = t.step_func_done(() => {
+    assert_equals(window.script_test_result, run_result);
+  });
+
+  document.body.appendChild(e);
+  URL.revokeObjectURL(url);
+}, 'Fetching a blob URL immediately before revoking it works in <script> tags.');

tests/wpt/web-platform-tests/content-security-policy/form-action/form-action-src-allowed-target-blank.sub.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>form-action-src-redirect-allowed-target-blank</title>
+  <meta http-equiv="Content-Security-Policy" content="form-action 'self'">
+  <script src="/resources/testharness.js"></script>
+  <script src="/resources/testharnessreport.js"></script>
+  <script>
+    function OnDocumentLoaded() {
+      let test = async_test("form submission targetting _blank allowed after a redirect");
+      window.addEventListener("message", function(event) {
+        if (event.data == "DocumentNotBlocked") {
+          event.source.close();
+          test.done();
+        }
+      });
+
+      let form = document.getElementById("form");
+      form.action =
+        "/content-security-policy/form-action/support/post-message-to-opener.sub.html";
+
+      let submit = document.getElementById("submit");
+      submit.click();
+    }
+  </script>
+</head>
+<body onload="OnDocumentLoaded();">
+  <form id="form" method="GET" target="_blank">
+    <input type="hidden" name="message" value="DocumentNotBlocked">
+    <input type="submit" id="submit">
+  </form>
+</body>
+</html>
+

tests/wpt/web-platform-tests/content-security-policy/form-action/form-action-src-allowed-target-frame.sub.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>form-action-src-allowed-target-frame</title>
+  <meta http-equiv="Content-Security-Policy" content="form-action 'self'">
+  <script src="/resources/testharness.js"></script>
+  <script src="/resources/testharnessreport.js"></script>
+  <script>
+    function OnDocumentLoaded() {
+      let test = async_test("form submission targetting a frame allowed");
+      window.addEventListener("message", function(event) {
+        if (event.data == "DocumentNotBlocked") {
+          test.done();
+        }
+      });
+
+      let form = document.getElementById("form");
+      form.action =
+        "/content-security-policy/form-action/support/post-message-to-parent.sub.html";
+
+      let submit = document.getElementById("submit");
+      submit.click();
+    }
+  </script>
+</head>
+<body onload="OnDocumentLoaded();">
+  <form id="form" method="GET" target="frame">
+    <input type="hidden" name="message" value="DocumentNotBlocked">
+    <input type="submit" id="submit">
+  </form>
+  <iframe name="frame"></iframe>
+</body>
+</html>
+

tests/wpt/web-platform-tests/content-security-policy/form-action/form-action-src-redirect-allowed-target-blank.sub.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>form-action-src-redirect-allowed-target-blank</title>
+  <meta http-equiv="Content-Security-Policy" content="form-action 'self'">
+  <script src="/resources/testharness.js"></script>
+  <script src="/resources/testharnessreport.js"></script>
+  <script>
+    function OnDocumentLoaded() {
+      let test = async_test("form submission targetting _blank allowed after a redirect");
+      window.addEventListener("message", function(event) {
+        if (event.data == "DocumentNotBlocked") {
+          event.source.close();
+          test.done();
+        }
+      });
+
+      let form = document.getElementById("form");
+      let final_url = "/content-security-policy/form-action/support/post-message-to-opener.sub.html?message=DocumentNotBlocked";
+      let redirect_url = "/common/redirect.py?location=";
+      form.action = redirect_url + encodeURIComponent(final_url);
+
+      let submit = document.getElementById("submit");
+      submit.click();
+    }
+  </script>
+</head>
+<body onload="OnDocumentLoaded();">
+  <form id="form" method="POST" target="_blank">
+    <input type="submit" id="submit">
+  </form>
+</body>
+</html>
+

tests/wpt/web-platform-tests/content-security-policy/form-action/form-action-src-redirect-allowed-target-frame.sub.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>form-action-src-redirect-allowed-target-frame</title>
+  <meta http-equiv="Content-Security-Policy" content="form-action 'self'">
+  <script src="/resources/testharness.js"></script>
+  <script src="/resources/testharnessreport.js"></script>
+  <script>
+    function OnDocumentLoaded() {
+      let test = async_test("form submission targetting a frame allowed after a redirect");
+      window.addEventListener("message", function(event) {
+        if (event.data == "DocumentNotBlocked") {
+          test.done();
+        }
+      });
+
+      let form = document.getElementById("form");
+      let final_url = "/content-security-policy/form-action/support/post-message-to-parent.sub.html?message=DocumentNotBlocked";
+      let redirect_url = "/common/redirect.py?location=";
+      form.action = redirect_url + encodeURIComponent(final_url);
+
+      let submit = document.getElementById("submit");
+      submit.click();
+    }
+  </script>
+</head>
+<body onload="OnDocumentLoaded();">
+  <form id="form" method="POST" target="frame">
+    <input type="submit" id="submit">
+  </form>
+  <iframe name="frame"></iframe>
+</body>
+</html>
+

tests/wpt/web-platform-tests/content-security-policy/form-action/support/post-message-to-opener.sub.html

@@ -0,0 +1,3 @@
+<script>
+  opener.postMessage("{{GET[message]}}", "*");
+</script>

tests/wpt/web-platform-tests/content-security-policy/form-action/support/post-message-to-parent.sub.html

@@ -0,0 +1,3 @@
+<script>
+  parent.postMessage("{{GET[message]}}", "*");
+</script>

tests/wpt/web-platform-tests/content-security-policy/reporting/report-multiple-violations-02.html

@@ -12,7 +12,7 @@
 <body>
   <script>
     for (var i = 0; i<5; i++)
-      setTimeout("alert('PASS: setTimeout #" + i + " executed.');", 0);
+      setTimeout("document.body.innerHTML += ('<p>PASS: setTimeout #" + i + " executed.');", 0);
   </script>
   <script async defer src='../support/checkReport.sub.js?reportField=violated-directive&reportValue=script-src%20%27unsafe-inline%27%20%27self%27&reportCount=1'></script>
 </body>

tests/wpt/web-platform-tests/content-security-policy/support/dedicated-worker-helper.js

@@ -0,0 +1,2 @@
+var url = new URL("../support/ping.js", document.baseURI).toString();
+assert_worker_is_loaded(url, document.getElementById("foo").getAttribute("data-desc-fallback"));

tests/wpt/web-platform-tests/content-security-policy/support/service-worker-helper.js

@@ -0,0 +1,2 @@
+var url = new URL("../support/ping.js", document.baseURI).toString();
+assert_service_worker_is_loaded(url, document.getElementById("foo").getAttribute("data-desc-fallback"));

tests/wpt/web-platform-tests/content-security-policy/support/shared-worker-helper.js

@@ -0,0 +1,2 @@
+var url = new URL("../support/ping.js", document.baseURI).toString();
+assert_shared_worker_is_loaded(url, document.getElementById("foo").getAttribute("data-desc-fallback"));

tests/wpt/web-platform-tests/content-security-policy/worker-src/dedicated-worker-src-child-fallback.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for dedicated worker allowed by child-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="child-src 'self'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/dedicated-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin dedicated worker allowed by child-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/dedicated-worker-src-default-fallback.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for dedicated worker allowed by default-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
+<script src="../support/dedicated-worker-helper.js" id="foo" data-desc-fallback="Same-origin dedicated worker allowed by default-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/dedicated-worker-src-script-fallback.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for dedicated worker allowed by script-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="script-src 'self'; default-src 'none'; ">
+<script src="../support/dedicated-worker-helper.js" id="foo" data-desc-fallback="Same-origin dedicated worker allowed by script-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/dedicated-worker-src-self-fallback.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for dedicated worker allowed by worker-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="worker-src 'self'; child-src 'none'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/dedicated-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin dedicated worker allowed by worker-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/service-worker-src-child-fallback.https.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for service worker allowed by child-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="child-src 'self'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/service-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin service worker allowed by child-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/service-worker-src-default-fallback.https.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for service worker allowed by default-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
+<script src="../support/service-worker-helper.js" id="foo" data-desc-fallback="Same-origin service worker allowed by default-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/service-worker-src-script-fallback.https.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for service worker allowed by script-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="script-src 'self'; default-src 'none'; ">
+<script src="../support/service-worker-helper.js" id="foo" data-desc-fallback="Same-origin service worker allowed by script-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/service-worker-src-self-fallback.https.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for service worker allowed by worker-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="worker-src 'self'; child-src 'none'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/service-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin service worker allowed by worker-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/shared-worker-src-child-fallback.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for shared worker allowed by child-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="child-src 'self'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/shared-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin shared worker allowed by child-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/shared-worker-src-default-fallback.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for shared worker allowed by default-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
+<script src="../support/shared-worker-helper.js" id="foo" data-desc-fallback="Same-origin shared worker allowed by default-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/shared-worker-src-script-fallback.sub.html

@@ -0,0 +1,8 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for shared worker allowed by script-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<meta http-equiv="Content-Security-Policy" content="script-src 'self'; default-src 'none'; ">
+<script src="../support/shared-worker-helper.js" id="foo" data-desc-fallback="Same-origin shared worker allowed by script-src 'self'."></script>

tests/wpt/web-platform-tests/content-security-policy/worker-src/shared-worker-src-self-fallback.sub.html

@@ -0,0 +1,9 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Web platform test for shared worker allowed by worker-src self</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="../support/testharness-helper.js"></script>
+<!-- Ideally we would use "script-src 'none'" alone but we have to whitelist the actual script that spawns the workers, hence the nonce.-->
+<meta http-equiv="Content-Security-Policy" content="worker-src 'self'; child-src 'none'; script-src 'none' 'nonce-foo'; default-src 'none'; ">
+<script src="../support/shared-worker-helper.js" nonce="foo" id="foo" data-desc-fallback="Same-origin shared worker allowed by worker-src 'self'."></script>

tests/wpt/web-platform-tests/css/css-fonts/font-feature-settings-serialization-001.html

@@ -20,7 +20,7 @@
     const div = document.querySelector("#test");
     const div1 = document.querySelector("#test1");
     test(function() {
-        assert_equals(getComputedStyle(div).fontFeatureSettings, '"vert" 1');
-        assert_equals(getComputedStyle(div1).fontFeatureSettings, '"vert" 1');
-    }, "font-feature-settings should have its feature tag serialized with double quotes");
+        assert_equals(getComputedStyle(div).fontFeatureSettings, '"vert"');
+        assert_equals(getComputedStyle(div1).fontFeatureSettings, '"vert"');
+    }, "font-feature-settings should be serialized with double quotes, and the default value of 1 should be omitted");
 </script>

tests/wpt/web-platform-tests/css/css-grid/alignment/grid-column-axis-alignment-sticky-positioned-items-001.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Self-Alignment along column axis of stcky positioned items</title>
+<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-grid-1/#column-align">
+<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-align-self">
+<link rel="stylesheet" href="../../support/alignment.css">
+<meta name="assert" content="Sticky positioned grid items are aligned correcly.">
+<style>
+.container {
+  border: solid 1px;
+  overflow: auto;
+  height: 500px;
+}
+.grid {
+  position: relative;
+  float: left;
+  display: grid;
+  grid-template-columns: 75px 75px 75px 75px;
+  grid-template-rows: 100px 100px 100px 300px;
+  background: grey;
+  height: 400px;
+  margin-right: 20px;
+}
+.sticky {
+  position: -webkit-sticky;
+  position: sticky;
+  width: 20px;
+  height: 20px;
+  background-color: #cae8ca;
+}
+.item1 {
+  top: 0px;
+  grid-column: 1;
+  grid-row: 1;
+}
+.item2 {
+  top: 0px;
+  grid-column: 2;
+  grid-row: 2;
+}
+.item3 {
+  top: 0px;
+  grid-column: 3;
+  grid-row: 3;
+}
+.item4 {
+  grid-column: 4;
+  grid-row: 4;
+  background: lightgrey;
+}
+.scroll { overflow: auto; }
+</style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<body onload="checkLayout('.grid')">
+<div class="container">
+    <div style="height:30px"></div>
+    <div class="grid">
+        <div class="item1 sticky alignSelfStart"  data-offset-x="0"   data-offset-y="0"></div>
+        <div class="item2 sticky alignSelfCenter" data-offset-x="75"  data-offset-y="140"></div>
+        <div class="item3 sticky alignSelfEnd"    data-offset-x="150" data-offset-y="280"></div>
+        <div class="item4"></div>
+    </div>
+    <div class="grid scroll">
+        <div class="item1 sticky alignSelfStart"  data-offset-x="0"   data-offset-y="0"></div>
+        <div class="item2 sticky alignSelfCenter" data-offset-x="75"  data-offset-y="140"></div>
+        <div class="item3 sticky alignSelfEnd"    data-offset-x="150" data-offset-y="280"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="height:2000px"></div>
+</div>
+</body>

tests/wpt/web-platform-tests/css/css-grid/alignment/grid-column-axis-alignment-sticky-positioned-items-002.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Self-Alignment along column axis of stcky positioned items</title>
+<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-grid-1/#column-align">
+<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-align-self">
+<link rel="stylesheet" href="../../support/alignment.css">
+<meta name="assert" content="Sticky positioned grid items are aligned correcly, but preserving non-static positions when required.">
+<style>
+.container {
+  border: solid 1px;
+  overflow: auto;
+  height: 500px;
+}
+.grid {
+  position: relative;
+  float: left;
+  display: grid;
+  grid-template-columns: 75px 75px 75px 75px;
+  grid-template-rows: 100px 100px 100px 300px;
+  background: grey;
+  height: 400px;
+  margin-right: 20px;
+}
+.sticky {
+  position: -webkit-sticky;
+  position: sticky;
+  width: 20px;
+  height: 20px;
+  background-color: #cae8ca;
+}
+.item1 {
+  top: 40px;
+  grid-column: 1;
+  grid-row: 1;
+}
+.item2 {
+  top: 100px;
+  grid-column: 2;
+  grid-row: 2;
+}
+.item3 {
+  top: 290px;
+  grid-column: 3;
+  grid-row: 3;
+}
+.item4 {
+  grid-column: 4;
+  grid-row: 4;
+  background: lightgrey;
+}
+.scroll { overflow: auto; }
+</style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<body onload="checkLayout('.grid')">
+<div class="container">
+    <div style="height:30px"></div>
+    <div class="grid">
+        <div class="item1 sticky alignSelfStart"  data-offset-x="0"   data-offset-y="10"></div>
+        <div class="item2 sticky alignSelfCenter" data-offset-x="75"  data-offset-y="140"></div>
+        <div class="item3 sticky alignSelfEnd"    data-offset-x="150" data-offset-y="280"></div>
+        <div class="item4"></div>
+    </div>
+    <div class="grid scroll">
+        <div class="item1 sticky alignSelfStart"  data-offset-x="0"   data-offset-y="40"></div>
+        <div class="item2 sticky alignSelfCenter" data-offset-x="75"  data-offset-y="140"></div>
+        <div class="item3 sticky alignSelfEnd"    data-offset-x="150" data-offset-y="290"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="height:2000px"></div>
+</div>
+</body>

tests/wpt/web-platform-tests/css/css-grid/alignment/grid-row-axis-alignment-sticky-positioned-items-001.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Self-Alignment along row axis of stcky positioned items</title>
+<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-grid-1/#row-align">
+<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-justify-self">
+<link rel="stylesheet" href="../../support/alignment.css">
+<meta name="assert" content="Sticky positioned grid items are aligned correcly.">
+<style>
+.container {
+  border: solid 1px;
+  overflow: auto;
+  width: 500px;
+}
+.grid {
+  position: relative;
+  display: grid;
+  grid-template-columns: 100px 100px 100px 300px;
+  grid-template-rows: 75px 75px 75px 75px;
+  background: grey;
+  width: 400px;
+  margin-bottom: 20px;
+}
+.sticky {
+  position: -webkit-sticky;
+  position: sticky;
+  width: 20px;
+  height: 20px;
+  background-color: #cae8ca;
+}
+.item1 {
+  left: 0px;
+  grid-column: 1;
+  grid-row: 1;
+}
+.item2 {
+  left: 0px;
+  grid-column: 2;
+  grid-row: 2;
+}
+.item3 {
+  left: 0px;
+  grid-column: 3;
+  grid-row: 3;
+}
+.item4 {
+  grid-column: 4;
+  grid-row: 4;
+  background: lightgrey;
+}
+.scroll { overflow: auto; }
+</style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<body onload="checkLayout('.grid')">
+<div class="container">
+    <div style="width: 30px; float:left; height: 10px;"></div>
+    <div class="grid">
+        <div class="item1 sticky justifySelfStart"  data-offset-x="0"   data-offset-y="0"></div>
+        <div class="item2 sticky justifySelfCenter" data-offset-x="140" data-offset-y="75"></div>
+        <div class="item3 sticky justifySelfEnd"    data-offset-x="280" data-offset-y="150"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="width: 30px; float:left; height: 10px;"></div>
+    <div class="grid scroll">
+        <div class="item1 sticky justifySelfStart"  data-offset-x="0"   data-offset-y="0"></div>
+        <div class="item2 sticky justifySelfCenter" data-offset-x="140" data-offset-y="75"></div>
+        <div class="item3 sticky justifySelfEnd"    data-offset-x="280" data-offset-y="150"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="width: 2000px; height: 10px;"></div>
+</div>
+</body>

tests/wpt/web-platform-tests/css/css-grid/alignment/grid-row-axis-alignment-sticky-positioned-items-002.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Self-Alignment along row axis of stcky positioned items</title>
+<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-grid-1/#row-align">
+<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos">
+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-justify-self">
+<link rel="stylesheet" href="../../support/alignment.css">
+<meta name="assert" content="Sticky positioned grid items are aligned correcly, but preserving non-static positions when required.">
+<style>
+.container {
+  border: solid 1px;
+  overflow: auto;
+  width: 500px;
+}
+.grid {
+  position: relative;
+  display: grid;
+  grid-template-columns: 100px 100px 100px 300px;
+  grid-template-rows: 75px 75px 75px 75px;
+  background: grey;
+  width: 400px;
+  margin-bottom: 20px;
+}
+.sticky {
+  position: -webkit-sticky;
+  position: sticky;
+  width: 20px;
+  height: 20px;
+  background-color: #cae8ca;
+}
+.item1 {
+  left: 40px;
+  grid-column: 1;
+  grid-row: 1;
+}
+.item2 {
+  left: 100px;
+  grid-column: 2;
+  grid-row: 2;
+}
+.item3 {
+  left: 290px;
+  grid-column: 3;
+  grid-row: 3;
+}
+.item4 {
+  grid-column: 4;
+  grid-row: 4;
+  background: lightgrey;
+}
+.scroll { overflow: auto; }
+</style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<body onload="checkLayout('.grid')">
+<div class="container">
+    <div style="width: 30px; float:left; height: 10px;"></div>
+    <div class="grid">
+        <div class="item1 sticky justifySelfStart"  data-offset-x="10"  data-offset-y="0"></div>
+        <div class="item2 sticky justifySelfCenter" data-offset-x="140" data-offset-y="75"></div>
+        <div class="item3 sticky justifySelfEnd"    data-offset-x="280" data-offset-y="150"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="width: 30px; float:left; height: 10px;"></div>
+    <div class="grid scroll">
+        <div class="item1 sticky justifySelfStart"  data-offset-x="40"  data-offset-y="0"></div>
+        <div class="item2 sticky justifySelfCenter" data-offset-x="140" data-offset-y="75"></div>
+        <div class="item3 sticky justifySelfEnd"    data-offset-x="290" data-offset-y="150"></div>
+        <div class="item4"></div>
+    </div>
+    <div style="width: 2000px; height: 10px;"></div>
+</div>
+</body>

tests/wpt/web-platform-tests/css/css-grid/grid-items/anonymous-grid-item-001.html

@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Test: Anonymous grid items - non-contiguous text runs - position:absolute</title>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-grid/#grid-items">
+<link rel="match" href="/css/css-flexbox/anonymous-flex-item-split-ref.html">
+<p>The words "Two" and "lines" should not be on the same line.</p>
+<div style="display:grid">Two <span style="position:absolute"></span>lines</div>

tests/wpt/web-platform-tests/css/css-scroll-snap/snap-at-user-scroll-end-manual.html

@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1" />
+<title>Tests that window should snap at user scroll end.</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+body {
+  margin: 0px;
+  overflow: scroll;
+  scroll-snap-type: both mandatory;
+}
+#content {
+  width: 2000px;
+  height: 2000px;
+  padding: 0px;
+  margin: 0px;
+}
+#target {
+  position: relative;
+  left: 400px;
+  top: 400px;
+  width: 400px;
+  height: 400px;
+  background-color: lightblue;
+  scroll-snap-align: start;
+}
+#i1 {
+  color: red;
+  font-weight: bold;
+}
+</style>
+
+<div id="content">
+  <div id="target">
+    <h1>CSSScrollSnap</h1>
+    <h4>Tests that the window can snap at user scroll end.</h4>
+    <ol>
+      <li id="i1" style="color: red">
+        Scroll the page vertically and horizontally.
+        Keep scrolling until background has turned yellow.</li>
+      <li id="i2"> Press the button "Done"</li>
+    </ol>
+    <input type="button" id="btn" value="DONE" style="width: 100px; height: 50px;"/>
+  </div>
+</div>
+
+<script>
+var body = document.body;
+var button = document.getElementById("btn");
+var target = document.getElementById("target");
+var instruction1 = document.getElementById("i1");
+var instruction2 = document.getElementById("i2");
+var scrolled_x = false;
+var scrolled_y = false;
+var start_x = window.scrollX;
+var start_y = window.scrollY;
+
+window.onscroll = function() {
+  if (scrolled_x && scrolled_y) {
+    body.style.backgroundColor = "yellow";
+    instruction1.style.color = "black";
+    instruction1.style.fontWeight = "normal";
+    instruction2.style.color = "red";
+    instruction2.style.fontWeight = "bold";
+    return;
+  }
+
+  scrolled_x |= window.scrollX != start_x;
+  scrolled_y |= window.scrollY != start_y;
+}
+
+button.onclick = function() {
+  if (!scrolled_x || !scrolled_y)
+    return;
+
+  assert_equals(window.scrollX, target.offsetLeft,
+        "window.scrollX should be at snapped position.");
+  assert_equals(window.scrollY, target.offsetTop,
+        "window.scrollY should be at snapped position.");
+  // To make the test result visible.
+  var content = document.getElementById("content");
+  body.removeChild(content);
+  done();
+}
+
+</script>

tests/wpt/web-platform-tests/css/css-shapes/parsing/shape-outside-invalid-position.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Shapes Module Level 1: parsing shape-outside with invalid position values</title>
+<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-values-4/#typedef-position">
+<meta name="assert" content="shape-outside positions support only the '<position>' grammar.">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="resources/parsing-testcommon.js"></script>
+</head>
+<body>
+<script>
+// The following were supported in an earlier version of the spec.
+// https://github.com/w3c/csswg-drafts/issues/2140
+// Deprecated in Blink with support to be removed in M68, around July 2018.
+test_invalid_value("shape-outside", "circle(at center left 1px)");
+test_invalid_value("shape-outside", "circle(at center top 2px)");
+test_invalid_value("shape-outside", "circle(at right 3% center)");
+test_invalid_value("shape-outside", "circle(at left 4px top)");
+test_invalid_value("shape-outside", "circle(at right top 5px)");
+test_invalid_value("shape-outside", "circle(at bottom 6% center)");
+test_invalid_value("shape-outside", "circle(at bottom 7% left)");
+test_invalid_value("shape-outside", "circle(at bottom right 8%)");
+</script>
+</body>
+</html>

tests/wpt/web-platform-tests/css/css-shapes/parsing/shape-outside-valid-position.html

@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>CSS Shapes Module Level 1: parsing shape-outside with valid position values</title>
+<link rel="author" title="Eric Willigers" href="mailto:ericwilligers@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-values-4/#typedef-position">
+<meta name="assert" content="shape-outside positions support the full '<position>' grammar.">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="resources/parsing-testcommon.js"></script>
+</head>
+<body>
+<script>
+// First serialization is being returned by Firefox/Edge, second by Blink/WebKit.
+test_valid_value("shape-outside", "circle(at 10%)", ["circle(at 10%)", "circle(at 10% 50%)"]);
+test_valid_value("shape-outside", "circle(at 20% 30px)");
+test_valid_value("shape-outside", "circle(at 30px center)", ["circle(at 30px center)", "circle(at 30px 50%)"]);
+test_valid_value("shape-outside", "circle(at 40px top)", ["circle(at 40px top)", "circle(at 40px 0%)"]);
+test_valid_value("shape-outside", "circle(at bottom 10% right 20%)", ["circle(at bottom 10% right 20%)", "circle(at 80% 90%)"]);
+test_valid_value("shape-outside", "circle(at bottom right)", ["circle(at bottom right)", "circle(at 100% 100%)"]);
+test_valid_value("shape-outside", "circle(at center)", ["circle(at center)", "circle(at 50% 50%)"]);
+test_valid_value("shape-outside", "circle(at center 50px)", ["circle(at center 50px)", "circle(at 50% 50px)"]);
+test_valid_value("shape-outside", "circle(at center bottom)", ["circle(at center bottom)", "circle(at 50% 100%)"]);
+test_valid_value("shape-outside", "circle(at center center)", ["circle(at center center)", "circle(at 50% 50%)"]);
+test_valid_value("shape-outside", "circle(at center left)", ["circle(at center left)", "circle(at 0% 50%)"]);
+test_valid_value("shape-outside", "circle(at left)", ["circle(at left)", "circle(at 0% 50%)"]);
+test_valid_value("shape-outside", "circle(at left bottom)", ["circle(at left bottom)", "circle(at 0% 100%)"]);
+test_valid_value("shape-outside", "circle(at left center)", ["circle(at left center)", "circle(at 0% 50%)"]);
+test_valid_value("shape-outside", "circle(at right 40%)", ["circle(at right 40%)", "circle(at 100% 40%)"]);
+test_valid_value("shape-outside", "circle(at right 30% top 60px)", ["circle(at right 30% top 60px)",  "circle(at 70% 60px)"]);
+test_valid_value("shape-outside", "circle(at top)", ["circle(at top)", "circle(at 50% 0%)"]);
+test_valid_value("shape-outside", "circle(at top center)", ["circle(at top center)", "circle(at 50% 0%)"]);
+</script>
+</body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-1-ref.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: compare individual transform with transform functions</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <meta name="assert" content="Tests whether individaul transform works correctlyi by compare the rendering result with transfrom functions of the 'transform' property."/>
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+      }
+      .row_1 {
+        top: 100px;
+      }
+      .scale_1{
+        left: 100px;
+        width: 50px;
+        height: 100px;
+        transform: scaleX(2);
+      }
+      .translate_1 {
+        left: 150px;
+        transform: translateX(150px);
+      }
+      .rotate_1 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        transform: rotate(90deg);
+      }
+
+      .row_2 {
+        top: 250px;
+      }
+      .scale_2{
+        left: 100px;
+        width: 50px;
+        height: 50px;
+        transform: scale(2, 2);
+      }
+      .translate_2 {
+        left: 150px;
+        top: 200px;
+        transform: translate(150px, 50px);
+      }
+      .rotate_2 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        transform: rotate3d(0, 0, 1, 90deg);
+      }
+      .row_3 {
+        transform: perspective(500px);
+        top: 400px;
+      }
+      .scale_3{
+        left: 100px;
+        width: 50px;
+        height: 50px;
+        transform: scale3d(2, 2, 2);
+      }
+      .translate_3 {
+        left: 150px;
+        transform: translate3d(150px, 10px, 10px);
+      }
+      .rotate_3 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        transform: rotate3d(0, 1, 0, 45deg);
+      }
+    </style>
+  </head>
+  <body>
+    <div class="scale_1 row_1"></div>
+    <div class="translate_1 row_1"></div>
+    <div class="rotate_1 row_1"></div>
+    <div class="scale_2 row_2"></div>
+    <div class="translate_2 row_2"></div>
+    <div class="rotate_2 row_2"></div>
+    <div class="scale_3 row_3"></div>
+    <div class="translate_3 row_3"></div>
+    <div class="rotate_3 row_3"></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-1.html

@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: compare individual transform with transform functions</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <meta name="assert" content="Tests whether individaul transform works correctlyi by compare the rendering result with transfrom functions of the 'transform' property."/>
+    <link rel="match" href="individual-transform-1-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+      }
+      .row_1 {
+        top: 100px;
+      }
+      .scale_1{
+        left: 100px;
+        width: 50px;
+        height: 100px;
+        /* test 'scale: <number>' */
+        scale: 2;
+      }
+      .translate_1 {
+        left: 150px;
+        /* test 'translate: <length-percentage>' */
+        translate: 150px;
+      }
+      .rotate_1 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        /* test 'rota: te<angle>' */
+        rotate: 90deg;
+      }
+
+      .row_2 {
+        top: 250px;
+      }
+      .scale_2{
+        left: 100px;
+        width: 50px;
+        height: 50px;
+        /* test 'scale: <number>{2}'' */
+        scale: 2 2;
+      }
+      .translate_2 {
+        left: 150px;
+        top: 200px;
+        /* test 'translate: <length-percentage><length-percentage>' */
+        translate: 150px 50px;
+      }
+      .rotate_2 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        /* test 'rotate: <number>{3}<angle>'*/
+        rotate: 0 0 1 90deg;
+      }
+      .row_3 {
+        transform: perspective(500px);
+        top: 400px;
+      }
+      .scale_3{
+        left: 100px;
+        width: 50px;
+        height: 50px;
+        /* test 'scale: <number>{3}'' */
+        scale: 2 2 2;
+      }
+      .translate_3 {
+        left: 150px;
+        /* test 'translate: <length-percentage><length>' */
+        translate: 150px 10px 10px;
+      }
+      .rotate_3 {
+        left: 450px;
+        transform-origin: 50% 50%;
+        /* test 'rotate: <number>{3}<angle>'*/
+        rotate: 0 1 0 45deg;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="scale_1 row_1"></div>
+    <div class="translate_1 row_1"></div>
+    <div class="rotate_1 row_1"></div>
+    <div class="scale_2 row_2"></div>
+    <div class="translate_2 row_2"></div>
+    <div class="rotate_2 row_2"></div>
+    <div class="scale_3 row_3"></div>
+    <div class="translate_3 row_3"></div>
+    <div class="rotate_3 row_3"></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2-ref.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        transform: translate(50px, 50px) rotate(45deg) scale(2, 2);
+      }
+
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2a.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <link rel="match" href="individual-transform-2-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        translate: 50px 50px;
+        rotate: 45deg;
+        scale: 2 2;
+      }
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2b.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <link rel="match" href="individual-transform-2-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        rotate: 45deg;
+        scale: 2 2;
+        translate: 50px 50px;
+      }
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2c.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <link rel="match" href="individual-transform-2-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        translate: 50px 50px;
+        rotate: 45deg;
+        transform: scale(2, 2);
+      }
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2d.html

@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <link rel="match" href="individual-transform-2-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        translate: 50px 50px;
+        transform: rotate(45deg) scale(2, 2);
+      }
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/individual-transform/individual-transform-2e.html

@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Individual transform: combine individual transform properties</title>
+    <link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
+    <link rel="author" title="Mozilla" href="https://www.mozilla.org">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
+    <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
+    <meta name="assert" content="Tests that we combine transforms in the correct order."/>
+    <link rel="match" href="individual-transform-2-ref.html">
+    <style>
+      div {
+        position: fixed;
+        width: 100px;
+        height: 100px;
+        top: 200px;
+        left: 200px;
+        transform-origin: 0 0;
+        border-style: solid;
+        border-width: 10px 0px 10px 0px;
+        border-color: lime;
+        translate: 0px 50px;
+        transform: translateX(50px) rotate(45deg) scale(2, 2);
+      }
+    </style>
+  </head>
+  <body>
+    <div></div>
+  </body>
+</html>

tests/wpt/web-platform-tests/css/css-transforms/transform-transformed-tr-percent-height-child-ref.html

@@ -0,0 +1,38 @@
+<!doctype HTML>
+
+<title>CSS Test (Transforms): Transformed tr with percent height abspos child reference.</title>
+<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
+<style>
+.table {
+  width: 100px;
+  height: 100px;
+  background-color: lightblue;
+}
+.tr {
+  height: 50px;
+  background-color: lightgrey;
+}
+.contblock {
+  transform: translateX(10px);
+  width: 200px;
+  height: 200px;
+  background-color: lightyellow;
+}
+.abspos {
+  position: absolute;
+  top: 20px;
+  left: 20px;
+  width: 100%;
+  height: 100%;
+  background-color: blue;
+}
+</style>
+
+<div class="contblock">
+  <div class="table">
+    <div class="tr" style="width: 50px;"></div>
+    <div class="tr" style="width: 100px; transform: translateX(10px)">
+      <div class="abspos"></div>
+    </div>
+  </div>
+</div>

tests/wpt/web-platform-tests/css/css-transforms/transform-transformed-tr-percent-height-child.html

@@ -0,0 +1,48 @@
+<!doctype HTML>
+
+<title>CSS Test (Transforms): Transformed tr with percent height abspos child.</title>
+<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
+<link rel="help" href="http://www.w3.org/TR/css-transforms-1/#transform-rendering">
+<meta name="assert" content="This test ensures that transformed tr's percent height abspos child uses tr's height as reference.">
+<link rel="match" href="transform-transformed-tr-percent-height-child-ref.html">
+<style>
+  table, td, tr {
+    margin: 0px;
+    padding: 0px;
+    border-spacing: 0px;
+  }
+  table {
+    background-color: lightblue;
+  }
+  td {
+    width: 50px;
+    height: 50px;
+    background-color: lightgrey;
+  }
+  .contblock {
+    transform: translateX(10px);
+    width: 200px;
+    height: 200px;
+    background-color: lightyellow;
+  }
+  .abspos {
+    position: absolute;
+    top: 20px;
+    left: 20px;
+    width: 100%;
+    height: 100%;
+    background-color: blue;
+  }
+</style>
+
+<div class="contblock">
+  <table>
+    <tr>
+      <td></td>
+    </tr>
+    <tr style="transform: translateX(10px)">
+      <td></td>
+      <td><div class="abspos"></div></td>
+    </tr>
+  </table>
+</div>

tests/wpt/web-platform-tests/css/css-typed-om/interfaces.html

@@ -0,0 +1,28 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>CSS Typed OM IDL</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#idl-index">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/WebIDLParser.js"></script>
+<script src="/resources/idlharness.js"></script>
+<script>
+'use strict';
+
+promise_test(t => {
+  return fetch('/interfaces/css-typed-om.idl')
+    .then(response => response.text())
+    .then(idls => {
+      var idl_array = new IdlArray();
+      idl_array.add_idls(idls);
+      idl_array.add_untested_idls('interface Element {};');
+      idl_array.add_untested_idls('interface CSSStyleRule {};');
+      idl_array.add_untested_idls('interface ElementCSSInlineStyle {};');
+      idl_array.add_objects({
+        // TODO: Add more objects.
+      });
+      idl_array.test();
+      t.done();
+    });
+}, 'CSS Typed OM IDL test');
+</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-serialization/cssMathValue.tentative.html

@@ -1,8 +1,6 @@
 <!doctype html>
 <meta charset="utf-8">
 <title>IDL-constructed CSSMathValue serialization tests</title>
-<!-- Tentative because this depends on css-values-4 spec, which is still WIP:
-     https://drafts.csswg.org/css-values-4/#calc-notation -->
 <link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#calc-serialization">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
@@ -11,70 +9,105 @@
 'use strict';
 
 const gTestCases = [
-  {
-    description: 'CSSMathSum with 1 argument',
-    value: new CSSMathSum(CSS.px(1)),
-    cssText: 'calc(1px)',
-  },
-  {
-    description: 'CSSMathSum with 2 arguments',
-    value: new CSSMathSum(CSS.px(1), CSS.px(2)),
-    cssText: 'calc(1px + 2px)',
-  },
-  {
-    description: 'CSSMathSum with more than 2 arguments',
-    value: new CSSMathSum(CSS.px(1), CSS.px(2), CSS.px(3)),
-    cssText: 'calc((1px + 2px) + 3px)',
-  },
-  {
-    description: 'CSSMathProduct with 1 argument',
-    value: new CSSMathProduct(CSS.px(1)),
-    cssText: 'calc(1px)',
-  },
-  {
-    description: 'CSSMathProduct with 2 arguments',
-    value: new CSSMathProduct(CSS.px(1), 2),
-    cssText: 'calc(1px * 2)',
-  },
-  {
-    description: 'CSSMathProduct with more than 2 arguments',
-    value: new CSSMathProduct(CSS.px(1), 2, 3),
-    cssText: 'calc((1px * 2) * 3)',
-  },
-  {
-    description: 'CSSMathProduct of two different base types',
-    value: new CSSMathProduct(CSS.px(1), CSS.s(1)),
-    cssText: 'calc(1px * 1s)',
-  },
   {
     description: 'CSSMathMax with one argument',
-    value: new CSSMathMax(CSS.px(2)),
-    cssText: 'max(1px)',
+    value: new CSSMathMax(1),
+    cssText: 'max(1)',
   },
   {
     description: 'CSSMathMax with more than one argument',
-    value: new CSSMathMax(CSS.px(2), CSS.px(1)),
-    cssText: 'max(1px, 1s)',
+    value: new CSSMathMax(1, 2, 3),
+    cssText: 'max(1, 2, 3)',
+  },
+  {
+    description: 'CSSMathMax containing nested CSSMathValues',
+    value: new CSSMathMax(new CSSMathSum(1, 2), 3),
+    cssText: 'max(1 + 2, 3)',
   },
   {
     description: 'CSSMathMin with one argument',
-    value: new CSSMathMin(CSS.px(1)),
-    cssText: 'min(1px)',
+    value: new CSSMathMin(1),
+    cssText: 'min(1)',
   },
   {
     description: 'CSSMathMin with more than one argument',
-    value: new CSSMathMin(CSS.px(1), CSS.px(2)),
-    cssText: 'min(1px, 2px)',
+    value: new CSSMathMin(1, 2, 3),
+    cssText: 'min(1, 2, 3)',
+  },
+  {
+    description: 'CSSMathMin containing nested CSSMathValues',
+    value: new CSSMathMin(new CSSMathSum(1, 2), 3),
+    cssText: 'min(1 + 2, 3)',
+  },
+  {
+    description: 'CSSMathSum with one argument',
+    value: new CSSMathSum(1),
+    cssText: 'calc(1)',
+  },
+  {
+    description: 'CSSMathSum with more than one argument',
+    value: new CSSMathSum(1, 2, 3),
+    cssText: 'calc(1 + 2 + 3)',
+  },
+  {
+    description: 'CSSMathSum with a CSSMathNegate as first value',
+    value: new CSSMathSum(new CSSMathNegate(1), 2, 3),
+    cssText: 'calc((-1) + 2 + 3)',
+  },
+  {
+    description: 'CSSMathSum containing a CSSMathNegate after first value',
+    value: new CSSMathSum(1, new CSSMathNegate(2), 3),
+    cssText: 'calc(1 - 2 + 3)',
+  },
+  {
+    description: 'CSSMathSum nested inside a CSSMathValue',
+    value: new CSSMathSum(new CSSMathSum(1, 2), 3),
+    cssText: 'calc((1 + 2) + 3)',
   },
   {
     description: 'CSSMathNegate',
-    value: new CSSMathNegate(CSS.px(1)),
-    cssText: 'calc(- 1px)',
+    value: new CSSMathNegate(1),
+    cssText: 'calc(-1)',
+  },
+  {
+    description: 'CSSMathNegate nested inside a CSSMathValue',
+    value: new CSSMathProduct(new CSSMathNegate(1)),
+    cssText: 'calc((-1))',
+  },
+  {
+    description: 'CSSMathProduct with one argument',
+    value: new CSSMathProduct(1),
+    cssText: 'calc(1)',
+  },
+  {
+    description: 'CSSMathProduct with more than one argument',
+    value: new CSSMathProduct(1, 2, 3),
+    cssText: 'calc(1 * 2 * 3)',
+  },
+  {
+    description: 'CSSMathProduct with a CSSMathInvert as first value',
+    value: new CSSMathProduct(new CSSMathInvert(1), 2, 3),
+    cssText: 'calc((1 / 1) * 2 * 3)',
+  },
+  {
+    description: 'CSSMathProduct containing a CSSMathInvert after first value',
+    value: new CSSMathProduct(1, new CSSMathInvert(2), 3),
+    cssText: 'calc(1 / 2 * 3)',
+  },
+  {
+    description: 'CSSMathProduct nested inside a CSSMathValue',
+    value: new CSSMathProduct(new CSSMathProduct(1, 2), 3),
+    cssText: 'calc((1 * 2) * 3)',
   },
   {
     description: 'CSSMathInvert',
-    value: new CSSMathInvert(CSS.px(1)),
-    cssText: 'calc(1 / 1px)',
+    value: new CSSMathInvert(1),
+    cssText: 'calc(1 / 1)',
+  },
+  {
+    description: 'CSSMathInvert nested inside a CSSMathValue',
+    value: new CSSMathSum(new CSSMathInvert(1)),
+    cssText: 'calc((1 / 1))',
   },
 ];
 

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-serialization/cssUnitValue.tentative.html

@@ -34,22 +34,10 @@ test(() => {
   assert_equals(result.toString(), '3.14px');
 }, 'CSSKeywordValue from DOMString modified by "value" setter serializes correctly');
 
-test(() => {
-  let result = CSSStyleValue.parse('width', '1px');
-  result.unit = 's';
-  assert_equals(result.toString(), '1s');
-}, 'CSSKeywordValue from DOMString modified by "unit" setter serializes correctly');
-
 test(t => {
   let result = createInlineStyleMap(t, 'width: 1px').get('width');
   result.value = 3.14;
   assert_equals(result.toString(), '3.14px');
 }, 'CSSKeywordValue from CSSOM modified by "value" setter serializes correctly');
 
-test(t => {
-  let result = createInlineStyleMap(t, 'width: 1px').get('width');
-  result.unit = 's';
-  assert_equals(result.toString(), '1s');
-}, 'CSSKeywordValue from CSSOM modified by "unit" setter serializes correctly');
-
 </script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssPositionValue-interface.html

@@ -1,26 +0,0 @@
-<!doctype html>
-<meta charset=utf-8>
-<title>CSSPositionValue IDL</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#positionvalue-objects">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/WebIDLParser.js"></script>
-<script src="/resources/idlharness.js"></script>
-<script type="text/plain" id="idl">
-[Constructor(CSSNumericValue x, CSSNumericValue y)]
-interface CSSPositionValue : CSSStyleValue {
-    attribute CSSNumericValue x;
-    attribute CSSNumericValue y;
-};
-</script>
-<script>
-'use strict';
-const idlArray = new IdlArray();
-idlArray.add_untested_idls('interface CSSStyleValue { stringifier; };');
-idlArray.add_untested_idls('interface CSSNumericValue : CSSStyleValue { };');
-idlArray.add_idls(document.getElementById('idl').textContent);
-idlArray.add_objects({
-    CSSPositionValue: ['new CSSPositionValue(new CSSUnitValue(0, "px"), new CSSUnitValue(0, "px"))']
-});
-idlArray.test();
-</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssUnparsedValue-interface.html

@@ -1,30 +0,0 @@
-<!doctype html>
-<meta charset=utf-8>
-<title>CSSUnparsedValue IDL</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#cssunparsedvalue">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/WebIDLParser.js"></script>
-<script src="/resources/idlharness.js"></script>
-<script type="text/plain" id="idl">
-[Constructor((DOMString or CSSVariableReferenceValue)... members)]
-interface CSSUnparsedValue : CSSStyleValue {
-    iterable<(DOMString or CSSVariableReferenceValue)>;
-    readonly attribute unsigned long length;
-    getter (DOMString or CSSVariableReferenceValue) (unsigned long index);
-};
-</script>
-<script>
-'use strict';
-const idlArray = new IdlArray();
-idlArray.add_untested_idls('interface CSSStyleValue { stringifier; };');
-idlArray.add_untested_idls('interface CSSVariableReferenceValue : CSSStyleValue { };');
-idlArray.add_idls(document.getElementById('idl').textContent);
-idlArray.add_objects({
-    CSSUnparsedValue: [
-        'new CSSUnparsedValue()',
-        'new CSSUnparsedValue("foo")',
-    ]
-});
-idlArray.test();
-</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssUrlImageValue-interface.html

@@ -1,24 +1,22 @@
 <!doctype html>
 <meta charset=utf-8>
-<title>CSSKeywordValue IDL</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#keywordvalue-objects">
+<title>CSSURLImageValue IDL</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#cssurlimagevalue">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/WebIDLParser.js"></script>
 <script src="/resources/idlharness.js"></script>
 <script type="text/plain" id="idl">
-[Constructor(DOMString value)]
-interface CSSKeywordValue : CSSStyleValue {
-    attribute DOMString value;
+[Exposed=(Window, Worker, PaintWorklet, LayoutWorklet),
+ Constructor(USVString url)]
+interface CSSURLImageValue : CSSImageValue {
+    readonly attribute USVString url;
 };
 </script>
 <script>
 'use strict';
 const idlArray = new IdlArray();
-idlArray.add_untested_idls('interface CSSStyleValue { stringifier; };');
+idlArray.add_untested_idls('interface CSSImageValue { stringifier; };');
 idlArray.add_idls(document.getElementById('idl').textContent);
-idlArray.add_objects({
-    CSSKeywordValue: ['new CSSKeywordValue("auto")']
-});
 idlArray.test();
 </script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssUrlImageValue-invalid.html

@@ -0,0 +1,17 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSSURLImageValue Error Handling</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#imagevalue-objects">
+<meta name="assert" content="Test CSSURLImageValue constructor error handling" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<body>
+<div id="log">
+<script>
+'use strict';
+
+test(() => {
+  assert_throws(new TypeError(), () => new CSSURLImageValue("file://:invalid url"));
+}, 'Constructing a CSSURLImageValue with an invalid URL throws a TypeError');
+
+</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssUrlImageValue.html

@@ -0,0 +1,81 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSSURLImageValue</title>
+<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#imagevalue-objects">
+<meta name="assert" content="Test CSSURLImageValue constructor and attributes" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../resources/testhelper.js"></script>
+<body>
+<div id="log">
+<script>
+'use strict';
+
+const gTestUrl = '../resources/1x1-green.png';
+const gBase64TestUrl = 'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=';
+const gBadTestUrl = document.location.href;
+
+test(() => {
+  const result = new CSSURLImageValue(gTestUrl);
+
+  assert_not_equals(result, null,
+      'A CSSURLImageValue should be created');
+  assert_equals(result.url, gTestUrl,
+      'url member should be same as passed in the constructor');
+  assert_equals(result.intrinsicWidth, null, 'intrinsicWidth');
+  assert_equals(result.intrinsicHeight, null, 'intrinsicHeight');
+  assert_equals(result.intrinsicRatio, null, 'intrinsicRatio');
+  assert_equals(result.state, 'unloaded', 'state');
+}, 'Constructing a CSSURLImageValue with a valid URL puts it in an ' +
+   'unloaded state');
+
+async_test(t => {
+  const result = new CSSURLImageValue(gTestUrl);
+  let image = loadImageResource(t, result);
+
+  image.addEventListener('load', t.step_func_done(() => {
+    assert_equals(result.url, gTestUrl,
+        'url member should be same as passed in the constructor');
+    assert_equals(result.state, 'loaded', 'state');
+    assert_equals(result.intrinsicWidth, 1,
+        'intrinsicWidth member should be width of loaded image');
+    assert_equals(result.intrinsicHeight, 1,
+        'intrinsicHeight member should be height of loaded image');
+    assert_equals(result.intrinsicRatio, 1,
+        'intrinsicRatio member should be ratio of loaded image');
+  }));
+}, 'Constructing a CSSURLImageValue from a URL sets its state to loaded');
+
+async_test(t => {
+  const result = new CSSURLImageValue(gBase64TestUrl);
+  let image = loadImageResource(t, result);
+
+  image.addEventListener('load', t.step_func_done(() => {
+    assert_equals(result.url, gBase64TestUrl,
+        'url member should be same as passed in the constructor');
+    assert_equals(result.state, 'loaded', 'state');
+    assert_equals(result.intrinsicWidth, 1,
+        'intrinsicWidth member should be width of loaded image');
+    assert_equals(result.intrinsicHeight, 1,
+        'intrinsicHeight member should be height of loaded image');
+    assert_equals(result.intrinsicRatio, 1,
+        'intrinsicRatio member should be ratio of loaded image');
+  }));
+}, 'Constructing a CSSURLImageValue from a base64 URL sets its state to loaded');
+
+async_test(t => {
+  const result = new CSSURLImageValue(gBadTestUrl);
+  let image = loadImageResource(t, result);
+
+  image.addEventListener('error', t.step_func_done(() => {
+      assert_equals(result.url, gBadTestUrl,
+        'url member should be same as passed in the constructor');
+      assert_equals(result.state, 'error', 'state');
+      assert_equals(result.intrinsicWidth, null, 'intrinsicWidth');
+      assert_equals(result.intrinsicHeight, null, 'intrinsicHeight');
+      assert_equals(result.intrinsicRatio, null, 'intrinsicRatio');
+  }));
+}, 'Constructing a CSSURLImageValue from a URL to an invalid image sets ' +
+   'its state to error');
+
+</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssUrlImageValue.tentative.html

@@ -1,73 +0,0 @@
-<!doctype html>
-<meta charset="utf-8">
-<title>CSSURLImageValue tests</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#imagevalue-objects">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="../resources/testhelper.js"></script>
-<body>
-<script>
-'use strict';
-
-const gTestUrl = '../resources/1x1-green.png';
-const gBase64TestUrl = 'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=';
-const gBadTestUrl = document.location.href;
-
-test(() => {
-  assert_throws(new TypeError(), () => new CSSURLImageValue("file://:This is invalid url"));
-}, 'Constructing a CSSURLImageValue with an invalid URL throws a TypeError');
-
-test(() => {
-  const result = new CSSURLImageValue(gTestUrl);
-  assert_equals(result.url, gTestUrl);
-  assert_equals(result.intrinsicWidth, null);
-  assert_equals(result.intrinsicHeight, null);
-  assert_equals(result.intrinsicRatio, null);
-  assert_equals(result.state, 'unloaded');
-}, 'Constructing a CSSURLImageValue with a valid URL puts it in an unloaded state');
-
-test(() => {
-  let result = new CSSURLImageValue(gTestUrl);
-  assert_throws(new TypeError(), () => result.url = gBase64TestUrl);
-}, 'CSSURLImageValue.url is readonly');
-
-async_test(t => {
-  const result = new CSSURLImageValue(gTestUrl);
-  let image = loadImageResource(t, result);
-
-  image.addEventListener('load', t.step_func_done(() => {
-    assert_equals(result.url, gTestUrl);
-    assert_equals(result.state, 'loaded');
-    assert_equals(result.intrinsicWidth, 1);
-    assert_equals(result.intrinsicHeight, 1);
-    assert_equals(result.intrinsicRatio, 1);
-  }));
-}, 'Loading a CSSURLImageValue from a URL sets its state to loaded');
-
-async_test(t => {
-  const result = new CSSURLImageValue(gBase64TestUrl);
-  let image = loadImageResource(t, result);
-
-  image.addEventListener('load', t.step_func_done(() => {
-    assert_equals(result.url, gBase64TestUrl);
-    assert_equals(result.state, 'loaded');
-    assert_equals(result.intrinsicWidth, 1);
-    assert_equals(result.intrinsicHeight, 1);
-    assert_equals(result.intrinsicRatio, 1);
-  }));
-}, 'Loading a CSSURLImageValue from a base64 URL sets its state to loaded');
-
-async_test(t => {
-  const result = new CSSURLImageValue(gBadTestUrl);
-  let image = loadImageResource(t, result);
-
-  image.addEventListener('error', t.step_func_done(() => {
-      assert_equals(result.url, gBadTestUrl);
-      assert_equals(result.state, 'error');
-      assert_equals(result.intrinsicWidth, null);
-      assert_equals(result.intrinsicHeight, null);
-      assert_equals(result.intrinsicRatio, null);
-  }));
-}, 'Loading a CSSURLImageValue from a URL to an invalid image sets its state to error');
-
-</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/cssVariableReferenceValue-interface.html

@@ -1,26 +0,0 @@
-<!doctype html>
-<meta charset=utf-8>
-<title>CSSVariableReferenceValue IDL</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#cssvariablereferencevalue">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/WebIDLParser.js"></script>
-<script src="/resources/idlharness.js"></script>
-<script type="text/plain" id="idl">
-[Constructor(DOMString variable, optional CSSUnparsedValue fallback)]
-interface CSSVariableReferenceValue {
-    attribute DOMString variable;
-    readonly attribute CSSUnparsedValue? fallback;
-};
-</script>
-<script>
-'use strict';
-const idlArray = new IdlArray();
-idlArray.add_idls(document.getElementById('idl').textContent);
-idlArray.add_objects({
-    CSSVariableReferenceValue: [
-        'new CSSVariableReferenceValue("--foo")',
-    ]
-});
-idlArray.test();
-</script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/numeric-objects/arithmetic.tentative.html

@@ -144,4 +144,10 @@ test(() => {
     new CSSMathProduct(CSS.number(2), CSS.number(0.5), new CSSMathInvert(CSS.px(2)), CSS.number(2), new CSSMathInvert(new CSSMathSum(2))));
 }, 'Calling CSSNumericValue.div inverts all argument values');
 
+test(() => {
+  assert_throws(new RangeError(), () => CSS.number(2).div(CSS.number(0)));
+  assert_throws(new RangeError(), () => CSS.number(3).div(CSS.px(10) ,CSS.number(0)));
+  assert_throws(new RangeError(), () => CSS.number(2).div(CSS.number(0), CSS.number(0)));
+}, 'Can not divide with CSSUnitValue which has zero value and number type');
+
 </script>

tests/wpt/web-platform-tests/css/css-typed-om/stylevalue-subclasses/numeric-objects/cssUnitValue.tentative.html

@@ -19,26 +19,12 @@ for (const {unit, desc} of gInvalidTestUnits) {
   }, 'Constructing CSSUnitValue with ' + desc + ' as the unit throws a TypeError');
 }
 
-for (const {unit, desc} of gInvalidTestUnits) {
-  test(() => {
-    let result = new CSSUnitValue(0, 'px');
-    assert_throws(new TypeError(), () => result.unit = unit);
-    assert_equals(result.unit, 'px');
-  }, 'Updating CSSUnitValue.unit with ' + desc + ' throws a TypeError');
-}
-
 for (const unit of gValidUnits) {
   test(() => {
     const result = new CSSUnitValue(-3.14, unit);
     assert_equals(result.value, -3.14);
     assert_equals(result.unit, unit.toLowerCase());
   }, 'CSSUnitValue can be constructed with ' + unit);
-
-  test(() => {
-    let result = new CSSUnitValue(-3.14, 'px');
-    result.unit = unit
-    assert_equals(result.unit, unit.toLowerCase());
-  }, 'CSSUnitValue.unit can be updated to ' + unit);
 }
 
 </script>

tests/wpt/web-platform-tests/css/css-typed-om/the-stylepropertymap/interface.html

@@ -1,47 +0,0 @@
-<!doctype html>
-<meta charset=utf-8>
-<title>StylePropertyMap IDL</title>
-<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#the-stylepropertymap">
-<script src="/resources/testharness.js"></script>
-<script src="/resources/testharnessreport.js"></script>
-<script src="/resources/WebIDLParser.js"></script>
-<script src="/resources/idlharness.js"></script>
-<script type="text/plain" id="idl">
-interface StylePropertyMapReadOnly {
-    CSSStyleValue? get(DOMString property);
-    sequence<CSSStyleValue> getAll(DOMString property);
-    boolean has(DOMString property);
-    iterable<DOMString, (CSSStyleValue or sequence<CSSStyleValue>)>;
-    sequence<DOMString> getProperties();
-    stringifier;
-};
-
-callback UpdateFunction = CSSStyleValue (CSSStyleValue oldValue);
-
-interface StylePropertyMap : StylePropertyMapReadOnly {
-    void append(DOMString property, (CSSStyleValue or DOMString)... values);
-    void delete(DOMString property);
-    void set(DOMString property, (CSSStyleValue or DOMString)... values);
-    void update(DOMString property, UpdateFunction updateFunction);
-};
-
-partial interface Element {
-    StylePropertyMapReadOnly computedStyleMap();
-};
-
-partial interface CSSStyleRule {
-    [SameObject] readonly attribute StylePropertyMap styleMap;
-};
-
-partial interface Element {
-    [SameObject] readonly attribute StylePropertyMap attributeStyleMap;
-};
-</script>
-<script>
-'use strict';
-const idlArray = new IdlArray();
-idlArray.add_idls(document.getElementById('idl').textContent);
-idlArray.add_untested_idls('interface Element {};');
-idlArray.add_untested_idls('interface CSSStyleRule {};');
-idlArray.test();
-</script>

tests/wpt/web-platform-tests/css/selectors/invalidation/matches.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>CSS Selectors Invalidation: :any-link</title>
+    <title>CSS Selectors Invalidation: :matches()</title>
     <link rel="author" title="Victoria Su" href="mailto:victoriaytsu@google.com">
     <link rel="help" href="https://drafts.csswg.org/selectors-4/#matches">
     <meta name="assert" content="This tests that the :matches() selector is effective">
@@ -9,15 +9,38 @@
     <script src="/resources/testharnessreport.js"></script>
     <style>
       .b {
-        color: rgb(255, 255, 0); /* yellow */
+        color: yellow;
       }
       /*Simple selector arguments */
       .a :matches(.b, .c) {
-        color: rgb(255, 0, 0); /* red */
+        color: red;
       }
       /*Compound selector arguments */
       .a :matches(.c#d, .e) {
-        color: rgb(0, 255, 0); /* green */
+        color: green;
+      }
+      /* Complex selector arguments */
+      .a .g>.b {
+        color: black;
+      }
+      .a :matches(.e+.f, .g>.b, .h) {
+        color: blue;
+      }
+      .g>.b {
+        color: black;
+      }
+      .a .h {
+        color: black;
+      }
+      /* Nested */
+      .a+.c>.e {
+        color: black;
+      }
+      .a+:matches(.b+.f, :matches(.c>.e, .g)) {
+        color: red;
+      }
+      .c>.e {
+        color: black;
       }
     </style>
   </head>
@@ -38,29 +61,73 @@
       <div class="f" id="f1">
         Blue
       </div>
+      <div class="g">
+        <div class="b" id="b2">
+          Blue
+          <div class="b" id="b3">
+            Red
+          </div>
+        </div>
+      </div>
+      <div class="h" id="h1">
+        Black
+      </div>
+    </div>
+    <div class="c" id="c2">
+      <div class="e" id="e2">
+        Red
+      </div>
     </div>
     <script>
       document.body.offsetTop;
 
+      var black = "rgb(0, 0, 0)";
+      var blue = "rgb(0, 0, 255)";
+      var green = "rgb(0, 128, 0)";
+      var red = "rgb(255, 0, 0)";
+      var yellow = "rgb(255, 255, 0)";
+
       test(() => {
-        assert_equals(getComputedStyle(b1).color, "rgb(255, 255, 0)");
-        assert_equals(getComputedStyle(c1).color, "rgb(0, 0, 0)");
-        assert_equals(getComputedStyle(d).color, "rgb(0, 0, 0)");
-        assert_equals(getComputedStyle(e1).color, "rgb(0, 0, 0)");
-        assert_equals(getComputedStyle(f1).color, "rgb(0, 0, 0)");
+        assert_equals(getComputedStyle(b1).color, yellow);
+        assert_equals(getComputedStyle(b2).color, black);
+        assert_equals(getComputedStyle(b3).color, yellow);
+        assert_equals(getComputedStyle(c1).color, black);
+        assert_equals(getComputedStyle(d).color, black);
+        assert_equals(getComputedStyle(e1).color, black);
+        assert_equals(getComputedStyle(e2).color, black);
+        assert_equals(getComputedStyle(f1).color, black);
+        assert_equals(getComputedStyle(h1).color, black);
       }, "Preconditions.");
 
       test(() => {
         a1.className = "a";
-        assert_equals(getComputedStyle(b1).color, "rgb(255, 0, 0)");
-        assert_equals(getComputedStyle(c1).color, "rgb(255, 0, 0)");
+        assert_equals(getComputedStyle(b1).color, red);
+        assert_equals(getComputedStyle(b3).color, red);
+        assert_equals(getComputedStyle(c1).color, red);
       }, "Invalidate :matches() for simple selector arguments.");
 
       test(() => {
         a1.className = "a";
-        assert_equals(getComputedStyle(d).color, "rgb(0, 255, 0)");
+        assert_equals(getComputedStyle(d).color, green);
       }, "Invalidate :matches() for compound selector arguments.");
 
+      test(() => {
+        a1.className = "a";
+        assert_equals(getComputedStyle(b2).color, blue);
+        assert_equals(getComputedStyle(b3).color, red);
+        assert_equals(getComputedStyle(f1).color, blue);
+      }, "Invalidate :matches() for complex selector arguments.");
+
+      test(() => {
+        a1.className = "a";
+        assert_equals(getComputedStyle(e2).color, red);
+      }, "Invalidate nested :matches().");
+
+      test(() => {
+        a1.className = "a";
+        assert_equals(getComputedStyle(b2).color, blue);
+        assert_equals(getComputedStyle(h1).color, black);
+      }, "Test specificity of :matches().");
     </script>
   </body>
 </html>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-001-ref.html

@@ -53,6 +53,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-001.html

@@ -54,6 +54,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -76,6 +80,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-002-ref.html

@@ -51,6 +51,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -73,6 +77,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-002.html

@@ -53,6 +53,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-img-001-ref.html

@@ -54,6 +54,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignStart"><!--stretch--></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignStart"><!--baseline--></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignEnd"><!--last baseline--></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignCenter"><!--center--></div>
@@ -88,6 +94,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignStart"><!--stretch--></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignStart"><!--baseline--></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignEnd"><!--last baseline--></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignCenter"><!--center--></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-img-001.html

@@ -53,6 +53,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: stretch"></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: baseline"></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: last baseline"></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: center"></div>
@@ -87,6 +93,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: stretch"></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: baseline"></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: last baseline"></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: center"></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-img-002-ref.html

@@ -52,6 +52,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignStart"><!--stretch--></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignStart"><!--baseline--></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignEnd"><!--last baseline--></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignCenter"><!--center--></div>
@@ -86,6 +92,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignStart"><!--stretch--></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignStart"><!--baseline--></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                class="alignEnd"><!--last baseline--></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><img src="support/colors-8x16.png"
                                 class="alignCenter"><!--center--></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-img-002.html

@@ -52,6 +52,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: stretch"></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: baseline"></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: last baseline"></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: center"></div>
@@ -86,6 +92,12 @@
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: stretch"></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: baseline"></div>
+    <div class="container"><img src="support/colors-8x16.png"
+                                style="justify-self: last baseline"></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><img src="support/colors-8x16.png"
                                 style="justify-self: center"></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-001-ref.html

@@ -53,6 +53,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-001.html

@@ -54,6 +54,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -76,6 +80,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-002-ref.html

@@ -53,6 +53,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-002.html

@@ -55,6 +55,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -77,6 +81,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-003-ref.html

@@ -51,6 +51,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -73,6 +77,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-003.html

@@ -53,6 +53,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-004-ref.html

@@ -51,6 +51,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -73,6 +77,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-rtl-004.html

@@ -54,6 +54,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -76,6 +80,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-vertWM-001-ref.html

@@ -55,6 +55,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -77,6 +81,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-vertWM-001.html

@@ -53,6 +53,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -75,6 +79,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-vertWM-002-ref.html

@@ -55,6 +55,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>
@@ -77,6 +81,10 @@
     <div class="container"><div class="alignStart"><!--normal--></div></div>
     <div class="container"><div class="alignStart"><!--stretch--></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div class="alignStart"><!--baseline--></div></div>
+    <div class="container"><div class="alignEnd"><!--last baseline--></div></div>
+    <br>
     <!-- <self-position>, part 1: -->
     <div class="container"><div class="alignCenter"><!--center--></div></div>
     <div class="container"><div class="alignStart"><!--start--></div></div>

tests/wpt/web-platform-tests/css/vendor-imports/mozilla/mozilla-central-reftests/align3/grid-abspos-staticpos-justify-self-vertWM-002.html

@@ -54,6 +54,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>
@@ -76,6 +80,10 @@
     <div class="container"><div style="justify-self: normal"></div></div>
     <div class="container"><div style="justify-self: stretch"></div></div>
     <br>
+    <!-- <baseline-position> -->
+    <div class="container"><div style="justify-self: baseline"></div></div>
+    <div class="container"><div style="justify-self: last baseline"></div></div>
+    <br>
     <!-- <self-position>, part 1 -->
     <div class="container"><div style="justify-self: center"></div></div>
     <div class="container"><div style="justify-self: start"></div></div>