Bug 1574674 [wpt PR 18514] - [LayoutNG] Lay out flex items with ShrinkToFit in more cases, a=testonly
authorDavid Grogan <dgrogan@chromium.org>
Mon, 26 Aug 2019 11:28:29 +0000
changeset 553966 6fc8a85865f16548350106db4540573e56ac6ce3
parent 553965 82eed622a6a87ca1f9cc3a8c4e0b575141046dc8
child 553967 b29a7ed648b3de5cafc81d1d5834feb56567a6fe
push id2165
push userffxbld-merge
push dateMon, 14 Oct 2019 16:30:58 +0000
treeherdermozilla-release@0eae18af659f [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1574674, 18514, 845235, 1758992, 689232
milestone70.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 1574674 [wpt PR 18514] - [LayoutNG] Lay out flex items with ShrinkToFit in more cases, a=testonly Automatic update from web-platform-tests [LayoutNG] Lay out flex items with ShrinkToFit in more cases A row flex box's cross size of {fit,min,max}-content isn't definite, which affects the inline size of orthogonal children. Bug: 845235 Change-Id: Id08a1cf6d23e9e295e87c52d426079bc7e886b74 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1758992 Reviewed-by: Christian Biesinger <cbiesinger@chromium.org> Commit-Queue: David Grogan <dgrogan@chromium.org> Cr-Commit-Position: refs/heads/master@{#689232} -- wpt-commits: a1cec169e027d234248e36e74c29b1efae1b528c wpt-pr: 18514
testing/web-platform/tests/css/css-flexbox/fit-content-item-002.html
testing/web-platform/tests/css/css-flexbox/fit-content-item-003.html
testing/web-platform/tests/css/css-flexbox/fit-content-item-004.html
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-flexbox/fit-content-item-002.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-base-size">
+<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
+<meta name="flags" content="" />
+<meta name="assert" content="A flex container's block cross size of min-content is treated as indefinite when setting fit-content on an item for flex base sizing">
+
+<style>
+x-flexbox {
+  display: flex;
+  height: min-content;
+}
+
+.fit-content-item {
+  background: green;
+  width: 100px;
+  writing-mode: vertical-lr;
+}
+
+.height-setting-item {
+  height: 100px;
+}
+
+</style>
+
+<!-- This has to be a row flexbox whose item stretches and has vertical writing
+     mode to trigger:
+  * a cross size is needed to determine the main size (row flexbox's cross size
+    is vertical, which is the item's inline size because it has a vertical
+    writing mode)
+  * the flex item’s cross size is [...] not definite (if the item didn't
+    stretch, the definiteness of the container's cross size wouldn't matter
+    because the cross size would never be definite and the item would always get
+    fit-content)
+-->
+
+<p>Test passes if there is a filled green square.</p>
+
+<x-flexbox>
+  <div class="fit-content-item"></div>
+  <div class="height-setting-item"></div>
+</x-flexbox>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-flexbox/fit-content-item-003.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-base-size">
+<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
+<meta name="flags" content="" />
+<meta name="assert" content="A flex container's block cross size of max-content is treated as indefinite when setting fit-content on an item for flex base sizing">
+
+<style>
+x-flexbox {
+  display: flex;
+  height: max-content;
+}
+
+.fit-content-item {
+  background: green;
+  width: 100px;
+  writing-mode: vertical-lr;
+}
+
+.height-setting-item {
+  height: 100px;
+}
+
+</style>
+
+<!-- This has to be a row flexbox whose item stretches and has vertical writing
+     mode to trigger:
+  * a cross size is needed to determine the main size (row flexbox's cross size
+    is vertical, which is the item's inline size because it has a vertical
+    writing mode)
+  * the flex item’s cross size is [...] not definite (if the item didn't
+    stretch, the definiteness of the container's cross size wouldn't matter
+    because the cross size would never be definite and the item would always get
+    fit-content)
+-->
+
+<p>Test passes if there is a filled green square.</p>
+
+<x-flexbox>
+  <div class="fit-content-item"></div>
+  <div class="height-setting-item"></div>
+</x-flexbox>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-flexbox/fit-content-item-004.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-base-size">
+<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
+<meta name="flags" content="" />
+<meta name="assert" content="A flex container's block cross size of fit-content is treated as indefinite when setting fit-content on an item for flex base sizing">
+
+<style>
+x-flexbox {
+  display: flex;
+  height: fit-content;
+}
+
+.fit-content-item {
+  background: green;
+  width: 100px;
+  writing-mode: vertical-lr;
+}
+
+.height-setting-item {
+  height: 100px;
+}
+
+</style>
+
+<!-- This has to be a row flexbox whose item stretches and has vertical writing
+     mode to trigger:
+  * a cross size is needed to determine the main size (row flexbox's cross size
+    is vertical, which is the item's inline size because it has a vertical
+    writing mode)
+  * the flex item’s cross size is [...] not definite (if the item didn't
+    stretch, the definiteness of the container's cross size wouldn't matter
+    because the cross size would never be definite and the item would always get
+    fit-content)
+-->
+
+<p>Test passes if there is a filled green square.</p>
+
+<x-flexbox>
+  <div class="fit-content-item"></div>
+  <div class="height-setting-item"></div>
+</x-flexbox>