third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html - Issue 2560253004: IntersectionObserver: convert tests to testharness.js

Unified Diff: third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

Issue 2560253004: IntersectionObserver: convert tests to testharness.js (Closed)

Patch Set: Address comments Created 3 years, 11 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

« no previous file with comments | « third_party/WebKit/LayoutTests/intersection-observer/display-none-expected.txt ('k') | third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

diff --git a/third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html b/third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

index 10e9f3e55e4302fe3a8708d400b7ef5a9a033bd5..6d5ced2a2ab03dc7c0a6ad12459be492f8be0cfe 100644

--- a/third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

+++ b/third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

@@ -1,7 +1,14 @@

<!DOCTYPE html>

-<script src="../resources/js-test.js"></script>

-<script src="../resources/intersection-observer-helper-functions.js"></script>

+<script src="../resources/testharness.js"></script>

+<script src="../resources/testharnessreport.js"></script>

+<script src="./resources/intersection-observer-test-utils.js"></script>

<style>

+pre, #log {

+ position: absolute;

+ top: 0;

+ left: 200px;

#root {

width: 200px;

height: 200px;

@@ -11,79 +18,52 @@

background-color: green;

}

</style>

</div>

-description("Verifies that IntersectionObserver detects edge-inclusive intersections.");

-var root = document.getElementById('root');

-var target = document.getElementById('target');

var entries = [];

-var observer = new IntersectionObserver(

- changes => { entries.push(...changes) },

- { root: root }

-);

-onload = function() {

+runTestCycle(function() {

+ assert_equals(window.innerWidth, 800, "Window must be 800 pixels wide.");

+ assert_equals(window.innerHeight, 600, "Window must be 600 pixels high.");

+ var root = document.getElementById('root');

+ assert_true(!!root, "root element exists.");

+ var target = document.getElementById('target');

+ assert_true(!!target, "target element exists.");

+ var observer = new IntersectionObserver(function(changes) {

+ entries = entries.concat(changes);

+ }, { root: root });

observer.observe(target);

- entries.push(...observer.takeRecords());

- shouldBeEqualToNumber("entries.length", 0);

- waitForNotification(step0);

-};

+ entries = entries.concat(observer.takeRecords());

+ assert_equals(entries.length, 0, "No initial notifications.");

+ runTestCycle(step0, "No notifications after first rAF.");

+}, "IntersectionObserver should detect and report edge-adjacent and zero-area intersections.");

function step0() {

- shouldBeEqualToNumber("entries.length", 0);

- waitForNotification(step1);

+ runTestCycle(step1, "Set transform=translateY(200px) on target.");

+ assert_equals(entries.length, 0, "entries.length");

target.style.transform = "translateY(200px)";

}

function step1() {

- shouldBeEqualToNumber("entries.length", 1);

- if (entries.length > 0) {

- shouldBeEqualToNumber("entries[0].boundingClientRect.left", 8);

- shouldBeEqualToNumber("entries[0].boundingClientRect.right", 108);

- shouldBeEqualToNumber("entries[0].boundingClientRect.top", 208);

- shouldBeEqualToNumber("entries[0].boundingClientRect.bottom", 308);

- shouldBeEqualToNumber("entries[0].intersectionRect.left", 8);

- shouldBeEqualToNumber("entries[0].intersectionRect.right", 108);

- shouldBeEqualToNumber("entries[0].intersectionRect.top", 208);

- shouldBeEqualToNumber("entries[0].intersectionRect.bottom", 208);

- shouldBeEqualToNumber("entries[0].rootBounds.left", 8);

- shouldBeEqualToNumber("entries[0].rootBounds.right", 208);

- shouldBeEqualToNumber("entries[0].rootBounds.top", 8);

- shouldBeEqualToNumber("entries[0].rootBounds.bottom", 208);

- shouldEvaluateToSameObject("entries[0].target", target);

- }

- waitForNotification(step2);

+ runTestCycle(step2, "Set transform=translateY(201px) on target.");

+ checkLastEntry(entries, 0, [8, 108, 208, 308, 8, 108, 208, 208, 8, 208, 8, 208, target]);

target.style.transform = "translateY(201px)";

}

function step2() {

- shouldBeEqualToNumber("entries.length", 2);

- waitForNotification(step3);

+ runTestCycle(step3, "Set transform=translateY(185px) on target.");

+ checkLastEntry(entries, 1);

target.style.height = "0px";

target.style.width = "300px";

target.style.transform = "translateY(185px)";

}

function step3() {

- shouldBeEqualToNumber("entries.length", 3);

- if (entries.length > 2) {

- shouldBeEqualToNumber("entries[2].boundingClientRect.left", 8);

- shouldBeEqualToNumber("entries[2].boundingClientRect.right", 308);

- shouldBeEqualToNumber("entries[2].boundingClientRect.top", 193);

- shouldBeEqualToNumber("entries[2].boundingClientRect.bottom", 193);

- shouldBeEqualToNumber("entries[2].intersectionRect.left", 8);

- shouldBeEqualToNumber("entries[2].intersectionRect.right", 208);

- shouldBeEqualToNumber("entries[2].intersectionRect.top", 193);

- shouldBeEqualToNumber("entries[2].intersectionRect.bottom", 193);

- shouldBeEqualToNumber("entries[2].rootBounds.left", 8);

- shouldBeEqualToNumber("entries[2].rootBounds.right", 208);

- shouldBeEqualToNumber("entries[2].rootBounds.top", 8);

- shouldBeEqualToNumber("entries[2].rootBounds.bottom", 208);

- shouldEvaluateToSameObject("entries[2].target", target);

- }

- finishJSTest();

+ checkLastEntry(entries, 2, [8, 308, 193, 193, 8, 208, 193, 193, 8, 208, 8, 208, target]);

}

</script>