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

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

Issue 2005593002: Initial ResizeObserver implementation (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fix global-interface-listing test Created 4 years, 5 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
Index: third_party/WebKit/LayoutTests/resize-observer/observe.html
diff --git a/third_party/WebKit/LayoutTests/resize-observer/observe.html b/third_party/WebKit/LayoutTests/resize-observer/observe.html
new file mode 100644
index 0000000000000000000000000000000000000000..595b98ece314eee96ceb01359cd58d095ecde8fd
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/resize-observer/observe.html
@@ -0,0 +1,103 @@
+<!doctype html>
+<head>
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="./resources/resizeTestHelper.js"></script>
+</head>
+<p>ResizeObserver tests</p>
+<div id="target1" style="width:100px;height:100px;">t1</div>
+<div id="target2" style="width:100px;height:100px;">t2</div>
+<script>
+'use strict';
+
+var helper = new ResizeTestHelper();
+
+let t1 = document.querySelector('#target1');
+let t2 = document.querySelector('#target2');
+
+function test0() {
+ helper.createTest(
+ "simple observation",
+ _ => {
+ helper.observer.disconnect();
+ helper.observer.observe(t1);
+ t1.style.width = "5px";
+ },
+ entries => {
+ assert_equals(entries.length, 1, "1 pending notification");
+ assert_equals(entries[0].target, t1, "target is t1");
+ assert_equals(entries[0].contentRect.width, 5, "target width");
+ test1();
+ }
+ );
+}
+
+function test1() {
+ helper.createTest(
+ "multiple observation on same element trigger only one",
+ _ => {
+ helper.observer.disconnect();
+ helper.observer.observe(t1);
+ helper.observer.observe(t1);
+ t1.style.width = "10px";
+ },
+ entries => {
+ assert_equals(entries.length, 1, "1 pending notification");
+ test2();
+ }
+ );
+}
+
+function test2() {
+ test(_ => {
+ assert_throws(null, _=> {
+ helper.observer.observe({});
+ });
+ test3();
+ },
+ "throw exception when observing non-element"
+ );
+}
+
+function test3() {
+ helper.createTest(
+ "disconnect stops all notifications",
+ _ => {
+ helper.observer.observe(t1);
+ helper.observer.observe(t2);
+ helper.observer.disconnect();
+ t1.style.width = "30px";
+ },
+ entries => {
+ assert_unreached("no entries should happen");
+ },
+ _ => {
+ // timeout happened, all is well.
+ test4();
+ }
+ );
+}
+
+function test4() {
+ helper.createTest(
+ "unobserve target stops notifications, unobserve non-observed does nothing",
+ _ => {
+ helper.observer.disconnect();
+ helper.observer.observe(t1);
+ helper.observer.observe(t2);
+ helper.observer.unobserve(t1);
+ helper.observer.unobserve(document.body);
+ t1.style.width = "40px";
+ t2.style.width = "40px";
+ },
+ entries => {
+ assert_equals(entries.length, 1, "only t2");
+ assert_equals(entries[0].target, t2, "t2 was observed");
+ }
+ );
+}
+
+test0();
+helper.startTests();
+
+</script>

Powered by Google App Engine
This is Rietveld 408576698