| Index: third_party/WebKit/LayoutTests/resize-observer/eventloop.html
|
| diff --git a/third_party/WebKit/LayoutTests/resize-observer/eventloop.html b/third_party/WebKit/LayoutTests/resize-observer/eventloop.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..8a3b2878f36f8325ba73d183f95728b8a7b03ae3
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/resize-observer/eventloop.html
|
| @@ -0,0 +1,198 @@
|
| +<!doctype html>
|
| +<head>
|
| + <script src="../resources/testharness.js"></script>
|
| + <script src="../resources/testharnessreport.js"></script>
|
| + <script src="./resources/resizeTestHelper.js"></script>
|
| + <style>
|
| + div {
|
| + border: 1px dotted gray
|
| + }
|
| + </style>
|
| +</head>
|
| +<p>ResizeObserver notification event loop tests</p>
|
| +<div id="target1" style="width:100px;height:100px;">t1
|
| +</div>
|
| +<script>
|
| +'use strict';
|
| +
|
| +var helper = new ResizeTestHelper();
|
| +
|
| +let t1 = document.querySelector('#target1');
|
| +
|
| +// allow uncaught exception because ResizeObserver posts exceptions
|
| +// to window error handler when limit is exceeded.
|
| +// This codepath is tested in this file.
|
| +
|
| +setup({allow_uncaught_exception: true});
|
| +
|
| +var onErrorCalled = false;
|
| +
|
| +window.onerror = err => {
|
| + onErrorCalled = true;
|
| +}
|
| +
|
| +function test0() {
|
| +
|
| + let divs = [t1];
|
| +
|
| + helper.createTest(
|
| + "test0: multiple notifications inside same event loop",
|
| + setup => {
|
| + onErrorCalled = false;
|
| + helper.observer.disconnect();
|
| + let t2 = document.createElement('div');
|
| + let t3 = document.createElement('div');
|
| + t2.appendChild(t3);
|
| + t1.appendChild(t2);
|
| + divs.push(t2);
|
| + divs.push(t3);
|
| + helper.observer.observe(t1);
|
| + helper.observer.observe(t2);
|
| + helper.observer.observe(t3);
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 3, "3 notifications");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| + let rAF = 0;
|
| +
|
| + // This test happens in the same Resize notification loop,
|
| + // only t2 and t3 get notified
|
| + helper.createTest(
|
| + "test0: multiple notifications pt 2",
|
| + setup => {
|
| + divs.forEach( el => { el.style.width = "101px";});
|
| + window.requestAnimationFrame(_ => { rAF++; });
|
| + },
|
| + entries => {
|
| + // t1 is not delivered
|
| + assert_equals(entries.length, 2, "2 notifications");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| + // Only t3 gets notified, t2 and t1 are not deep enough
|
| + helper.createTest(
|
| + "test0: multiple notifications pt 3",
|
| + setup => {
|
| + divs.forEach( el => { el.style.width = "102px";});
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 1, "1 notifications");
|
| + assert_equals(rAF, 0, "same loop");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| + // t1 and t2 get notified
|
| + helper.createTest(
|
| + "test0: multiple notifications pt 4, new loop",
|
| + setup => {
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 2, "2 notifications");
|
| + assert_equals(rAF, 1, "new loop");
|
| + assert_equals(onErrorCalled, true, "error was fired");
|
| + helper.observer.disconnect();
|
| + while (t1.childNodes.length > 0)
|
| + t1.removeChild(t1.childNodes[0]);
|
| + test1();
|
| + }
|
| + );
|
| +
|
| + helper.nextTestRaf();
|
| +}
|
| +
|
| +function test1() {
|
| +
|
| + var resizers = [t1];
|
| + // Testing depths of shadow roots
|
| + // DOM: t1 <- t2 <- t3 <-shadow- t4 <- t5
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot",
|
| + setup => {
|
| + onErrorCalled = false;
|
| +
|
| + let t2 = document.createElement('div');
|
| + t1.appendChild(t2);
|
| + resizers.push(t2);
|
| + let t3 = document.createElement('div');
|
| + resizers.push(t3);
|
| + t2.appendChild(t3);
|
| + let shadow = t3.createShadowRoot();
|
| + let t4 = document.createElement('div');
|
| + resizers.push(t4);
|
| + shadow.appendChild(t4);
|
| + let t5 = document.createElement('div');
|
| + resizers.push(t5);
|
| + t4.appendChild(t5);
|
| + resizers.forEach( el => helper.observer.observe(el) );
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 5, "all entries resized");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| +
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot",
|
| + setup => {
|
| + resizers.forEach( el => el.style.width = "111px" );
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 4, "depth limited");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| +
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot",
|
| + setup => {
|
| + resizers.forEach( el => el.style.width = "112px" );
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 3, "depth limited");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| +
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot",
|
| + setup => {
|
| + resizers.forEach( el => el.style.width = "113px" );
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 2, "depth limited");
|
| + helper.nextTest();
|
| + }
|
| + );
|
| +
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot",
|
| + setup => {
|
| + resizers.forEach( el => el.style.width = "114px" );
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 1, "depth limited");
|
| + helper.nextTestRaf();
|
| + }
|
| + );
|
| +
|
| + helper.createTest(
|
| + "test1: limit with shadowRoot end",
|
| + setup => {
|
| + },
|
| + entries => {
|
| + assert_equals(entries.length, 4, "limit notifications");
|
| + assert_equals(onErrorCalled, true, "breached limit");
|
| + helper.observer.disconnect();
|
| + t1.removeChild(t1.firstChild);
|
| + }
|
| + );
|
| +
|
| + helper.nextTestRaf();
|
| +}
|
| +
|
| +test0();
|
| +
|
| +</script>
|
| +
|
|
|