Auto merge of #16352 - pyfisch:issue12655, r=Wafflespeanut

Correct serialization for border-radius property.

<!-- Please describe your changes on the following line: -->
I don't think there is a way to avoid the clones, or is there one?

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [X] These changes fix #12655 (github issue number if applicable).

<!-- Either: -->
- [X] These changes do not require tests because just a function is called.

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- 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/16352)
<!-- Reviewable:end -->

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

@@ -182,7 +182,7 @@ pub fn parse_border(context: &ParserContext, input: &mut Parser)
     'border-%s-radius' % (corner)
      for corner in ['top-left', 'top-right', 'bottom-right', 'bottom-left']
 )}" extra_prefixes="webkit" spec="https://drafts.csswg.org/css-backgrounds/#border-radius">
-    use values::specified::basic_shape::BorderRadius;
+    use values::specified::basic_shape::{BorderRadius, serialize_radius_values};
     use parser::Parse;
 
     pub fn parse_value(context: &ParserContext, input: &mut Parser) -> Result<Longhands, ()> {
@@ -195,21 +195,13 @@ pub fn parse_border(context: &ParserContext, input: &mut Parser)
         })
     }
 
-    // TODO: I do not understand how border radius works with respect to the slashes /,
-    // so putting a default generic impl for now
-    // https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius
     impl<'a> ToCss for LonghandsToSerialize<'a>  {
         fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
-            try!(self.border_top_left_radius.to_css(dest));
+            serialize_radius_values(dest,
-            try!(write!(dest, " "));
+                                    &self.border_top_left_radius.0,
-
+                                    &self.border_top_right_radius.0,
-            try!(self.border_top_right_radius.to_css(dest));
+                                    &self.border_bottom_right_radius.0,
-            try!(write!(dest, " "));
+                                    &self.border_bottom_left_radius.0)
-
-            try!(self.border_bottom_right_radius.to_css(dest));
-            try!(write!(dest, " "));
-
-            self.border_bottom_left_radius.to_css(dest)
         }
     }
 </%helpers:shorthand>

tests/unit/style/properties/serialization.rs

@@ -368,6 +368,29 @@ mod shorthand_serialization {
             let serialization = shorthand_properties_to_string(properties);
             assert_eq!(serialization, "border-style: solid dotted;");
         }
+
+        use style::values::specified::BorderRadiusSize;
+        use style::values::specified::length::Percentage;
+
+        #[test]
+        fn border_radius_should_serialize_correctly() {
+            let mut properties = Vec::new();
+            properties.push(PropertyDeclaration::BorderTopLeftRadius(Box::new(BorderRadiusSize::new(
+                Percentage(0.01).into(), Percentage(0.05).into()
+            ))));
+            properties.push(PropertyDeclaration::BorderTopRightRadius(Box::new(BorderRadiusSize::new(
+                Percentage(0.02).into(), Percentage(0.06).into()
+            ))));
+            properties.push(PropertyDeclaration::BorderBottomRightRadius(Box::new(BorderRadiusSize::new(
+                Percentage(0.03).into(), Percentage(0.07).into()
+            ))));
+            properties.push(PropertyDeclaration::BorderBottomLeftRadius(Box::new(BorderRadiusSize::new(
+                Percentage(0.04).into(), Percentage(0.08).into()
+            ))));
+
+            let serialization = shorthand_properties_to_string(properties);
+            assert_eq!(serialization, "border-radius: 1% 2% 3% 4% / 5% 6% 7% 8%;");
+        }
     }