Bug 1598234 - [css-grid][cssom] Make 'grid-area'/'grid-column'/'grid-row' shorthands serialize to shortest possible form. r=emilio

Differential Revision: https://phabricator.services.mozilla.com/D54386

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Mats Palmgren 2019-11-23 21:24:33 +00:00
Родитель f96607afa0
Коммит 6bb620e019
3 изменённых файлов: 92 добавлений и 22 удалений

Просмотреть файл

@ -181,8 +181,18 @@
}
impl<'a> ToCss for LonghandsToSerialize<'a> {
// Return the shortest possible serialization of the `grid-${kind}-[start/end]` values.
// This function exploits the opportunities to omit the end value per this spec text:
//
// https://drafts.csswg.org/css-grid/#propdef-grid-column
// "When the second value is omitted, if the first value is a <custom-ident>,
// the grid-row-end/grid-column-end longhand is also set to that <custom-ident>;
// otherwise, it is set to auto."
fn to_css<W>(&self, dest: &mut CssWriter<W>) -> fmt::Result where W: fmt::Write {
self.grid_${kind}_start.to_css(dest)?;
if self.grid_${kind}_start.can_omit(self.grid_${kind}_end) {
return Ok(()); // the end value is redundant
}
dest.write_str(" / ")?;
self.grid_${kind}_end.to_css(dest)
}
@ -247,14 +257,39 @@
}
impl<'a> ToCss for LonghandsToSerialize<'a> {
// Return the shortest possible serialization of the `grid-[column/row]-[start/end]` values.
// This function exploits the opportunities to omit trailing values per this spec text:
//
// https://drafts.csswg.org/css-grid/#propdef-grid-area
// "If four <grid-line> values are specified, grid-row-start is set to the first value,
// grid-column-start is set to the second value, grid-row-end is set to the third value,
// and grid-column-end is set to the fourth value.
//
// When grid-column-end is omitted, if grid-column-start is a <custom-ident>,
// grid-column-end is set to that <custom-ident>; otherwise, it is set to auto.
//
// When grid-row-end is omitted, if grid-row-start is a <custom-ident>, grid-row-end is
// set to that <custom-ident>; otherwise, it is set to auto.
//
// When grid-column-start is omitted, if grid-row-start is a <custom-ident>, all four
// longhands are set to that value. Otherwise, it is set to auto."
fn to_css<W>(&self, dest: &mut CssWriter<W>) -> fmt::Result where W: fmt::Write {
self.grid_row_start.to_css(dest)?;
let mut trailing_values = 3;
if self.grid_column_start.can_omit(self.grid_column_end) {
trailing_values -= 1;
if self.grid_row_start.can_omit(self.grid_row_end) {
trailing_values -= 1;
if self.grid_row_start.can_omit(self.grid_column_start) {
trailing_values -= 1;
}
}
}
let values = [&self.grid_column_start, &self.grid_row_end, &self.grid_column_end];
for value in &values {
for value in values.iter().take(trailing_values) {
dest.write_str(" / ")?;
value.to_css(dest)?;
}
Ok(())
}
}

Просмотреть файл

@ -58,7 +58,7 @@ pub use self::GenericGridLine as GridLine;
impl<Integer> GridLine<Integer>
where
Integer: Zero,
Integer: PartialEq + Zero,
{
/// The `auto` value.
pub fn auto() -> Self {
@ -73,11 +73,27 @@ where
pub fn is_auto(&self) -> bool {
self.ident == atom!("") && self.line_num.is_zero() && !self.is_span
}
/// Check whether this `<grid-line>` represents a `<custom-ident>` value.
pub fn is_ident_only(&self) -> bool {
self.ident != atom!("") && self.line_num.is_zero() && !self.is_span
}
/// Check if `self` makes `other` omittable according to the rules at:
/// https://drafts.csswg.org/css-grid/#propdef-grid-column
/// https://drafts.csswg.org/css-grid/#propdef-grid-area
pub fn can_omit(&self, other: &Self) -> bool {
if self.is_ident_only() {
self == other
} else {
other.is_auto()
}
}
}
impl<Integer> ToCss for GridLine<Integer>
where
Integer: ToCss + Zero,
Integer: ToCss + PartialEq + Zero,
{
fn to_css<W>(&self, dest: &mut CssWriter<W>) -> fmt::Result
where

Просмотреть файл

@ -13,26 +13,32 @@
<body>
<script>
// auto
test_valid_value("grid-area", "auto", "auto / auto / auto / auto");
test_valid_value("grid-area", "AuTo", "auto / auto / auto / auto");
test_valid_value("grid-row", "auto", "auto / auto");
test_valid_value("grid-area", "auto");
test_valid_value("grid-area", "auto / auto", "auto");
test_valid_value("grid-area", "auto / auto / auto", "auto");
test_valid_value("grid-area", "auto / auto / auto / auto", "auto");
test_valid_value("grid-area", "AuTo", "auto");
test_valid_value("grid-row", "auto");
test_valid_value("grid-row", "auto/auto", "auto");
test_valid_value("grid-column-end", "AuTo", "auto");
// <custom-ident>
test_valid_value("grid-area", "--a", "--a / --a / --a / --a");
test_valid_value("grid-row", "-zπ", "-zπ / -zπ");
test_valid_value("grid-area", "--a");
test_valid_value("grid-row", "-zπ");
test_valid_value("grid-row", "-zπ/-zπ", "-zπ");
test_valid_value("grid-row", "i / i", "i");
test_valid_value("grid-row-start", "AZ");
test_valid_value("grid-column-start", "-_π");
test_valid_value("grid-row-end", "_9");
// <integer> && <custom-ident>?
test_valid_value("grid-area", "1", "1 / auto / auto / auto");
test_valid_value("grid-area", "+90 -a-", "90 -a- / auto / auto / auto");
test_valid_value("grid-row", "az 2", "2 az / auto");
test_valid_value("grid-column", "9", "9 / auto");
test_valid_value("grid-column", "-19 zA", "-19 zA / auto");
test_valid_value("grid-column", "-A0 33", "33 -A0 / auto");
test_valid_value("grid-area", "1");
test_valid_value("grid-area", "+90 -a-", "90 -a-");
test_valid_value("grid-row", "az 2", "2 az");
test_valid_value("grid-column", "9");
test_valid_value("grid-column", "-19 zA");
test_valid_value("grid-column", "-A0 33", "33 -A0");
test_valid_value("grid-row-start", "-19");
test_valid_value("grid-row-start", "9 -Z_");
test_valid_value("grid-column-start", "+90", "90");
@ -41,20 +47,33 @@ test_valid_value("grid-row-end", "1 -πA");
test_valid_value("grid-column-end", "π_ +5", "5 π_");
// span && [ <integer> || <custom-ident> ]
test_valid_value("grid-area", "span 2 i", "span 2 i / auto / auto / auto");
test_valid_value("grid-area", "i 2 SpAn", "span 2 i / auto / auto / auto");
test_valid_value("grid-row", "span 2", "span 2 / auto");
test_valid_value("grid-column", "i SpAn", "span i / auto");
test_valid_value("grid-row-start", "span i", "span i");
test_valid_value("grid-area", "span 2 i");
test_valid_value("grid-area", "i 2 SpAn", "span 2 i");
test_valid_value("grid-row", "span 2");
test_valid_value("grid-column", "i SpAn", "span i");
test_valid_value("grid-row-start", "span i");
test_valid_value("grid-column-start", "SpAn i 2", "span 2 i");
test_valid_value("grid-row-end", "2 i span", "span 2 i");
test_valid_value("grid-column-end", "2 SpAn", "span 2");
// <grid-line> [ / <grid-line> ]{0,3}
test_valid_value("grid-area", "auto / i", "auto / i / auto / i");
test_valid_value("grid-area", "auto / i / 2 j", "auto / i / 2 j / i");
test_valid_value("grid-area", "auto / i");
test_valid_value("grid-area", "auto / i / auto / i", "auto / i");
test_valid_value("grid-area", "auto / i / auto / 2 i");
test_valid_value("grid-area", "1 / i / auto / i", "1 / i");
test_valid_value("grid-area", "1 / auto / auto / auto", "1");
test_valid_value("grid-area", "1 / auto / i / auto", "1 / auto / i");
test_valid_value("grid-area", "1 / j / i / k");
test_valid_value("grid-area", "1 / auto / 2 / auto", "1 / auto / 2");
test_valid_value("grid-area", "1 / i / 2 / auto");
test_valid_value("grid-area", "i / i / auto / auto");
test_valid_value("grid-area", "i / auto / i / auto", "i / auto");
test_valid_value("grid-area", "auto / i / 2 j");
test_valid_value("grid-area", "auto / i / 2 j / span 3 k");
test_valid_value("grid-row", "auto / i");
test_valid_value("grid-row", "i / auto");
test_valid_value("grid-row", "2 i / auto", "2 i");
test_valid_value("grid-row", "1 / auto", "1");
test_valid_value("grid-column", "2 j / span 3 k");