diff --git a/src/css/Properties.js b/src/css/Properties.js index 0bceae8d..62376ae0 100644 --- a/src/css/Properties.js +++ b/src/css/Properties.js @@ -50,7 +50,7 @@ var Properties = { "-o-animation-name" : { multi: "none | ", comma: true }, "-o-animation-play-state" : { multi: "running | paused", comma: true }, - "appearance" : "icon | window | desktop | workspace | document | tooltip | dialog | button | push-button | hyperlink | radio-button | checkbox | menu-item | tab | menu | menubar | pull-down-menu | pop-up-menu | list-menu | radio-group | checkbox-group | outline-tree | range | field | combo-box | signature | password | normal | none | inherit", + "appearance" : "icon | window | desktop | workspace | document | tooltip | dialog | button | push-button | hyperlink | radio | radio-button | checkbox | menu-item | tab | menu | menubar | pull-down-menu | pop-up-menu | list-menu | radio-group | checkbox-group | outline-tree | range | field | combo-box | signature | password | normal | none | inherit", "azimuth" : function (expression) { var simple = " | leftwards | rightwards | inherit", direction = "left-side | far-left | left | center-left | center | center-right | right | far-right | right-side", @@ -284,6 +284,9 @@ var Properties = { "empty-cells" : "show | hide | inherit", //F + "fill" : "", + "fill-opacity" : " | inherit", + "fill-rule" : "nonzero | evenodd | inherit", "filter" : 1, "fit" : "fill | hidden | meet | slice", "fit-position" : 1, @@ -417,7 +420,7 @@ var Properties = { //O "object-fit" : "fill | contain | cover | none | scale-down", "object-position" : "", - "opacity" : " | inherit", + "opacity" : " | inherit", "order" : "", "-webkit-order" : "", "orphans" : " | inherit", @@ -485,6 +488,14 @@ var Properties = { "src" : 1, "stress" : 1, "string-set" : 1, + "stroke" : "", + "stroke-dasharray" : "none | | inherit", + "stroke-dashoffset" : " | | inherit", + "stroke-linecap" : "butt | round | square | inherit", + "stroke-linejoin" : "miter | round | bevel | inherit", + "stroke-miterlimit" : " | inherit", + "stroke-opacity" : " | inherit", + "stroke-width" : " | | inherit", "table-layout" : "auto | fixed | inherit", "tab-size" : " | ", diff --git a/src/css/ValidationTypes.js b/src/css/ValidationTypes.js index 538cd710..1d92df85 100644 --- a/src/css/ValidationTypes.js +++ b/src/css/ValidationTypes.js @@ -132,10 +132,40 @@ var ValidationTypes = { return part.type == "color" || part == "transparent" || part == "currentColor"; }, + "": function(part){ + /* ex.: + https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/local + icc-color(acmecmyk, 0.11, 0.48, 0.83, 0.00) + cielab(62.253188, 23.950124, 48.410653) + cielch(62.253188, 54.011108, 63.677091) + icc-color(FooColors, Sandy23C) + http://www.w3.org/TR/2009/WD-SVGColor12-20091001/#iccnamedcolor + ~"icc-color(" name (comma-wsp number)+ ")" + ~"icc-named-color(" name comma-wsp namedColor ")" + ~"cielab(" lightness comma-wsp a-value comma-wsp b-value ")" + ~"cielchab(" lightness comma-wsp chroma comma-wsp hue ")" + */ + return part.type == 'function' && ( + part.name == 'cielab' || + part.name == 'cielch' || + part.name == 'cielchab' || + part.name == 'icc-color' || + part.name == 'icc-named-color' + ); + }, + "": function(part){ return part.type == "number" || this[""](part); }, + "": function(part){ + return this[""](part) && part.value >= 1; + }, + + "": function(part){ + return this[""](part) && part.value >= 0 && part.value <= 1; + }, + "": function(part){ return part.type == "integer"; }, @@ -211,7 +241,7 @@ var ValidationTypes = { "": function(part){ return ValidationTypes.isLiteral(part, "nowrap | wrap | wrap-reverse"); }, - + "": function(part){ return (part.type == "function" && /^[A-Z0-9]{4}$/i.test(part)); } @@ -332,6 +362,33 @@ var ValidationTypes = { }, + "": function(expression) { + /* + none | currentColor | [] | + [ none | currentColor | [] ] | + inherit + */ + var part = expression.next(), result = false; + + if (ValidationTypes.simple[""](part)) { + result = true; + part = expression.next(); + } + if (part && ValidationTypes.simple[""](part)) { + var color = part.value; + result = true; + part = expression.next(); + if (part) { + result = (color != 'currentColor') && ValidationTypes.simple[""](part); + } + } else if (part) { + result = ValidationTypes.isLiteral(part, "none | currentColor | inherit"); + } + + return result && !expression.hasNext(); + + }, + "": function(expression) { //inset? && [ {2,4} && ? ] var result = false, @@ -386,6 +443,28 @@ var ValidationTypes = { return result; }, + "": function(expression){ + var arrayResult = true, part, partResult; + + while (expression.hasNext()) { + part = expression.next(); + partResult = + part.value >= 0 && ( + ValidationTypes.simple[""](part) || + ValidationTypes.simple[""](part) || + ValidationTypes.simple[""](part) + ); + partResult = partResult || part.value == ','; + arrayResult = arrayResult && partResult; + } + + if (!arrayResult) { + expression.previous(); + } + return arrayResult; + + }, + "": function(expression) { // http://www.w3.org/TR/2014/WD-css-flexbox-1-20140325/#flex-property // none | [ ? || ] diff --git a/tests/css/Validation.js b/tests/css/Validation.js index 53691856..9e06e185 100644 --- a/tests/css/Validation.js +++ b/tests/css/Validation.js @@ -673,6 +673,46 @@ } })); + // test + suite.add(new ValidationTestCase({ + property: "fill", + + valid: [ + "url('myGradient')", + "url('myGradient') inherit", + "url('myGradient') darkred", + "url('myGradient') darkred icc-color(myCmykDarkRed)", + "currentColor", + "darkred icc-color(myCmykDarkRed)", + "none", + "inherit" + ], + + invalid: { + "url('myGradient') icc-color(myCmykDarkRed)" : "Expected () but found 'url('myGradient') icc-color(myCmykDarkRed)'.", + "currentColor icc-color(myCmykDarkRed)" : "Expected () but found 'currentColor icc-color(myCmykDarkRed)'.", + "icc-color(myCmykDarkRed) darkred" : "Expected end of value but found 'darkred'.", + "icc-color(myCmykDarkRed)" : "Expected () but found 'icc-color(myCmykDarkRed)'.", + "icc-color(myCmykDarkRed) inherit" : "Expected end of value but found 'inherit'.", + "inherit icc-color(myCmykDarkRed)" : "Expected end of value but found 'icc-color(myCmykDarkRed)'.", + "none inherit" : "Expected end of value but found 'inherit'." + } + })); + + suite.add(new ValidationTestCase({ + property: "fill-rule", + + valid: [ + "nonzero", + "evenodd", + "inherit" + ], + + invalid: { + "foo" : "Expected (nonzero | evenodd | inherit) but found 'foo'." + } + })); + ["flex", "-ms-flex", "-webkit-flex"].forEach(function(prop_name) { suite.add(new ValidationTestCase({ property: prop_name, @@ -894,11 +934,15 @@ property: "opacity", valid: [ + "0", + "0.5", "1" ], invalid: { - "foo" : "Expected ( | inherit) but found 'foo'." + "-0.75" : "Expected ( | inherit) but found '-0.75'.", + "12" : "Expected ( | inherit) but found '12'.", + "foo" : "Expected ( | inherit) but found 'foo'." } })); @@ -924,6 +968,75 @@ } })); + suite.add(new ValidationTestCase({ + property: "stroke-dasharray", + + valid: [ + "0", + "4", + "20px", + "20px 40px 30px", + "20px, 40px, 30px", + "none", + "inherit" + ], + + invalid: { + "-20px" : "Expected (none | | inherit) but found '-20px'.", + "auto" : "Expected (none | | inherit) but found 'auto'." + } + })); + + suite.add(new ValidationTestCase({ + property: "stroke-linecap", + + valid: [ + "butt", + "round", + "square", + "inherit" + ], + + invalid: { + "auto" : "Expected (butt | round | square | inherit) but found 'auto'.", + "none" : "Expected (butt | round | square | inherit) but found 'none'." + } + })); + + suite.add(new ValidationTestCase({ + property: "stroke-linejoin", + + valid: [ + "miter", + "round", + "bevel", + "inherit" + ], + + invalid: { + "auto" : "Expected (miter | round | bevel | inherit) but found 'auto'.", + "none" : "Expected (miter | round | bevel | inherit) but found 'none'." + } + })); + + suite.add(new ValidationTestCase({ + property: "stroke-miterlimit", + + valid: [ + "1", + "1.4", + "20", + "10", + "inherit" + ], + + invalid: { + "-10" : "Expected ( | inherit) but found '-10'.", + "0.5" : "Expected ( | inherit) but found '0.5'.", + "foo" : "Expected ( | inherit) but found 'foo'." + } + })); + suite.add(new ValidationTestCase({ property: "-ms-touch-action",