diff options
Diffstat (limited to 'testing/web-platform/tests/intersection-observer/initial-observation-with-threshold.html')
-rw-r--r-- | testing/web-platform/tests/intersection-observer/initial-observation-with-threshold.html | 61 |
1 files changed, 61 insertions, 0 deletions
diff --git a/testing/web-platform/tests/intersection-observer/initial-observation-with-threshold.html b/testing/web-platform/tests/intersection-observer/initial-observation-with-threshold.html new file mode 100644 index 0000000000..b9218b09ea --- /dev/null +++ b/testing/web-platform/tests/intersection-observer/initial-observation-with-threshold.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<meta name="viewport" content="width=device-width,initial-scale=1"> +<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; +} +.spacer { + height: calc(100vh + 100px); +} +#root { + display: inline-block; + overflow-y: scroll; + height: 240px; + border: 3px solid black; +} +#target { + width: 100px; + height: 100px; + margin: 200px 0 0 0; + background-color: green; +} +</style> + +<div id="root"> + <div id="target"></div> +</div> + +<script> +var entries = []; +var root, target; + +runTestCycle(function() { + target = document.getElementById("target"); + assert_true(!!target, "target exists"); + root = document.getElementById("root"); + assert_true(!!root, "root exists"); + var observer = new IntersectionObserver(function(changes) { + entries = entries.concat(changes) + }, { root: root, threshold: [0.5] }); + observer.observe(target); + entries = entries.concat(observer.takeRecords()); + assert_equals(entries.length, 0, "No initial notifications."); + runTestCycle(step0, "First rAF"); +}, "First observation with a threshold."); + +function step0() { + root.scrollTop = 20; + runTestCycle(step1, "root.scrollTop = 20"); + checkLastEntry(entries, 0, [ 11, 111, 211, 311, 11, 111, 211, 251, 11, 111, 11, 251, false]); +} + +function step1() { + checkLastEntry(entries, 1, [ 11, 111, 191, 291, 11, 111, 191, 251, 11, 111, 11, 251, true]); +} +</script> |