Diff
Modified: trunk/LayoutTests/imported/w3c/resources/import-expectations.json (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/resources/import-expectations.json 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/resources/import-expectations.json 2022-06-17 17:23:42 UTC (rev 295638)
@@ -33,6 +33,7 @@
"density-size-correction": "import",
"encrypted-media": "import",
"imported/w3c/web-platform-tests/css/css-position/sticky": "import",
+ "intersection-observer": "import",
"paint-timing/": "import",
"paint-timing/fcp-only": "import",
"paint-timing/resources": "import",
Modified: trunk/LayoutTests/imported/w3c/resources/resource-files.json (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/resources/resource-files.json 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/resources/resource-files.json 2022-06-17 17:23:42 UTC (rev 295638)
@@ -233,6 +233,7 @@
"csswg-test/WOFF2-UserAgent/Tests/xhtml1/testcaseindex.xht",
"html/rendering/the-details-element/empty-crash.html",
"html/rendering/the-details-element/single-summary.html",
+ "intersection-observer/observer-in-iframe.html",
"shadow-dom/declarative/support/declarative-child-frame.html",
"shadow-dom/event-on-pseudo-element-crash.html",
"shadow-dom/imperative-slot-api-crash.html",
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none-expected.txt (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none-expected.txt 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none-expected.txt 2022-06-17 17:23:42 UTC (rev 295638)
@@ -1,6 +1,3 @@
-PASS IntersectionObserver should send a not-intersecting notification for a target that gets display:none.
-PASS Intersecting notification after first rAF.
-PASS Not-intersecting notification after setting display:none on target.
-PASS Intersecting notification after removing display:none on target.
+PASS display-none
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none.html (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none.html 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/display-none.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -25,7 +25,7 @@
var entries = [];
-runTestCycle(function() {
+promise_test(async function(t) {
var target = document.getElementById("target");
var root = document.getElementById("root");
var observer = new IntersectionObserver(function(changes) {
@@ -34,22 +34,35 @@
observer.observe(target);
entries = entries.concat(observer.takeRecords());
assert_equals(entries.length, 0, "No initial notifications.");
- runTestCycle(step0, "Intersecting notification after first rAF.");
-}, "IntersectionObserver should send a not-intersecting notification for a target that gets display:none.");
-function step0() {
- runTestCycle(step1, "Not-intersecting notification after setting display:none on target.");
- checkLastEntry(entries, 0, [8, 108, 8, 108, 8, 108, 8, 108, 0, vw, 0, vh, true]);
+ await waitForNotification();
+
+ checkLastEntry(
+ entries,
+ 0,
+ [8, 108, 8, 108, 8, 108, 8, 108, 0, vw, 0, vh, true],
+ "IntersectionObserver notification after first rAF",
+ );
target.style.display = "none";
-}
-function step1() {
- runTestCycle(step2, "Intersecting notification after removing display:none on target.");
- checkLastEntry(entries, 1, [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, false]);
+ await waitForNotification();
+
+ checkLastEntry(
+ entries,
+ 1,
+ [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, false],
+ "IntersectionObserver should send a not-intersecting notification for a target that gets display:none.",
+ );
+
target.style.display = "";
-}
-function step2() {
- checkLastEntry(entries, 2, [8, 108, 8, 108, 8, 108, 8, 108, 0, vw, 0, vh, true]);
-}
+ await waitForNotification();
+
+ checkLastEntry(
+ entries,
+ 2,
+ [8, 108, 8, 108, 8, 108, 8, 108, 0, vw, 0, vh, true],
+ "Intersecting notification after removing display:none on target.",
+ );
+});
</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-ib-split.html (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-ib-split.html 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-ib-split.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -18,6 +18,10 @@
<block></block>
</inline>
<script>
+
+// Account for rounding differences when viewport sizes can't cleanly divide.
+const epsilon = 1;
+
promise_test(async function() {
for (let element of document.querySelectorAll("inline, block")) {
let entries = await new Promise(resolve => {
@@ -28,10 +32,10 @@
assert_equals(entries[0].intersectionRatio, 1, element.nodeName + ": Should be fully intersecting");
function assert_rects_equal(r1, r2, label) {
- assert_equals(r1.top, r2.top, label + ": top should be equal");
- assert_equals(r1.right, r2.right, label + ": right should be equal");
- assert_equals(r1.bottom, r2.bottom, label + ": bottom should be equal");
- assert_equals(r1.left, r2.left, label + ": left should be equal");
+ assert_approx_equals(r1.top, r2.top, epsilon, label + ": top should be equal");
+ assert_approx_equals(r1.right, r2.right, epsilon, label + ": right should be equal");
+ assert_approx_equals(r1.bottom, r2.bottom, epsilon, label + ": bottom should be equal");
+ assert_approx_equals(r1.left, r2.left, epsilon, label + ": left should be equal");
}
assert_rects_equal(entries[0].boundingClientRect, element.getBoundingClientRect(), element.nodeName + ": boundingClientRect should match");
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2-expected.txt (0 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2-expected.txt 2022-06-17 17:23:42 UTC (rev 295638)
@@ -0,0 +1,3 @@
+
+PASS IntersectionObserver ratio with fractional bounds
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2.html (0 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<title>IntersectionObserver ratio with fractional bounds</title>
+<link rel="help" href=""
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<script src=""
+<script src=""
+
+<style>
+ #container {
+ overflow: hidden;
+ width: 500px;
+ }
+ #target {
+ display: list-item;
+ padding: 16.1px;
+ background: rebeccapurple;
+ }
+</style>
+
+<div id="container">
+ <div id="list">
+ <span id="target"></span>
+ </div>
+</div>
+
+<script>
+async_test(function(t) {
+ let target = document.getElementById("target");
+ let list = document.getElementById("list");
+ let observer = new IntersectionObserver(t.step_func_done(function(entries) {
+ assert_equals(entries.length, 1);
+ assert_equals(entries[0].intersectionRatio, 1);
+ assert_equals(entries[0].isIntersecting, true);
+ }), { root: list, threshold: 1 });
+ observer.observe(target);
+});
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-expected.txt (0 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-expected.txt 2022-06-17 17:23:42 UTC (rev 295638)
@@ -0,0 +1,3 @@
+
+PASS IntersectionObserver ratio with fractional bounds
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds.html (0 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<title>IntersectionObserver ratio with fractional bounds</title>
+<link rel="help" href=""
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<script src=""
+<script src=""
+
+<style>
+ body {
+ margin: 0;
+ }
+ #container {
+ display: flex;
+ }
+ #left {
+ height: 100px;
+ width: 0.88875%;
+ background: lightblue;
+ }
+ #target {
+ height: 100px;
+ width: 99.11125%;
+ background: rebeccapurple;
+ }
+</style>
+
+<div id="container">
+ <div id="left"></div>
+ <div id="target"></div>
+</div>
+
+<script>
+async_test(function(t) {
+ let target = document.getElementById("target");
+ let observer = new IntersectionObserver(t.step_func_done(function(entries) {
+ assert_equals(entries.length, 1);
+ assert_equals(entries[0].intersectionRatio, 1);
+ assert_equals(entries[0].isIntersecting, true);
+ }));
+ observer.observe(target);
+});
+</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/resources/intersection-observer-test-utils.js (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/resources/intersection-observer-test-utils.js 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/resources/intersection-observer-test-utils.js 2022-06-17 17:23:42 UTC (rev 295638)
@@ -71,8 +71,22 @@
// - At this point, observer.takeRecords will get the second batch of
// notifications.
function waitForNotification(t, f) {
- requestAnimationFrame(function() {
- requestAnimationFrame(function() { t.step_timeout(f, 0); });
+ return new Promise(resolve => {
+ requestAnimationFrame(function() {
+ requestAnimationFrame(function() {
+ let callback = function() {
+ resolve();
+ if (f) {
+ f();
+ }
+ };
+ if (t) {
+ t.step_timeout(callback);
+ } else {
+ setTimeout(callback);
+ }
+ });
+ });
});
}
@@ -79,8 +93,15 @@
// If you need to wait until the IntersectionObserver algorithm has a chance
// to run, but don't need to wait for delivery of the notifications...
function waitForFrame(t, f) {
- requestAnimationFrame(function() {
- t.step_timeout(f, 0);
+ return new Promise(resolve => {
+ requestAnimationFrame(function() {
+ t.step_timeout(function() {
+ resolve();
+ if (f) {
+ f();
+ }
+ });
+ });
});
}
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/v2/simple-occlusion-svg-foreign-object.html (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/v2/simple-occlusion-svg-foreign-object.html 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/v2/simple-occlusion-svg-foreign-object.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -29,7 +29,7 @@
<svg id="svg" style="display: block">
<foreignObject>
<div id="occluder"></div>
- </foreignobject>
+ </foreignObject>
</svg>
<script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/w3c-import.log (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/w3c-import.log 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/w3c-import.log 2022-06-17 17:23:42 UTC (rev 295638)
@@ -33,6 +33,8 @@
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/inline-client-rect.html
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/inline-with-block-child-client-rect.html
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-ib-split.html
+/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds-2.html
+/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/intersection-ratio-with-fractional-bounds.html
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/isIntersecting-change-events.html
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/isIntersecting-threshold.html
/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/multiple-targets.html
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/zero-area-element-visible.html (295637 => 295638)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/zero-area-element-visible.html 2022-06-17 16:23:05 UTC (rev 295637)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/intersection-observer/zero-area-element-visible.html 2022-06-17 17:23:42 UTC (rev 295638)
@@ -14,9 +14,14 @@
width: 0px;
height: 0px;
}
+#container {
+ overflow: clip;
+}
</style>
-<div id='target'></div>
+<div id="container">
+ <div id='target'></div>
+</div>
<script>
var entries = [];
