Bug 1584890 Part 1 - Use nsFrameConstructorState::AddChild() to construct out-of-flow flex or grid container as the root element. r=dholbert
☠☠ backed out by ec14e039b76a ☠ ☠
authorTing-Yu Lin <tlin@mozilla.com>
Wed, 20 May 2020 22:32:06 +0000
changeset 531347 84d138356c7699456abf8dc6483b1d49aab86771
parent 531346 a78e5e6ccaccbeb5da910750a83e6919a9fa1057
child 531348 1da2faea06e80d252561993b9976a7777d911bbe
push id37438
push userabutkovits@mozilla.com
push dateThu, 21 May 2020 09:36:57 +0000
treeherdermozilla-central@2d00a1a6495c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdholbert
bugs1584890
milestone78.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 1584890 Part 1 - Use nsFrameConstructorState::AddChild() to construct out-of-flow flex or grid container as the root element. r=dholbert If `contentFrame` is out-of-flow, nsFrameConstructorState::AddChild() can construct a placeholder frame for `contentFrame` and put the placeholder in `frameList`. Also, we need to use nsFrameConstructorState::GetGeometricParent() to get the correct parent when calling InitAndRestoreFrame() for an out-of-flow `contentFrame`. For example, if `contentFrame` has position:fixed, its parent should be ViewportFrame, not CanvasFrame (which is mDocElementContainingBlock). This patch also adds reftests for position:absolute flex & grid root element. Reftests for position:fixed root element are in the next part. Differential Revision: https://phabricator.services.mozilla.com/D76205
layout/base/nsCSSFrameConstructor.cpp
testing/web-platform/tests/css/css-position/position-absolute-root-element-flex.html
testing/web-platform/tests/css/css-position/position-absolute-root-element-grid.html
testing/web-platform/tests/css/css-position/position-absolute-root-element-ref.html
--- a/layout/base/nsCSSFrameConstructor.cpp
+++ b/layout/base/nsCSSFrameConstructor.cpp
@@ -2299,19 +2299,22 @@ nsIFrame* nsCSSFrameConstructor::Constru
              display->mDisplay == StyleDisplay::WebkitBox ||
              display->mDisplay == StyleDisplay::Grid ||
              (StaticPrefs::layout_css_emulate_moz_box_with_flex() &&
               display->mDisplay == StyleDisplay::MozBox)) {
     auto func = display->mDisplay == StyleDisplay::Grid
                     ? NS_NewGridContainerFrame
                     : NS_NewFlexContainerFrame;
     contentFrame = func(mPresShell, computedStyle);
-    InitAndRestoreFrame(state, aDocElement, mDocElementContainingBlock,
-                        contentFrame);
-    frameList = {contentFrame, contentFrame};
+    InitAndRestoreFrame(
+        state, aDocElement,
+        state.GetGeometricParent(*display, mDocElementContainingBlock),
+        contentFrame);
+    state.AddChild(contentFrame, frameList, aDocElement,
+                   mDocElementContainingBlock);
     processChildren = true;
 
     contentFrame->AddStateBits(NS_FRAME_CAN_HAVE_ABSPOS_CHILDREN);
     if (display->IsAbsPosContainingBlock(contentFrame)) {
       state.PushAbsoluteContainingBlock(contentFrame, contentFrame,
                                         absoluteSaveState);
     }
   } else if (display->mDisplay == StyleDisplay::Table) {
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/position-absolute-root-element-flex.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+  <meta charset="UTF-8">
+  <title>CSS Position: Box inset properties & position:absolute flex container as the root element</title>
+  <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
+  <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+  <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
+  <link rel="help" href="https://drafts.csswg.org/css-position-3/#insets">
+  <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1584890">
+  <link rel="match" href="position-absolute-root-element-ref.html">
+  <meta name="assert" content="This test verifies the box inset properties on a position:absolute flex container root element.">
+
+  <style>
+  html {
+    display: flex;
+    position: absolute;
+    left: 10px;
+    right: 20px;
+    top: 30px;
+    bottom: 40px;
+    border: 5px dashed black;
+    box-sizing: border-box;
+  }
+  </style>
+
+  The black border should encompass the whole viewport,
+  with a bit of space on each side.
+  <br><br>
+  It shouldn't just shrinkwrap this text's height.
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/position-absolute-root-element-grid.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+  <meta charset="UTF-8">
+  <title>CSS Position: Box inset properties & position:absolute grid container as the root element</title>
+  <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
+  <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+  <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
+  <link rel="help" href="https://drafts.csswg.org/css-position-3/#insets">
+  <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1584890">
+  <link rel="match" href="position-absolute-root-element-ref.html">
+  <meta name="assert" content="This test verifies the box inset properties on a position:absolute grid container root element.">
+
+  <style>
+  html {
+    display: grid;
+    position: absolute;
+    left: 10px;
+    right: 20px;
+    top: 30px;
+    bottom: 40px;
+    border: 5px dashed black;
+    box-sizing: border-box;
+  }
+  </style>
+
+  The black border should encompass the whole viewport,
+  with a bit of space on each side.
+  <br><br>
+  It shouldn't just shrinkwrap this text's height.
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-position/position-absolute-root-element-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+  <meta charset="UTF-8">
+  <title>CSS Position Reference: Box inset properties & position:absolute root element</title>
+  <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
+  <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+  <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
+
+  <style>
+  html {
+    display: block;
+    position: absolute;
+    left: 10px;
+    right: 20px;
+    top: 30px;
+    bottom: 40px;
+    border: 5px dashed black;
+    box-sizing: border-box;
+  }
+  </style>
+
+  The black border should encompass the whole viewport,
+  with a bit of space on each side.
+  <br><br>
+  It shouldn't just shrinkwrap this text's height.
+</html>