Auto merge of #16443 - Wafflespeanut:grid-2, r=canaltinova

Add parsing/serialization for grid-{row,column} and grid-area

With this, almost all the grid properties will have been covered in Stylo. I now realize that we have only two more shorthands left to go - `grid` and `grid-template` (both require #16067)

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/16443)
<!-- Reviewable:end -->

components/style/properties/shorthand/position.mako.rs

@@ -138,6 +138,109 @@
 
 </%helpers:shorthand>
 
+% for kind in ["row", "column"]:
+<%helpers:shorthand name="grid-${kind}" sub_properties="grid-${kind}-start grid-${kind}-end"
+                    spec="https://drafts.csswg.org/css-grid/#propdef-grid-${kind}"
+                    products="gecko">
+    use values::specified::GridLine;
+    use parser::Parse;
+
+    // NOTE: Since both the shorthands have the same code, we should (re-)use code from one to implement
+    // the other. This might not be a big deal for now, but we should consider looking into this in the future
+    // to limit the amount of code generated.
+    pub fn parse_value(context: &ParserContext, input: &mut Parser) -> Result<Longhands, ()> {
+        let start = input.try(|i| GridLine::parse(context, i))?;
+        let end = if input.try(|i| i.expect_delim('/')).is_ok() {
+            GridLine::parse(context, input)?
+        } else {
+            let mut line = GridLine::default();
+            if start.integer.is_none() && !start.is_span {
+                line.ident = start.ident.clone();       // ident from start value should be taken
+            }
+
+            line
+        };
+
+        Ok(Longhands {
+            grid_${kind}_start: start,
+            grid_${kind}_end: end,
+        })
+    }
+
+    impl<'a> ToCss for LonghandsToSerialize<'a> {
+        fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
+            self.grid_${kind}_start.to_css(dest)?;
+            dest.write_str(" / ")?;
+            self.grid_${kind}_end.to_css(dest)
+        }
+    }
+</%helpers:shorthand>
+% endfor
+
+<%helpers:shorthand name="grid-area"
+                    sub_properties="grid-row-start grid-row-end grid-column-start grid-column-end"
+                    spec="https://drafts.csswg.org/css-grid/#propdef-grid-area"
+                    products="gecko">
+    use values::specified::GridLine;
+    use parser::Parse;
+
+    // The code is the same as `grid-{row,column}` except that this can have four values at most.
+    pub fn parse_value(context: &ParserContext, input: &mut Parser) -> Result<Longhands, ()> {
+        fn line_with_ident_from(other: &GridLine) -> GridLine {
+            let mut this = GridLine::default();
+            if other.integer.is_none() && !other.is_span {
+                this.ident = other.ident.clone();
+            }
+
+            this
+        }
+
+        let row_start = input.try(|i| GridLine::parse(context, i))?;
+        let (column_start, row_end, column_end) = if input.try(|i| i.expect_delim('/')).is_ok() {
+            let column_start = GridLine::parse(context, input)?;
+            let (row_end, column_end) = if input.try(|i| i.expect_delim('/')).is_ok() {
+                let row_end = GridLine::parse(context, input)?;
+                let column_end = if input.try(|i| i.expect_delim('/')).is_ok() {
+                    GridLine::parse(context, input)?
+                } else {        // grid-column-end has not been given
+                    line_with_ident_from(&column_start)
+                };
+
+                (row_end, column_end)
+            } else {        // grid-row-start and grid-column-start has been given
+                let row_end = line_with_ident_from(&row_start);
+                let column_end = line_with_ident_from(&column_start);
+                (row_end, column_end)
+            };
+
+            (column_start, row_end, column_end)
+        } else {        // only grid-row-start is given
+            let line = line_with_ident_from(&row_start);
+            (line.clone(), line.clone(), line)
+        };
+
+        Ok(Longhands {
+            grid_row_start: row_start,
+            grid_row_end: row_end,
+            grid_column_start: column_start,
+            grid_column_end: column_end,
+        })
+    }
+
+    impl<'a> ToCss for LonghandsToSerialize<'a> {
+        fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
+            self.grid_row_start.to_css(dest)?;
+            let values = [&self.grid_column_start, &self.grid_row_end, &self.grid_column_end];
+            for value in &values {
+                dest.write_str(" / ")?;
+                value.to_css(dest)?;
+            }
+
+            Ok(())
+        }
+    }
+</%helpers:shorthand>
+
 <%helpers:shorthand name="place-content" sub_properties="align-content justify-content"
                     spec="https://drafts.csswg.org/css-align/#propdef-place-content"
                     products="gecko" disable_when_testing="True">