Bug 1496573 [wpt PR 13357] - Add offsetLeft/offsetTop tests for non-atomic inlines., a=testonly
authorMorten Stenshorne <mstensho@chromium.org>
Tue, 09 Oct 2018 04:14:19 +0000
changeset 495962 eaa0b6b2dc7579de4210325876dc0fd72516daf8
parent 495961 59b93f033ae0da6496c6783f1dd6cdad81882c61
child 495963 ca58232beff9d49be9af2ff577535a55cbc59473
push id9984
push userffxbld-merge
push dateMon, 15 Oct 2018 21:07:35 +0000
treeherdermozilla-beta@183d27ea8570 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1496573, 13357, 1261575, 596657
milestone64.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 1496573 [wpt PR 13357] - Add offsetLeft/offsetTop tests for non-atomic inlines., a=testonly Automatic update from web-platform-testsAdd offsetLeft/offsetTop tests for non-atomic inlines. Added a comment to LayoutInline, pointing out that LayoutNG seems to be doing the right thing already, while legacy is wrong. Cq-Include-Trybots: luci.chromium.try‚Äč:linux_layout_tests_layout_ng Change-Id: I0f906dab6efa7b3d4c72a297926d542f77251052 Reviewed-on: https://chromium-review.googlesource.com/c/1261575 Reviewed-by: Koji Ishii <kojii@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/master@{#596657} -- wpt-commits: f2ffe05524fd50e3d73d2cf67c3670b8120e6556 wpt-pr: 13357
testing/web-platform/tests/css/cssom-view/offsetTopLeftInline.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom-view/offsetTopLeftInline.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mstensho@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/cssom-view-1/#extensions-to-the-htmlelement-interface">
+<link rel="match" href="../reference/nothing.html">
+<style>
+  .container {
+    float: left;
+    width: 8em;
+    height: 7em;
+    padding: 1em;
+    color: red;
+  }
+  .correctionFluid {
+    position: absolute;
+    background: white;
+
+    /* Add some fluff to cover text ink-overflow. */
+    outline:2px solid white;
+  }
+</style>
+<p>There should be nothing below.</p>
+  <div class="container" style="writing-mode:horizontal-tb;">
+    <br><span class="child">FAIL</span>
+  </div>
+  <div class="container" style="writing-mode:vertical-lr;">
+    <br><span class="child">FAIL</span>
+  </div>
+  <div class="container" style="writing-mode:vertical-rl;">
+    <br><span class="child">FAIL</span>
+  </div>
+  <div class="container" style="writing-mode:horizontal-tb; direction:rtl;">
+    <br><span class="child">FAIL</span>
+  </div>
+  <div class="container" style="writing-mode:vertical-lr; direction:rtl;">
+    <br><span class="child">FAIL</span>
+  </div>
+  <div class="container" style="writing-mode:vertical-rl; direction:rtl;">
+    <br><span class="child">FAIL</span>
+  </div>
+<script>
+  // Create a white absolutely positioned box for each span.child
+  // element and cover it.
+
+  let elements = document.querySelectorAll("span.child");
+  elements.forEach((element)=> {
+    let correctionFluid = document.createElement("div");
+    correctionFluid.className = "correctionFluid";
+    correctionFluid.style.left = element.offsetLeft + "px";
+    correctionFluid.style.top = element.offsetTop + "px";
+    correctionFluid.style.width = element.offsetWidth + "px";
+    correctionFluid.style.height = element.offsetHeight + "px";
+    document.body.appendChild(correctionFluid);
+  });
+</script>