Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1952)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: third_party/WebKit/LayoutTests/resize-observer/notify.html

Issue 2242773003: Revert of ResizeObserver pt6: integration (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 4 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
Download patch
« no previous file with comments | « third_party/WebKit/LayoutTests/resize-observer/eventloop.html ('k') | third_party/WebKit/LayoutTests/resize-observer/observe.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/LayoutTests/resize-observer/notify.html
diff --git a/third_party/WebKit/LayoutTests/resize-observer/notify.html b/third_party/WebKit/LayoutTests/resize-observer/notify.html
deleted file mode 100644
index b4faf39068c65f6235788b93abdcdf5c946a7b24..0000000000000000000000000000000000000000
--- a/third_party/WebKit/LayoutTests/resize-observer/notify.html
+++ /dev/null
@@ -1,361 +0,0 @@
-<!doctype html>
-<script src="../resources/testharness.js"></script>
-<script src="../resources/testharnessreport.js"></script>
-<script src="./resources/resizeTestHelper.js"></script>
-<style>
- div {
- border: 1px dotted gray
- }
- .transform {
- transform: scale(2,2) rotate(90deg)
- }
-</style>
-<p>ResizeObserver tests</p>
-<div id="target1" style="width:100px;height:100px;">t1
- <div id="target2" style="width:100px;height:100px;">t2
- <div id="target3" style="width:100px;height:100px;">t3
- <span id="inline">inline</span>
- </div>
- </div>
-</div>
-<div id="absolute" style="width:100.5px;height:100.5px;position:absolute;top:10.3px;left:10.3px"></div>
-<script>
-'use strict';
-
-var helper = new ResizeTestHelper();
-
-let t1 = document.querySelector('#target1');
-let t2 = document.querySelector('#target2');
-let t3 = document.querySelector('#target3');
-let abs = document.querySelector('#absolute');
-let inline = document.querySelector('#inline');
-
-function test0() {
- helper.createTest(
- "test0: notification ordering",
- setup => {
- helper.observer.observe(t3);
- helper.observer.observe(t2);
- helper.observer.observe(t1);
- t1.style.width = "5px";
- t3.style.width = "5px";
- t2.style.width = "5px";
-
- },
- entries => {
- assert_equals(entries.length, 3, "3 resizes");
- assert_equals(entries[0].target, t3, "ordering");
- assert_equals(entries[1].target, t2, "ordering");
- assert_equals(entries[2].target, t1, "ordering");
- helper.observer.disconnect();
- t1.style.width = "100px";
- t2.style.width = "100px";
- t3.style.width = "100px";
- test1();
- }
- );
- helper.nextTestRaf();
-}
-
-function test1() {
- helper.createTest(
- "test1: display:none triggers notification",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(t1);
- },
- entries => {
- // initial observation happens here
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "display:none triggers notification, part 2",
- setup => {
- t1.style.display = "none";
- },
- entries => {
- helper.observer.disconnect();
- t1.style.display = "";
- test2();
- }
- );
- helper.nextTestRaf();
-}
-
-
-function test2() {
- helper.createTest(
- "test2: remove/reinsert",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(t1);
- },
- entries => {
- // initial observation
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "removeChild triggers notification",
- setup => {
- t1.parentNode.removeChild(t1);
- },
- entries => {
- assert_equals(entries[0].target, t1);
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "appendChild triggers notification",
- setup => {
- document.body.appendChild(t1);
- },
- entries => {
- assert_equals(entries[0].target, t1);
- test3();
- }
- );
- helper.nextTestRaf();
-}
-
-
-function test3() {
- helper.createTest(
- "test3: dimensions match",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(t1);
- t1.style.width = "200.5px";
- t1.style.height = "100px";
- t1.style.paddingLeft = "20px";
- t1.style.paddingTop = "10px";
- },
- entries => {
- assert_equals(entries[0].contentRect.left,20);
- assert_equals(entries[0].contentRect.top,10);
- assert_between_inclusive(entries[0].contentRect.width, 200.4, 200.6, "width is not rounded");
- assert_equals(entries[0].contentRect.height, 100);
- test4();
- }
- );
- helper.nextTestRaf();
-}
-
-function test4() {
- helper.createTest(
- "test4: transform do not cause notifications",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(t2);
- },
- entries => {
- // initial notification
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "transform do not cause notification, part 2",
- setup => {
- t2.classList.add("transform");
- },
- entries => {
- assert_unreached("transform must not trigger notifications");
- },
- timeout => {
- t2.classList.remove("transform");
- test5();
- }
- );
- helper.nextTestRaf();
-
-}
-
-
-function test5() {
- helper.createTest(
- "test5: moving an element does not trigger notifications",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(abs);
- },
- entries => {
- // initial observation
- helper.nextTest();
- }
- );
- helper.createTest(
- "moving an element does not trigger notifications, part 2",
- setup => {
- abs.style.top = "20.33px";
- abs.style.left = "20.33px";
- },
- entries => {
- assert_unreached("movement should not cause resize notifications");
- },
- timeout => {
- test6();
- }
- );
- helper.nextTestRaf();
-}
-
-function test6() {
- helper.createTest(
- "test6: inline element does not notify",
- setup => {
- helper.observer.disconnect();
- helper.observer.observe(inline);
- helper.observer.observe(t1);
- t1.style.width = "66px";
- inline.style.width = "66px";
- },
- entries => {
- assert_equals(entries.length, 1, "inline elements must not trigger notifications");
- assert_equals(entries[0].target, t1, "inline elements must not trigger notifications");
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "inline element that becomes block should notify",
- setup => {
- inline.style.display = "block";
- },
- entries => {
- assert_equals(entries[0].target, inline);
- helper.observer.disconnect();
- test7();
- }
- );
- helper.nextTestRaf();
-}
-
-function test7() {
- let test = async_test("test7: unobserve inside notify callback");
-
- let notifyStep = 0;
- let notify = entries => {
- switch(notifyStep) {
- case 0:
- // initial setup
- window.requestAnimationFrame( _ => {
- t1.style.width = "777px";
- t2.style.width = "777px";
- ro.unobserve(t1);
- });
- break;
- case 1:
- test.step(_ => {
- assert_equals(entries.length, 1, "only t2 is observed");
- assert_equals(entries[0].target, t2, "only t2 is observed");
- test8();
- ro.disconnect();
- test.done();
- });
- break;
- }
- notifyStep++;
- }
-
- var ro;
- window.requestAnimationFrame( _ => {
- ro = new ResizeObserver(notify);
- ro.observe(t1);
- ro.observe(t2);
- });
-}
-
-function test8() {
- let test = async_test("test8: observe inside notify callback");
-
- let notifyStep = 0;
- let notify = entries => {
- switch(notifyStep) {
- case 0:
- // intial setup
- window.requestAnimationFrame( _ => {
- ro.observe(t2);
- t2.style.width = "888px";
- });
- break;
- case 1:
- test.step( _ => {
- assert_equals(entries.length, 1, "only t2 is observed");
- assert_equals(entries[0].target, t2, "only t2 is observed");
- ro.disconnect();
- test9();
- test.done();
- });
- break;
- }
- notifyStep++;
- }
- var ro;
- window.requestAnimationFrame( _ => {
- ro = new ResizeObserver(notify);
- ro.observe(t1);
- });
-}
-
-function test9() {
- let test = async_test("test9: disconnect inside notify callback");
-
- let notifyStep = 0;
- let timeoutId = 0;
- let notify = entries => {
- switch(notifyStep) {
- case 0:
- // initial setup
- t1.style.width = "888px";
- ro.disconnect();
- timeoutId = test.step_timeout(_ => {
- test10();
- test.done();
- }, ResizeTestHelper.TIMEOUT);
- break;
- case 1:
- window.clearTimeout(timeoutId);
- test.step( _ => {
- assert_unreached("there should be no notifications after disconnect");
- });
- break;
- }
- notifyStep++;
- }
-
- var ro;
- window.requestAnimationFrame( _ => {
- ro = new ResizeObserver(notify);
- ro.observe(t1);
- });
-}
-
-function test10() {
- var parent = t1.parentNode;
- helper.createTest(
- "test10: element notifies when parent removed",
- setup => {
- helper.observer.observe(t3);
- },
- entries => {
- helper.nextTestRaf();
- }
- );
- helper.createTest(
- "test10, part 2: element notifies when parent removed",
- setup => {
- t1.parentNode.removeChild(t1);
- },
- entries => {
- assert_equals(entries.length, 1);
- assert_equals(entries[0].target, t3);
- helper.observer.disconnect();
- parent.appendChild(t1);
- }
- );
- helper.nextTestRaf();
-}
-
-test0();
-
-</script>
« no previous file with comments | « third_party/WebKit/LayoutTests/resize-observer/eventloop.html ('k') | third_party/WebKit/LayoutTests/resize-observer/observe.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698