add rule: inline-style-disabled

add rule: inline-script-disabled
htmlhint · Oct 12, 2015 · 3b39e55 · 3b39e55
1 parent 189f0fd
commit 3b39e55
Show file tree

Hide file tree

Showing 6 changed files with 142 additions and 2 deletions.
diff --git a/CHANGE.md b/CHANGE.md
@@ -1,14 +1,16 @@
 HTMLHint change log
 ====================
 
-## ver 0.9.10 (2015-10-11)
+## ver 0.9.10 (2015-10-12)
 
 add:
 
 1. attr-unsafe-chars(rule): show unsafe code in message
 2. support glob pattern for cli
 3. support format as custom: json, junit, checkstyle
 4. support plugin: `htmlhint --plugin ./plugins/`
+5. add rule: inline-style-disabled
+6. add rule: inline-script-disabled
 
 fix:
 

diff --git a/lib/htmlhint.js b/lib/htmlhint.js
diff --git a/src/rules/inline-script-disabled.js b/src/rules/inline-script-disabled.js
@@ -0,0 +1,31 @@
+/**
+ * Copyright (c) 2015, Yanis Wang <yanis.wang@gmail.com>
+ * MIT Licensed
+ */
+HTMLHint.addRule({
+    id: 'inline-script-disabled',
+    description: 'Inline script cannot be use.',
+    init: function(parser, reporter){
+        var self = this;
+        parser.addListener('tagstart', function(event){
+            var attrs = event.attrs;
+            var attr;
+            var col = event.col + event.tagName.length + 1;
+            var attrName;
+            var reEvent = /^on(unload|message|submit|select|scroll|resize|mouseover|mouseout|mousemove|mouseleave|mouseenter|mousedown|load|keyup|keypress|keydown|focus|dblclick|click|change|blur|error)$/i;
+
+            for(var i=0, l=attrs.length;i<l;i++){
+                attr = attrs[i];
+                attrName = attr.name.toLowerCase();
+                if(reEvent.test(attrName) === true){
+                    reporter.warn('Inline script [ '+attr.raw+' ] cannot be use.', event.line, col + attr.index, self, attr.raw);
+                }
+                else if(attrName === 'src' || attrName === 'href'){
+                    if(/^\s*javascript:/i.test(attr.value)){
+                        reporter.warn('Inline script [ '+attr.raw+' ] cannot be use.', event.line, col + attr.index, self, attr.raw);
+                    }
+                }
+            }
+        });
+    }
+});
diff --git a/src/rules/inline-style-disabled.js b/src/rules/inline-style-disabled.js
@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) 2015, Yanis Wang <yanis.wang@gmail.com>
+ * MIT Licensed
+ */
+HTMLHint.addRule({
+    id: 'inline-style-disabled',
+    description: 'Inline style cannot be use.',
+    init: function(parser, reporter){
+        var self = this;
+        parser.addListener('tagstart', function(event){
+            var attrs = event.attrs;
+            var attr;
+            var col = event.col + event.tagName.length + 1;
+            for(var i=0, l=attrs.length;i<l;i++){
+                attr = attrs[i];
+                if(attr.name.toLowerCase() === 'style'){
+                    reporter.warn('Inline style [ '+attr.raw+' ] cannot be use.', event.line, col + attr.index, self, attr.raw);
+                }
+            }
+        });
+    }
+});
diff --git a/test/rules/inline-script-disabled.spec.js b/test/rules/inline-script-disabled.spec.js
@@ -0,0 +1,54 @@
+/**
+ * Copyright (c) 2015, Yanis Wang <yanis.wang@gmail.com>
+ * MIT Licensed
+ */
+
+var expect  = require("expect.js");
+
+var HTMLHint  = require("../../index").HTMLHint;
+
+var ruldId = 'inline-script-disabled',
+    ruleOptions = {};
+
+ruleOptions[ruldId] = true;
+
+describe('Rules: '+ruldId, function(){
+
+    it('Inline on event should result in an error', function(){
+        var code = '<body><img src="test.gif" onclick="alert(1);"><img src="test.gif" onMouseDown="alert(1);"></body>';
+        var messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(2);
+        expect(messages[0].rule.id).to.be(ruldId);
+        expect(messages[0].line).to.be(1);
+        expect(messages[0].col).to.be(26);
+        expect(messages[0].type).to.be('warning');
+        expect(messages[1].col).to.be(66);
+    });
+
+    it('onttt should not result in an error', function(){
+        var code = '<body><img src="test.gif" onttt="alert(1);"></body>';
+        var messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(0);
+    });
+
+    it('Javascript protocol [ javascript: ] should result in an error', function(){
+        var code = '<body><img src="javascript:alert(1)"><img src=" JAVASCRIPT:alert(1)"></body>';
+        var messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(2);
+        expect(messages[0].rule.id).to.be(ruldId);
+        expect(messages[0].line).to.be(1);
+        expect(messages[0].col).to.be(11);
+        expect(messages[0].type).to.be('warning');
+        expect(messages[1].col).to.be(42);
+
+        code = '<body><a href="javascript:alert(1)">test1</a><a href=" JAVASCRIPT:alert(2)">test2</a></body>';
+        messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(2);
+        expect(messages[0].rule.id).to.be(ruldId);
+        expect(messages[0].line).to.be(1);
+        expect(messages[0].col).to.be(9);
+        expect(messages[0].type).to.be('warning');
+        expect(messages[1].col).to.be(48);
+    });
+
+});
diff --git a/test/rules/inline-style-disabled.spec.js b/test/rules/inline-style-disabled.spec.js
@@ -0,0 +1,31 @@
+/**
+ * Copyright (c) 2015, Yanis Wang <yanis.wang@gmail.com>
+ * MIT Licensed
+ */
+
+var expect  = require("expect.js");
+
+var HTMLHint  = require("../../index").HTMLHint;
+
+var ruldId = 'inline-style-disabled',
+    ruleOptions = {};
+
+ruleOptions[ruldId] = true;
+
+describe('Rules: '+ruldId, function(){
+
+    it('Inline style should result in an error', function(){
+        var code = '<body><div style="color:red;"></div></body>';
+        var messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(1);
+        expect(messages[0].rule.id).to.be(ruldId);
+        expect(messages[0].line).to.be(1);
+        expect(messages[0].col).to.be(11);
+        expect(messages[0].type).to.be('warning');
+
+        code = '<body><div STYLE="color:red;"></div></body>';
+        messages = HTMLHint.verify(code, ruleOptions);
+        expect(messages.length).to.be(1);
+    });
+
+});