Make sure box model rule doesn't warn when width or height are set to auto, etc. (fixes #287)

Author: nzakas

src/rules/box-model.js

@@ -37,13 +37,13 @@ CSSLint.addRule({
         }
 
         function endRule(){
-            var prop;
+            var prop, value;
             if (properties.height){
                 for (prop in heightProperties){
                     if (heightProperties.hasOwnProperty(prop) && properties[prop]){
-                    
+                        value = properties[prop].value;
                         //special case for padding
-                        if (!(prop == "padding" && properties[prop].value.parts.length === 2 && properties[prop].value.parts[0].value === 0)){
+                        if (!(prop == "padding" && value.parts.length === 2 && value.parts[0].value === 0)){
                             reporter.report("Using height with " + prop + " can sometimes make elements larger than you expect.", properties[prop].line, properties[prop].col, rule);
                         }
                     }
@@ -53,8 +53,9 @@ CSSLint.addRule({
             if (properties.width){
                 for (prop in widthProperties){
                     if (widthProperties.hasOwnProperty(prop) && properties[prop]){
-
-                        if (!(prop == "padding" && properties[prop].value.parts.length === 2 && properties[prop].value.parts[1].value === 0)){
+                        value = properties[prop].value;
+                        
+                        if (!(prop == "padding" && value.parts.length === 2 && value.parts[1].value === 0)){
                             reporter.report("Using width with " + prop + " can sometimes make elements larger than you expect.", properties[prop].line, properties[prop].col, rule);
                         }
                     }
@@ -76,7 +77,7 @@ CSSLint.addRule({
                     properties[name] = { line: event.property.line, col: event.property.col, value: event.value };
                 }
             } else {
-                if (name == "width" || name == "height"){
+                if (/^(width|height)/i.test(name) && /^(length|percentage)/.test(event.value.parts[0].type)){
                     properties[name] = 1;
                 }
             }

tests/rules/box-model.js

@@ -18,7 +18,22 @@
             var result = CSSLint.verify(".foo { width: 100px; padding: 0; }", { "box-model": 1 });
             Assert.areEqual(0, result.messages.length);
         },
+        
+       "Using width:auto with padding should not result in a warning": function(){
+            var result = CSSLint.verify(".foo { width: auto; padding: 10px; }", { "box-model": 1 });
+            Assert.areEqual(0, result.messages.length);
+        },
 
+       "Using width:available with padding should not result in a warning": function(){
+            var result = CSSLint.verify(".foo { width: available; padding: 10px; }", { "box-model": 1 });
+            Assert.areEqual(0, result.messages.length);
+        },
+
+       "Using height:auto with padding should not result in a warning": function(){
+            var result = CSSLint.verify(".foo { height: auto; padding: 10px; }", { "box-model": 1 });
+            Assert.areEqual(0, result.messages.length);
+        },
+        
         "Using width and padding-left should result in a warning": function(){
             var result = CSSLint.verify(".foo { width: 100px; padding-left: 10px; }", { "box-model": 1 });
             Assert.areEqual(1, result.messages.length);