[LayoutNG] Handle `fit-content` for block axis as `auto`
The `min-content`, `max-content`, and `fit-content` spec[1]
defines:
> If specified for the inline axis, use ...;
> otherwise behaves as the property’s initial value.
This patch fixes |HasAutoHeightOrContainingBlockWithAutoHeight|
to match to the definition.
Legacy has some other behaviors that it doesn't require to
implement this part of the spec, but LayoutNG does, due to
some different behavior and code path around percentage
resolution for replaced elements.
[1]: https://www.w3.org/TR/css-sizing-3/#valdef-width-min-content
Bug: 999913
Change-Id: I73feadee077ecbec6f23e08bb5d2b03a62eaf951
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1782187
Reviewed-by: Emil A Eklund <eae@chromium.org>
Reviewed-by: Javier Fernandez <jfernandez@igalia.com>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Commit-Queue: Koji Ishii <kojii@chromium.org>
Cr-Commit-Position: refs/heads/master@{#693476}
diff --git a/css/css-sizing/block-fit-content-as-initial-ref.html b/css/css-sizing/block-fit-content-as-initial-ref.html
new file mode 100644
index 0000000..7fdc142
--- /dev/null
+++ b/css/css-sizing/block-fit-content-as-initial-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<body>
+ <div class='parent'>
+ <img class='child' src='../support/60x60-green.png'>
+ </div>
+</body>
diff --git a/css/css-sizing/block-fit-content-as-initial.html b/css/css-sizing/block-fit-content-as-initial.html
new file mode 100644
index 0000000..7c9422c
--- /dev/null
+++ b/css/css-sizing/block-fit-content-as-initial.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<title>CSS Test: Test `fit-content` for block axis behaves the same as the initial value</title>
+<link rel="match" href="block-fit-content-as-initial-ref.html">
+<link rel="help" href="https://www.w3.org/TR/css-sizing-3/#valdef-width-fit-content-length-percentage">
+<link rel="author" title="Koji Ishii" href="mailto:kojii@chromium.org">
+<style>
+.parent {
+ height: fit-content;
+}
+.child {
+ max-height: 100%;
+}
+</style>
+<body>
+ <div class='parent'>
+ <img class='child' src='../support/60x60-green.png'>
+ </div>
+</body>
