Bug 1443500 [wpt PR 9876] - Computed style inside iframe depends on parent layout., a=testonly
authorRune Lillesveen <futhark@chromium.org>
Mon, 09 Apr 2018 14:33:43 +0000
changeset 466986 617aa7ff212bde9c77dcfece83952e9187f510f3
parent 466985 861650deaddc7dfc160136f40bf3f7c83c504e09
child 466987 08d9920b8266a41addf1625047172b868260c062
push id9165
push userasasaki@mozilla.com
push dateThu, 26 Apr 2018 21:04:54 +0000
treeherdermozilla-beta@064c3804de2e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1443500, 819189, 951248, 542372
milestone61.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 1443500 [wpt PR 9876] - Computed style inside iframe depends on parent layout., a=testonly Automatic update from web-platform-testsComputed style inside iframe depends on parent layout. Make sure we layout the parent document when it's dirty. Bug: 819189 Change-Id: I3835aa913e20abdd4adaab072567191b3ca25c20 Reviewed-on: https://chromium-review.googlesource.com/951248 Commit-Queue: Rune Lillesveen <futhark@chromium.org> Reviewed-by: Steve Kobes <skobes@chromium.org> Cr-Commit-Position: refs/heads/master@{#542372} wpt-commits: 412da2ce773bad16d42a7339962e2057a410617a wpt-pr: 9876 wpt-commits: 412da2ce773bad16d42a7339962e2057a410617a wpt-pr: 9876
testing/web-platform/meta/MANIFEST.json
testing/web-platform/tests/css/cssom/computed-style-002.html
testing/web-platform/tests/css/cssom/computed-style-003.html
testing/web-platform/tests/css/cssom/computed-style-004.html
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -318525,16 +318525,34 @@
     ]
    ],
    "css/cssom/computed-style-001.html": [
     [
      "/css/cssom/computed-style-001.html",
      {}
     ]
    ],
+   "css/cssom/computed-style-002.html": [
+    [
+     "/css/cssom/computed-style-002.html",
+     {}
+    ]
+   ],
+   "css/cssom/computed-style-003.html": [
+    [
+     "/css/cssom/computed-style-003.html",
+     {}
+    ]
+   ],
+   "css/cssom/computed-style-004.html": [
+    [
+     "/css/cssom/computed-style-004.html",
+     {}
+    ]
+   ],
    "css/cssom/css-style-attr-decl-block.html": [
     [
      "/css/cssom/css-style-attr-decl-block.html",
      {}
     ]
    ],
    "css/cssom/css-style-attribute-modifications.html": [
     [
@@ -532370,16 +532388,28 @@
   "css/cssom/StyleSheetList.html": [
    "3a0e6f64f70f863d679e537c4bfb76aaa0d3598a",
    "testharness"
   ],
   "css/cssom/computed-style-001.html": [
    "0331a648e6b0d56f0e7365f1ff7d991ea77ce3e4",
    "testharness"
   ],
+  "css/cssom/computed-style-002.html": [
+   "d6579788bcfaf1d4c09324ba877a26ff95d6965d",
+   "testharness"
+  ],
+  "css/cssom/computed-style-003.html": [
+   "aece414b89e0fdea1030e4ca9011ab7d22f1b275",
+   "testharness"
+  ],
+  "css/cssom/computed-style-004.html": [
+   "55010cf90dc7fc2ef8ec6cbd13d1ec947a823aed",
+   "testharness"
+  ],
   "css/cssom/css-style-attr-decl-block.html": [
    "1d68a3fd1560308c0d2f3478864d84f4361e4ab9",
    "testharness"
   ],
   "css/cssom/css-style-attribute-modifications.html": [
    "9199534f3b6cc473832562b1701ade3a05dde172",
    "testharness"
   ],
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom/computed-style-002.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<title>CSS Test: getComputedStyle - resolved width in iframe</title>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org" />
+<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<iframe id="frm" width="100"></iframe>
+<script>
+  test(() => {
+    const frmDoc = frm.contentWindow.document;
+    frmDoc.open();
+    frmDoc.write('<body style="margin:0"><div style="width:100%"></div>');
+    frmDoc.close();
+
+    assert_equals(frm.contentWindow.getComputedStyle(frmDoc.querySelector("div")).width, "100px");
+  }, "Check that a percent width in an iframe is resolved against iframe width for getComputedStyle.");
+</script>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom/computed-style-003.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<title>CSS Test: getComputedStyle - resolved width in iframe dynamic display</title>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org" />
+<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<iframe id="frm" width="100" style="display:none"></iframe>
+<script>
+  const frmDoc = frm.contentWindow.document;
+  frmDoc.open();
+  frmDoc.write('<body style="margin:0"><div style="width:100%"></div>');
+  frmDoc.close();
+
+  document.body.offsetWidth; // Make sure we layout the top document.
+
+  test(() => {
+    frm.style.display = "inline";
+    assert_equals(frm.contentWindow.getComputedStyle(frmDoc.querySelector("div")).width, "100px");
+  }, "Check that a percent width in an iframe is the resolved width when the iframe is displayed.");
+</script>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom/computed-style-004.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<title>CSS Test: getComputedStyle - resolved width in nested iframes dynamic width</title>
+<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org" />
+<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-values" />
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<iframe id="outer" width="100" scrolling="no" frameborder="0"></iframe>
+<script>
+  const outerDoc = outer.contentWindow.document;
+  outerDoc.open();
+  outerDoc.write('<body style="margin:0"><iframe id="inner" scrolling="no" frameborder="0" style="width:100%"></iframe>');
+  outerDoc.close();
+
+  const innerWindow = outerDoc.querySelector("#inner").contentWindow;
+  const innerDoc = innerWindow.document;
+  innerDoc.open();
+  innerDoc.write('<body style="margin:0"><div style="width:100%"></div>');
+  innerDoc.close();
+  innerDoc.body.offsetWidth; // Make sure we layout the top document.
+
+  test(() => {
+    assert_equals(innerWindow.getComputedStyle(innerDoc.querySelector("div")).width, "100px");
+  }, "Check that the initial width is 100px.");
+
+  test(() => {
+    outer.setAttribute("width", "200");
+    assert_equals(innerWindow.getComputedStyle(innerDoc.querySelector("div")).width, "200px");
+  }, "Check that the resolved width of the inner div is affected by changing the width of outer iframe.");
+</script>