Bug 1909773 part 4: Add support for '-webkit-fill-available' as an alias for the CSS 'stretch' behavior (off-by-default for now). r=emilio
Both '-webkit-fill-available' and 'stretch' are equivalent to '-moz-available' at this point in the patch series, and both are off-by-default, because actually supporting them would require that we add special logic to handle them as block-axis sizes (which I'll do in a separate bug). Differential Revision: https://phabricator.services.mozilla.com/D217687
This commit is contained in:
@@ -4797,6 +4797,7 @@ class nsIFrame : public nsQueryFrame {
|
||||
return mozilla::Some(ExtremumLength::MaxContent);
|
||||
case SizeOrMaxSize::Tag::MozAvailable:
|
||||
return mozilla::Some(ExtremumLength::MozAvailable);
|
||||
case SizeOrMaxSize::Tag::WebkitFillAvailable:
|
||||
case SizeOrMaxSize::Tag::Stretch:
|
||||
return mozilla::Some(ExtremumLength::Stretch);
|
||||
case SizeOrMaxSize::Tag::FitContent:
|
||||
|
||||
@@ -828,14 +828,14 @@ inline bool StyleFlexBasis::IsAuto() const {
|
||||
return IsSize() && AsSize().IsAuto();
|
||||
}
|
||||
|
||||
#define IMPL_BEHAVES_LIKE_SIZE_METHODS(ty_, isInitialValMethod_) \
|
||||
template <> \
|
||||
inline bool ty_::BehavesLikeStretchOnInlineAxis() const { \
|
||||
return IsStretch() || IsMozAvailable(); \
|
||||
} \
|
||||
template <> \
|
||||
inline bool ty_::BehavesLikeInitialValueOnBlockAxis() const { \
|
||||
return isInitialValMethod_() || !IsLengthPercentage(); \
|
||||
#define IMPL_BEHAVES_LIKE_SIZE_METHODS(ty_, isInitialValMethod_) \
|
||||
template <> \
|
||||
inline bool ty_::BehavesLikeStretchOnInlineAxis() const { \
|
||||
return IsStretch() || IsMozAvailable() || IsWebkitFillAvailable(); \
|
||||
} \
|
||||
template <> \
|
||||
inline bool ty_::BehavesLikeInitialValueOnBlockAxis() const { \
|
||||
return isInitialValMethod_() || !IsLengthPercentage(); \
|
||||
}
|
||||
|
||||
IMPL_BEHAVES_LIKE_SIZE_METHODS(StyleSize, IsAuto)
|
||||
|
||||
@@ -2113,8 +2113,18 @@ static void SetValueToExtremumLength(nsROCSSPrimitiveValue* aValue,
|
||||
return aValue->SetString("min-content");
|
||||
case nsIFrame::ExtremumLength::MozAvailable:
|
||||
return aValue->SetString("-moz-available");
|
||||
case nsIFrame::ExtremumLength::Stretch:
|
||||
case nsIFrame::ExtremumLength::Stretch: {
|
||||
// By default we serialize this value using the standard "stretch"
|
||||
// keyword. The exception is when that keyword is explicitly preffed off
|
||||
// and the legacy "-webkit-fill-available" keyword is preffed on; in
|
||||
// that case, we serialize to the legacy webkit-prefixed alias, to
|
||||
// ensure that we can round-trip properly.
|
||||
if (!StaticPrefs::layout_css_stretch_size_keyword_enabled() &&
|
||||
StaticPrefs::layout_css_webkit_fill_available_enabled()) {
|
||||
return aValue->SetString("-webkit-fill-available");
|
||||
}
|
||||
return aValue->SetString("stretch");
|
||||
}
|
||||
case nsIFrame::ExtremumLength::FitContent:
|
||||
return aValue->SetString("fit-content");
|
||||
case nsIFrame::ExtremumLength::FitContentFunction:
|
||||
|
||||
@@ -7,6 +7,7 @@ prefs = [
|
||||
"layout.css.fit-content-function.enabled=true",
|
||||
"layout.css.scroll-driven-animations.enabled=true",
|
||||
"layout.css.stretch-size-keyword.enabled=true",
|
||||
"layout.css.webkit-fill-available.enabled=true",
|
||||
"layout.css.animation-composition.enabled=true",
|
||||
"layout.css.basic-shape-rect.enabled=true",
|
||||
"layout.css.basic-shape-shape.enabled=true",
|
||||
|
||||
@@ -6290,6 +6290,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
@@ -6736,6 +6737,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(0px)",
|
||||
@@ -6768,6 +6770,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(0px)",
|
||||
@@ -6799,6 +6802,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(-1%)",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
@@ -6829,6 +6833,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(-1%)",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
@@ -8823,6 +8828,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"3e1px",
|
||||
"3e+1px",
|
||||
"3e0px",
|
||||
@@ -10197,6 +10203,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
// valid calc() values
|
||||
"calc(-2px)",
|
||||
"calc(2px)",
|
||||
@@ -10451,6 +10458,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
@@ -10802,6 +10810,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
@@ -10949,6 +10958,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
@@ -10979,6 +10989,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
@@ -11009,6 +11020,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(-1%)",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
@@ -11040,6 +11052,7 @@ var gCSSProperties = {
|
||||
"-moz-min-content",
|
||||
"-moz-fit-content",
|
||||
"-moz-available",
|
||||
"-webkit-fill-available",
|
||||
"calc(-1%)",
|
||||
"calc(2px)",
|
||||
"calc(50%)",
|
||||
|
||||
@@ -76,13 +76,14 @@ var gSwapInitialWhenHaveFrame = {
|
||||
// For the inline axis ('width' by default): when there's a frame,
|
||||
// 'stretch' and its prefixed aliases work out to the same as 'auto',
|
||||
// given the prerequisites of only 'display: block'.
|
||||
"width": [ "-moz-available", "stretch" ],
|
||||
"width": [ "-moz-available", "-webkit-fill-available", "stretch" ],
|
||||
|
||||
// For the block axis ('height' by default): when there's a frame, these
|
||||
// keywords work out to the same as the initial value, i.e. `auto`, given
|
||||
// the prerequisites of only 'display: block'.
|
||||
"height": [ "-moz-max-content", "-moz-min-content", "-moz-fit-content",
|
||||
"-moz-available", "max-content", "min-content", "fit-content",
|
||||
"-moz-available", "-webkit-fill-available",
|
||||
"max-content", "min-content", "fit-content",
|
||||
"fit-content(100px)", "fit-content(10%)",
|
||||
"fit-content(calc(3*25px + 50%))", "stretch" ],
|
||||
};
|
||||
|
||||
@@ -139,6 +139,7 @@ static CellISizeInfo GetISizeInfo(gfxContext* aRenderingContext,
|
||||
prefCoord = minCoord;
|
||||
break;
|
||||
case StyleSize::Tag::MozAvailable:
|
||||
case StyleSize::Tag::WebkitFillAvailable:
|
||||
case StyleSize::Tag::Stretch:
|
||||
case StyleSize::Tag::FitContent:
|
||||
case StyleSize::Tag::FitContentFunction:
|
||||
|
||||
@@ -9739,6 +9739,13 @@
|
||||
mirror: always
|
||||
rust: true
|
||||
|
||||
# Is the '-webkit-fill-available' keyword enabled, as an alias for 'stretch'?
|
||||
- name: layout.css.webkit-fill-available.enabled
|
||||
type: RelaxedAtomicBool
|
||||
value: false
|
||||
mirror: always
|
||||
rust: true
|
||||
|
||||
# Is support for -webkit-line-clamp on regular blocks enabled?
|
||||
- name: layout.css.webkit-line-clamp.block.enabled
|
||||
type: bool
|
||||
|
||||
@@ -209,6 +209,7 @@ impl Size {
|
||||
Self::MaxContent |
|
||||
Self::FitContent |
|
||||
Self::MozAvailable |
|
||||
Self::WebkitFillAvailable |
|
||||
Self::Stretch |
|
||||
Self::FitContentFunction(_) => false,
|
||||
}
|
||||
|
||||
@@ -160,6 +160,8 @@ pub enum GenericSize<LengthPercent> {
|
||||
#[animation(error)]
|
||||
MozAvailable,
|
||||
#[animation(error)]
|
||||
WebkitFillAvailable,
|
||||
#[animation(error)]
|
||||
Stretch,
|
||||
#[animation(error)]
|
||||
#[css(function = "fit-content")]
|
||||
@@ -213,6 +215,8 @@ pub enum GenericMaxSize<LengthPercent> {
|
||||
#[animation(error)]
|
||||
MozAvailable,
|
||||
#[animation(error)]
|
||||
WebkitFillAvailable,
|
||||
#[animation(error)]
|
||||
Stretch,
|
||||
#[animation(error)]
|
||||
#[css(function = "fit-content")]
|
||||
|
||||
@@ -1954,6 +1954,8 @@ macro_rules! parse_size_non_length {
|
||||
#[cfg(feature = "gecko")]
|
||||
"-moz-available" => $size::MozAvailable,
|
||||
#[cfg(feature = "gecko")]
|
||||
"-webkit-fill-available" if is_webkit_fill_available_keyword_enabled() => $size::WebkitFillAvailable,
|
||||
#[cfg(feature = "gecko")]
|
||||
"stretch" if is_stretch_enabled() => $size::Stretch,
|
||||
$auto_or_none => $size::$auto_or_none_ident,
|
||||
})
|
||||
@@ -1964,6 +1966,10 @@ macro_rules! parse_size_non_length {
|
||||
}};
|
||||
}
|
||||
|
||||
#[cfg(feature = "gecko")]
|
||||
fn is_webkit_fill_available_keyword_enabled() -> bool {
|
||||
static_prefs::pref!("layout.css.webkit-fill-available.enabled")
|
||||
}
|
||||
#[cfg(feature = "gecko")]
|
||||
fn is_stretch_enabled() -> bool {
|
||||
static_prefs::pref!("layout.css.stretch-size-keyword.enabled")
|
||||
|
||||
Reference in New Issue
Block a user