Skip to content

Commit e14628b

Browse files
committed
Fixes to compatible vendor prefixes rule (fixes #285 and fixes #286)
1 parent 176433a commit e14628b

File tree

3 files changed

+48
-25
lines changed

3 files changed

+48
-25
lines changed

lib/parserlib.js

+16-8
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2121
THE SOFTWARE.
2222
2323
*/
24-
/* Version v0.1.8, Build time: 23-July-2012 09:55:09 */
24+
/* Version v0.1.9, Build time: 23-July-2012 10:52:31 */
2525
var parserlib = {};
2626
(function(){
2727

@@ -931,7 +931,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
931931
THE SOFTWARE.
932932
933933
*/
934-
/* Version v0.1.8, Build time: 23-July-2012 09:55:09 */
934+
/* Version v0.1.9, Build time: 23-July-2012 10:52:31 */
935935
(function(){
936936
var EventTarget = parserlib.util.EventTarget,
937937
TokenStreamBase = parserlib.util.TokenStreamBase,
@@ -2999,9 +2999,15 @@ Parser.prototype = function(){
29992999
var tokenStream = this._tokenStream,
30003000
token,
30013001
tt,
3002-
name;
3002+
name,
3003+
prefix = "";
30033004

30043005
tokenStream.mustMatch(Tokens.KEYFRAMES_SYM);
3006+
token = tokenStream.token();
3007+
if (/^@\-([^\-]+)\-/.test(token.value)) {
3008+
prefix = RegExp.$1;
3009+
}
3010+
30053011
this._readWhitespace();
30063012
name = this._keyframe_name();
30073013

@@ -3011,8 +3017,9 @@ Parser.prototype = function(){
30113017
this.fire({
30123018
type: "startkeyframes",
30133019
name: name,
3014-
line: name.line,
3015-
col: name.col
3020+
prefix: prefix,
3021+
line: token.startLine,
3022+
col: token.startCol
30163023
});
30173024

30183025
this._readWhitespace();
@@ -3028,8 +3035,9 @@ Parser.prototype = function(){
30283035
this.fire({
30293036
type: "endkeyframes",
30303037
name: name,
3031-
line: name.line,
3032-
col: name.col
3038+
prefix: prefix,
3039+
line: token.startLine,
3040+
col: token.startCol
30333041
});
30343042

30353043
this._readWhitespace();
@@ -5556,7 +5564,7 @@ var Tokens = [
55565564
//{ name: "ATKEYWORD"},
55575565

55585566
//CSS3 animations
5559-
{ name: "KEYFRAMES_SYM", text: [ "@keyframes", "@-webkit-keyframes", "@-moz-keyframes", "@-ms-keyframes" ] },
5567+
{ name: "KEYFRAMES_SYM", text: [ "@keyframes", "@-webkit-keyframes", "@-moz-keyframes", "@-o-keyframes" ] },
55605568

55615569
//important symbol
55625570
{ name: "IMPORTANT_SYM"},

src/rules/compatible-vendor-prefixes.js

+21-6
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ CSSLint.addRule({
2121
prefixed,
2222
i,
2323
len,
24+
inKeyFrame = false,
2425
arrayPush = Array.prototype.push,
2526
applyTo = [];
2627

@@ -74,11 +75,11 @@ CSSLint.addRule({
7475
"text-size-adjust" : "webkit ms",
7576
"transform" : "webkit moz ms o",
7677
"transform-origin" : "webkit moz ms o",
77-
"transition" : "webkit moz o ms",
78-
"transition-delay" : "webkit moz o ms",
79-
"transition-duration" : "webkit moz o ms",
80-
"transition-property" : "webkit moz o ms",
81-
"transition-timing-function" : "webkit moz o ms",
78+
"transition" : "webkit moz o",
79+
"transition-delay" : "webkit moz o",
80+
"transition-duration" : "webkit moz o",
81+
"transition-property" : "webkit moz o",
82+
"transition-timing-function" : "webkit moz o",
8283
"user-modify" : "webkit moz",
8384
"user-select" : "webkit moz ms",
8485
"word-break" : "epub ms",
@@ -97,14 +98,28 @@ CSSLint.addRule({
9798
arrayPush.apply(applyTo, variations);
9899
}
99100
}
101+
100102
parser.addListener("startrule", function () {
101103
properties = [];
102104
});
103105

106+
parser.addListener("startkeyframes", function (event) {
107+
inKeyFrame = event.prefix || true;
108+
});
109+
110+
parser.addListener("endkeyframes", function (event) {
111+
inKeyFrame = false;
112+
});
113+
104114
parser.addListener("property", function (event) {
105115
var name = event.property;
106116
if (CSSLint.Util.indexOf(applyTo, name.text) > -1) {
107-
properties.push(name);
117+
118+
// e.g., -moz-transform is okay to be alone in @-moz-keyframes
119+
if (!inKeyFrame || typeof inKeyFrame != "string" ||
120+
name.text.indexOf("-" + inKeyFrame + "-") !== 0) {
121+
properties.push(name);
122+
}
108123
}
109124
});
110125

tests/rules/compatible-vendor-prefixes.js

+11-11
Original file line numberDiff line numberDiff line change
@@ -16,21 +16,16 @@
1616
Assert.areEqual(1, result.messages[0].line);
1717
},
1818

19-
"Using -webkit-transition and -moz-transition should warn to also include -o-transition and -ms-transition.": function(){
19+
"Using -webkit-transition and -moz-transition should warn to also include -o-transition.": function() {
2020
var result = CSSLint.verify("h1 { -webkit-transition: height 20px 1s; -moz-transition: height 20px 1s; }", { "compatible-vendor-prefixes": 1 });
21-
Assert.areEqual(2, result.messages.length);
21+
Assert.areEqual(1, result.messages.length);
2222
Assert.areEqual("warning", result.messages[0].type);
2323
Assert.areEqual("The property -o-transition is compatible with -webkit-transition and -moz-transition and should be included as well.", result.messages[0].message);
2424
Assert.areEqual(6, result.messages[0].col);
25-
Assert.areEqual(1, result.messages[0].line);
26-
Assert.areEqual("warning", result.messages[1].type);
27-
Assert.areEqual("The property -ms-transition is compatible with -webkit-transition and -moz-transition and should be included as well.", result.messages[1].message);
28-
Assert.areEqual(6, result.messages[1].col);
29-
Assert.areEqual(1, result.messages[1].line);
30-
25+
Assert.areEqual(1, result.messages[0].line);
3126
},
3227

33-
"Using -webkit-transform should warn to also include -moz-transform, -ms-transform, and -o-transform.": function(){
28+
"Using -webkit-transform should warn to also include -moz-transform, -ms-transform, and -o-transform.": function() {
3429
var result = CSSLint.verify("div.box { -webkit-transform: translate(50px, 100px); }", { "compatible-vendor-prefixes": 3 });
3530
Assert.areEqual(3, result.messages.length);
3631
Assert.areEqual("warning", result.messages[0].type);
@@ -41,13 +36,18 @@
4136
Assert.areEqual("The property -o-transform is compatible with -webkit-transform and should be included as well.", result.messages[2].message);
4237
},
4338

39+
"Using -webkit-transform inside of an @-webkit- block shouldn't cause a warning": function(){
40+
var result = CSSLint.verify("@-webkit-keyframes spin {0%{ -webkit-transform: rotateX(-10deg) rotateY(0deg); } 100%{ -webkit-transform: rotateX(-10deg) rotateY(-360deg); } }", { "compatible-vendor-prefixes": 1 });
41+
Assert.areEqual(0, result.messages.length);
42+
},
43+
4444
"Using all compatible vendor prefixes for animation should be allowed with no warnings.": function(){
45-
var result = CSSLint.verify(".next:focus { -moz-animation: 'diagonal-slide' 5s 10; -webkit-animation: 'diagonal-slide' 5s 10; -ms-animation: 'diagonal-slide' 5s 10; }", { "compatible-vendor-prefixes": 0 });
45+
var result = CSSLint.verify(".next:focus { -moz-animation: 'diagonal-slide' 5s 10; -webkit-animation: 'diagonal-slide' 5s 10; -ms-animation: 'diagonal-slide' 5s 10; }", { "compatible-vendor-prefixes": 1 });
4646
Assert.areEqual(0, result.messages.length);
4747
},
4848

4949
"Using box-shadow with no vendor prefixes should be allowed with no warnings.": function(){
50-
var result = CSSLint.verify("h1 { box-shadow: 5px 5px 5px #ccc; }", { "compatible-vendor-prefixes": 0 });
50+
var result = CSSLint.verify("h1 { box-shadow: 5px 5px 5px #ccc; }", { "compatible-vendor-prefixes": 1 });
5151
Assert.areEqual(0, result.messages.length);
5252
}
5353

0 commit comments

Comments
 (0)