Bug 1481329 [wpt PR 12329] - [IntersectionObserver] Fix target rect calculation for LayoutInline., a=testonly
authorStefan Zager <szager@chromium.org>
Mon, 13 Aug 2018 18:18:53 +0000
changeset 486596 083926fe16d329fee591b2b49aebc63d34061ee5
parent 486595 a420d2a71594b6a139d4b3a0f38816e5698583bb
child 486597 35015a039883d03ce9fe937c877cd3ab15acd166
push id9719
push userffxbld-merge
push dateFri, 24 Aug 2018 17:49:46 +0000
treeherdermozilla-beta@719ec98fba77 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1481329, 12329, 847623, 1164473, 581271
milestone63.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1481329 [wpt PR 12329] - [IntersectionObserver] Fix target rect calculation for LayoutInline., a=testonly Automatic update from web-platform-tests[IntersectionObserver] Fix target rect calculation for LayoutInline. BUG=847623 R=chrishtr@chromium.org Change-Id: Ib8cefc856ecbeadfdeecabcf7f20b6d3b457db6a Reviewed-on: https://chromium-review.googlesource.com/1164473 Commit-Queue: Stefan Zager <szager@chromium.org> Reviewed-by: Chris Harrelson <chrishtr@chromium.org> Cr-Commit-Position: refs/heads/master@{#581271} -- wpt-commits: 8d1a4d053fbbe9a407b150807b5804ab3ab1d839 wpt-pr: 12329
testing/web-platform/meta/MANIFEST.json
testing/web-platform/tests/intersection-observer/inline-client-rect.html
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -364456,16 +364456,22 @@
     ]
    ],
    "intersection-observer/iframe-no-root.html": [
     [
      "/intersection-observer/iframe-no-root.html",
      {}
     ]
    ],
+   "intersection-observer/inline-client-rect.html": [
+    [
+     "/intersection-observer/inline-client-rect.html",
+     {}
+    ]
+   ],
    "intersection-observer/isIntersecting-change-events.html": [
     [
      "/intersection-observer/isIntersecting-change-events.html",
      {}
     ]
    ],
    "intersection-observer/multiple-targets.html": [
     [
@@ -452196,17 +452202,17 @@
    "50ff4a5b94df68c5d20f9f46d76368f23d0d14f2",
    "support"
   ],
   "content-security-policy/securitypolicyviolation/support/testharness-helper.sub.js": [
    "816b88fc6e47278aa469fb275b8a9299ecec24cc",
    "support"
   ],
   "content-security-policy/securitypolicyviolation/targeting.html": [
-   "10b96e9e61da890ac1f53124441083efb03d00c1",
+   "28ca32e3dcc345fff5e187eee24e124cdbb250d4",
    "testharness"
   ],
   "content-security-policy/securitypolicyviolation/upgrade-insecure-requests-reporting.https.html": [
    "692db02b6fc5392b08cfcfeb98b88553cb6f72bd",
    "testharness"
   ],
   "content-security-policy/securitypolicyviolation/upgrade-insecure-requests-reporting.https.html.headers": [
    "b8bec0b95e3955cada8d5ddbd8af354cc60026f0",
@@ -605271,16 +605277,20 @@
   "intersection-observer/idlharness.window.js": [
    "2059e1ce638b5f2cac4e4f013c567a56894599a0",
    "testharness"
   ],
   "intersection-observer/iframe-no-root.html": [
    "e37aeac5530f348328274f9f8a2eeae9f08609ff",
    "testharness"
   ],
+  "intersection-observer/inline-client-rect.html": [
+   "0bdfc8de24458e0fb490de4f00537197c0662e53",
+   "testharness"
+  ],
   "intersection-observer/isIntersecting-change-events.html": [
    "f9362c3024c2003ac03c1e789c54486830710c92",
    "testharness"
   ],
   "intersection-observer/multiple-targets.html": [
    "525c5a699d1cc51080bebc650ae377b26c2fe7eb",
    "testharness"
   ],
@@ -653588,17 +653598,17 @@
    "db4b880d1ac883ad5b6d688b59824f8baed4ecf3",
    "testharness"
   ],
   "xhr/overridemimetype-done-state.any.js": [
    "bdf49e1ca52e76eff6b07c12e10a0320417236a0",
    "testharness"
   ],
   "xhr/overridemimetype-edge-cases.window.js": [
-   "6dfe755b767e78b60d0828c29d2b9c57e82e3be7",
+   "192a696759c4b82852eee753f417fb8a4cf2718d",
    "testharness"
   ],
   "xhr/overridemimetype-headers-received-state-force-shiftjis.htm": [
    "578e28cb2277b1c9bd5c7bf3bfd2731944d767bc",
    "testharness"
   ],
   "xhr/overridemimetype-invalid-mime-type.htm": [
    "506aff841942c8a6bd0893cc276b5bacb00458b6",
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/intersection-observer/inline-client-rect.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<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: 120px;
+  left: 0;
+}
+#scroller {
+  width: 250px;
+  overflow: auto;
+}
+#overflow {
+  width: 1000px;
+}
+.content {
+  width: 100px;
+  height: 20px;
+  padding: 40px 0;
+  text-align: center;
+  background-color: grey;
+  display: inline-block;
+}
+</style>
+
+<div id="scroller">
+  <div id="overflow">
+    <span><div class="content">1</div></span>
+    <span><div class="content">2</div></span>
+    <span><div class="content">3</div></span>
+    <span id="target"><div class="content">4</div></span>
+    <span><div class="content">5</div></span>
+  </div>
+</div>
+
+<script>
+var vw = document.documentElement.clientWidth;
+var vh = document.documentElement.clientHeight;
+
+var entries = [];
+var scroller, target, spaceWidth, targetOffsetLeft, targetOffsetTop;
+
+runTestCycle(function() {
+  scroller = document.getElementById("scroller");
+  assert_true(!!scroller, "scroller exists");
+  target = document.getElementById("target");
+  assert_true(!!target, "target exists");
+  var observer = new IntersectionObserver(function(changes) {
+    entries = entries.concat(changes)
+  });
+  observer.observe(target);
+  entries = entries.concat(observer.takeRecords());
+  assert_equals(entries.length, 0, "No initial notifications.");
+  runTestCycle(step0, "First rAF");
+}, "Inline target");
+
+function step0() {
+  // Measure space width between two adjacent inlines.
+  let nextEl = target.nextElementSibling;
+  spaceWidth = nextEl.offsetLeft - target.offsetLeft - target.offsetWidth;
+  // 8px body margin + 3 preceding siblings @ (100px width + spaceWidth) each
+  targetOffsetLeft = 8 + 300 + (spaceWidth * 3);
+  // 8px body margin + 40px top padding
+  targetOffsetTop = 48;
+  let left = targetOffsetLeft;
+  let right = left + 100;
+  let top = targetOffsetTop;
+  let bottom = top + target.offsetHeight;
+
+  scroller.scrollLeft = 90;
+  runTestCycle(step1, "scroller.scrollLeft = 90");
+
+  checkLastEntry(entries, 0, [left, right, top, bottom,
+                              0, 0, 0, 0, 0, vw, 0, vh, false]);
+}
+
+function step1() {
+  // -90px for scroll offset
+  let left = targetOffsetLeft - 90;
+  let right = left + 100;
+  let top = targetOffsetTop;
+  let bottom = top + target.offsetHeight;
+  // 8px body margin + 250px client width of scroller
+  let scrollerRight = 258;
+  checkLastEntry(entries, 1, [left, right, top, bottom,
+                              left, scrollerRight, top, bottom,
+                              0, vw, 0, vh, true]);
+}
+</script>