Merge pull request #222 from CSSLint/text-decoration-update

Update text-decoration (-style, -line, -color) definition

Author: XhmikosR

src/css/Properties.js

@@ -426,7 +426,10 @@ var Properties = module.exports = {
     "text-align"                    : "left | right | center | justify | match-parent | start | end",
     "text-align-last"               : 1,
     "text-anchor"                   : "start | middle | end",
-    "text-decoration"               : "<text-decoration>",
+    "text-decoration"               : "<text-decoration-line> || <text-decoration-style> || <text-decoration-color>",
+    "text-decoration-color"         : "<text-decoration-color>",
+    "text-decoration-line"          : "<text-decoration-line>",
+    "text-decoration-style"         : "<text-decoration-style>",
     "text-emphasis"                 : 1,
     "text-height"                   : 1,
     "text-indent"                   : "<length> | <percentage>",

src/css/ValidationTypes.js

@@ -433,9 +433,15 @@ copy(ValidationTypes, {
         Matcher.many([true /* length is required */],
                      Matcher.cast("<length>").braces(2, 4), "inset", "<color>"),
 
-        "<text-decoration>":
+        "<text-decoration-color>":
+           "<color>",
+
+        "<text-decoration-line>":
             "none | [ underline || overline || line-through || blink ]",
 
+        "<text-decoration-style>":
+            "solid | double | dotted | dashed | wavy",
+
         "<will-change>":
             "auto | <animateable-feature>#",
 

tests/css/Validation.js

@@ -1387,6 +1387,45 @@ var YUITest = require("yuitest"),
     suite.add(new ValidationTestCase({
         property: "text-decoration",
 
+        valid: [
+          "none",
+          "underline red",
+          "underline wavy red",
+          "wavy",
+          "wavy red",
+          "red"
+        ],
+
+        invalid: {
+            "underline underline" : "Expected end of value but found 'underline'.",
+            "underline wavy dotted": "Expected end of value but found 'dotted'.",
+            "underline wavy red purple": "Expected end of value but found 'purple'.",
+            "wavy dotted": "Expected end of value but found 'dotted'.",
+            "wavy red purple": "Expected end of value but found 'purple'.",
+            "red purple": "Expected end of value but found 'purple'.",
+            "foo" : "Expected (<text-decoration-line> || <text-decoration-style> || <text-decoration-color>) but found 'foo'."
+        }
+    }));
+
+    suite.add(new ValidationTestCase({
+        property: "text-decoration-color",
+
+        valid: [
+            "red",
+            "#f00",
+            "transparent",
+            "rgba(255, 128, 128, 0.5)"
+        ],
+
+        invalid: {
+            "foo" : "Expected (<color>) but found 'foo'.",
+            "invert" : "Expected (<color>) but found 'invert'."
+        }
+    }));
+
+    suite.add(new ValidationTestCase({
+        property: "text-decoration-line",
+
         valid: [
             "none",
             "underline",
@@ -1402,6 +1441,23 @@ var YUITest = require("yuitest"),
         }
     }));
 
+    suite.add(new ValidationTestCase({
+        property: "text-decoration-style",
+
+        valid: [
+            "solid",
+            "double",
+            "dotted",
+            "dashed",
+            "wavy"
+        ],
+
+        invalid: {
+            "solid double" : "Expected end of value but found 'double'.",
+            "foo" : "Expected (solid | double | dotted | dashed | wavy) but found 'foo'."
+        }
+    }));
+
     suite.add(new ValidationTestCase({
         property: "text-rendering",