Merge pull request #202 from jafin/fix/preserve-percent-unit-on-zero-values

Fix 0% losing its percent unit during CSS serialization

Author: FlorianRappl

src/AngleSharp.Css.Tests/Declarations/CssFlexProperty.cs

@@ -95,6 +95,36 @@ public void CssFlexShorthandGrowAndShrinkLegal()
             Assert.AreEqual("1 2", property.Value);
         }
 
+        [Test]
+        public void CssFlexShorthandWithZeroPercentBasisLegal()
+        {
+            var snippet = "flex: 1 1 0%";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("flex", property.Name);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("1 1 0%", property.Value);
+        }
+
+        [Test]
+        public void CssFlexBasisZeroPercentLegal()
+        {
+            var snippet = "flex-basis: 0%";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("flex-basis", property.Name);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("0%", property.Value);
+        }
+
+        [Test]
+        public void CssFlexBasisZeroPxSerializesWithoutUnit()
+        {
+            var snippet = "flex-basis: 0px";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("flex-basis", property.Name);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("0", property.Value);
+        }
+
         [Test]
         public void CssFlexWrapLegal()
         {

src/AngleSharp.Css.Tests/Declarations/CssObjectSizing.cs

@@ -131,7 +131,7 @@ public void CssObjectPositionLeft30Legal()
             Assert.IsTrue(property.IsAnimatable);
             Assert.IsFalse(property.IsInherited);
             Assert.IsTrue(property.HasValue);
-            Assert.AreEqual("0 30px", property.Value);
+            Assert.AreEqual("0% 30px", property.Value);
         }
     }
 }

src/AngleSharp.Css.Tests/Declarations/CssTransformProperty.cs

@@ -230,7 +230,7 @@ public void CssTransformOriginYOffsetXKeywordLegal()
             Assert.IsFalse(property.IsImportant);
             Assert.IsFalse(property.IsInherited);
             Assert.IsTrue(property.HasValue);
-            Assert.AreEqual("0 2px", property.Value);
+            Assert.AreEqual("0% 2px", property.Value);
         }
 
         [Test]
@@ -242,7 +242,7 @@ public void CssTransformOriginXKeywordYOffsetLegal()
             Assert.IsFalse(property.IsImportant);
             Assert.IsFalse(property.IsInherited);
             Assert.IsTrue(property.HasValue);
-            Assert.AreEqual("0 2px", property.Value);
+            Assert.AreEqual("0% 2px", property.Value);
         }
 
         [Test]
@@ -290,7 +290,7 @@ public void CssTransformOriginYXKeywordZLegal()
             Assert.IsFalse(property.IsImportant);
             Assert.IsFalse(property.IsInherited);
             Assert.IsTrue(property.HasValue);
-            Assert.AreEqual("0 2px 10px", property.Value);
+            Assert.AreEqual("0% 2px 10px", property.Value);
         }
 
         [Test]
@@ -302,7 +302,7 @@ public void CssTransformOriginXKeywordYZLegal()
             Assert.IsFalse(property.IsImportant);
             Assert.IsFalse(property.IsInherited);
             Assert.IsTrue(property.HasValue);
-            Assert.AreEqual("0 5px -3px", property.Value);
+            Assert.AreEqual("0% 5px -3px", property.Value);
         }
 
         [Test]

src/AngleSharp.Css/Values/Primitives/CssLengthValue.cs

@@ -107,7 +107,9 @@ public String CssText
                 }
                 else
                 {
-                    var unit = _value == 0.0 ? String.Empty : UnitString;
+                    // Per CSS spec, 0 is valid without a unit for lengths,
+                    // but 0% is a percentage (relative to context) and must keep its unit.
+                    var unit = _value == 0.0 && _unit != Unit.Percent ? String.Empty : UnitString;
                     var val = _value.CssStringify();
                     return String.Concat(val, unit);
                 }