Developer Guide
Young edited this page Oct 8, 2015
·
3 revisions
如何对xg-htmlhint进行规则扩展
git clone git://github.com/yangjiyuan/xg-htmlhint.git
http://nodejs.org/
npm install grunt-cli -g
cd xg-htmlhint && npm install
-
HTMLHint:主要对象，用于执行代码检查、管理规则等主要功能。
-
HTMLParser：用于对HTML代码片段进行解析，可以注册事件队列，包括
- start：文档开始时
- tagstart：标签开始时
- tagend：标签结束时
- cdata：内嵌js脚本或样式
- text：普通文本
- comment：注释文本
- end：文档结束时
可以添加事件触发回调，如下
parser.addListener('tagstart', function(event){ var attrs = event.attrs, col = event.col, line = event.line; // other code });每一个事件触发时，触发函数的参数都是和当前事件有关的对象，如行，列，文本，属性等。也可以去除事件，如下：
parser.removeListener('tagstart', function(event){ var attrs = event.attrs, col = event.col, line = event.line; // other code });该对象还有其他方法，如将字符串分割转化为对象的
getMapAttrs等。 -
Reporter：HTMLHint的属性之一，用于对检查之后的信息进行汇报，核心方法如下:
- reporter.error：错误信息
- reporter.warn：警告信息
- reporter.info：提示信息
报告的对象结构如下：
{ type: 'warning', // 也可以是error 或 info message: 'Doctype must be uppercase.', raw: '<!doctype html>', evidence: '<!doctype html><html></html>', line: 1, col: 1, rule: { id: 'doctype-first', description: 'Doctype must be declared first.', link: 'https://github.com/yangjiyuan/xg-htmlhint/wiki/doctype-first' } }
-
在项目根目录下的src文件夹下的rules目录下新建文件，编写规则
-
执行
HTMLHint.addRule函数，该函数接收一个对象参数，如下：{ id: 'tagname-lowercase', // 规则的唯一id description: 'All html element names must be in lowercase.', // 规则描述 /** * 初始化函数 * @param parser HTMLParser对象 * @param reporter Reporter对象 * @param options 配置的规则的值 */ init: function(parser, reporter,options){ var attrs = event.attrs, attr; for(var i=0, l=attrs.length;i<l;i++){ attr = attrs[i]; var attrName = attr.name; if(attrName !== attrName.toLowerCase()){ reporter.error('The attribute name of [ '+attrName+' ] must be in lowercase.', attr.line, attr.col, self, attr.raw); } } } }
在项目根目录下的test文件夹下的rules目录下新建文件，编写测试用例。本项目使用mocha+expect作为代码测试框架。
可以使用mocha对单独的文件进行测试：
grunt build
mocha test/rule/new-rule.js
或者使用grunt对所有测试用例进行测试
grunt test
grunt