Skip to content

Commit d31dc9d

Browse files
committed
Merge pull request #117 from bem/fix-comments-comparison
Fix the comparison of conditional comments
2 parents 1a2c4fe + 00453e3 commit d31dc9d

11 files changed

Lines changed: 143 additions & 17 deletions

File tree

README.md

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,10 @@ The following two code samples will be considered to be equivalent:
154154

155155
Makes **html-differ** ignore HTML comments during the comparison (default: `true`).
156156

157+
**REMARK!**<br>
158+
Does not ignore [conditional comments](http://en.wikipedia.org/wiki/Conditional_comment).
159+
160+
157161
**Example**: `true`<br>
158162
The following two code samples will be considered to be equivalent:
159163

@@ -163,10 +167,15 @@ The following two code samples will be considered to be equivalent:
163167
<html>
164168
<head lang="en">
165169
<meta charset="UTF-8">
166-
<title><!-- comments2 --></title>
170+
<!--[if IE]>
171+
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
172+
<![endif]-->
173+
<!--[if !IE]><!-->
174+
<link href="non-ie.css" rel="stylesheet">
175+
<!--<![endif]-->
167176
</head>
168177
<body>
169-
Text<!-- comments3 -->
178+
Text<!-- comments2 -->
170179
</body>
171180
</html>
172181
```
@@ -177,7 +186,12 @@ Text<!-- comments3 -->
177186
<html>
178187
<head lang="en">
179188
<meta charset="UTF-8">
180-
<title></title>
189+
<!--[if IE]>
190+
<link href="all-ie-only.css" type="text/css" rel="stylesheet"/>
191+
<![endif]-->
192+
<!--[if !IE]><!-->
193+
<link href="non-ie.css" rel="stylesheet">
194+
<!--<![endif]-->
181195
</head>
182196
<body>
183197
Text
@@ -236,7 +250,7 @@ The options will be predefined:
236250
{ name: 'ondblclick', isFunction: true }
237251
],
238252
ignoreWhitespaces: true,
239-
ignoreComments: false,
253+
ignoreComments: true,
240254
ignoreEndTags: false,
241255
ignoreDuplicateAttributes: false
242256
}

README.ru.md

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,9 @@ var HtmlDiffer = require('html-differ').HtmlDiffer,
154154

155155
**html-differ** будет игнорировать HTML-комментарии при сравнении (по умолчанию: `true`).
156156

157+
**ПРИМЕЧАНИЕ!**<br>
158+
[Условные комментарии](https://ru.wikipedia.org/wiki/Условный_комментарий) не игнорируются.
159+
157160
**Пример**: `true`<br>
158161
Следующие два HTML будут считаться эквивалентными:
159162

@@ -163,10 +166,15 @@ var HtmlDiffer = require('html-differ').HtmlDiffer,
163166
<html>
164167
<head lang="en">
165168
<meta charset="UTF-8">
166-
<title><!-- comments2 --></title>
169+
<!--[if IE]>
170+
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
171+
<![endif]-->
172+
<!--[if !IE]><!-->
173+
<link href="non-ie.css" rel="stylesheet">
174+
<!--<![endif]-->
167175
</head>
168176
<body>
169-
Text<!-- comments3 -->
177+
Text<!-- comments2 -->
170178
</body>
171179
</html>
172180
```
@@ -177,7 +185,12 @@ Text<!-- comments3 -->
177185
<html>
178186
<head lang="en">
179187
<meta charset="UTF-8">
180-
<title></title>
188+
<!--[if IE]>
189+
<link href="all-ie-only.css" type="text/css" rel="stylesheet"/>
190+
<![endif]-->
191+
<!--[if !IE]><!-->
192+
<link href="non-ie.css" rel="stylesheet">
193+
<!--<![endif]-->
181194
</head>
182195
<body>
183196
Text
@@ -236,7 +249,7 @@ var HtmlDiffer = require('html-differ').HtmlDiffer,
236249
{ name: 'ondblclick', isFunction: true }
237250
],
238251
ignoreWhitespaces: true,
239-
ignoreComments: false,
252+
ignoreComments: true,
240253
ignoreEndTags: false,
241254
ignoreDuplicateAttributes: false
242255
}

lib/utils/defaults.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,7 @@ var _ = require('lodash');
2121
'data-bem',
2222
{ name: 'onclick', isFunction: true },
2323
{ name: 'ondblclick', isFunction: true }
24-
],
25-
ignoreComments: false
24+
]
2625
};
2726
} else {
2827
console.error(options.bold.red + ' is an invalid preset name. Use ' + 'bem'.bold.green + ' instead.');

lib/utils/modify.js

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ var SimpleApiParser = require('parse5').SimpleApiParser,
1414
* @param {Boolean} [options.ignoreDuplicateAttributes=false]
1515
* returns {String}
1616
*/
17-
module.exports = function (value, options) {
17+
function modify(value, options) {
1818
var modifiedValue = '',
1919
parser;
2020

@@ -59,10 +59,16 @@ module.exports = function (value, options) {
5959
modifiedValue += serialize.text(text);
6060
},
6161
/**
62-
* @param {String} text
62+
* @param {String} comment
6363
*/
64-
comment: function (text) {
65-
!options.ignoreComments && (modifiedValue += serialize.comment(text));
64+
comment: function (comment) {
65+
var conditionalComment = utils.getConditionalComment(comment, modify, options);
66+
67+
if (conditionalComment) {
68+
modifiedValue += serialize.comment(conditionalComment);
69+
} else if (!options.ignoreComments) {
70+
modifiedValue += serialize.comment(comment);
71+
}
6672
}
6773
});
6874

@@ -77,4 +83,6 @@ module.exports = function (value, options) {
7783
parser.parse(value);
7884

7985
return modifiedValue;
80-
};
86+
}
87+
88+
module.exports = modify;

lib/utils/utils.js

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -188,12 +188,41 @@ function removeDuplicateAttributes(attrs) {
188188
return res;
189189
}
190190

191+
/**
192+
* Processes a conditional comment
193+
* @param {String} comment
194+
* @param {Function} modify
195+
* @param {Object} options
196+
* @returns {String|undefined}
197+
*/
198+
function getConditionalComment(comment, modify, options) {
199+
var START_IF = '^\\s*\\[if .*\\]>',
200+
END_IF = '<!\\[endif\\]\\s*$',
201+
matchedStartIF = comment.match(new RegExp(START_IF)),
202+
matchedEndIF = comment.match(new RegExp(END_IF));
203+
204+
if (comment.match(new RegExp(START_IF + '\\s*$')) || comment.match(new RegExp(START_IF + '<!\\s*$')) ||
205+
comment.match(new RegExp('^' + END_IF))) {
206+
return comment.trim();
207+
}
208+
209+
if (matchedStartIF && matchedEndIF) {
210+
var start = matchedStartIF[0],
211+
end = matchedEndIF[0],
212+
modified = modify(comment.substring(start.length, matchedEndIF.index), options);
213+
214+
return (start + modified + end).trim();
215+
}
216+
}
217+
191218
module.exports = {
192219
sortAttrs: sortAttrs,
193220
sortCssClasses: sortCssClasses,
194221
sortAttrsValues: sortAttrsValues,
195222

196223
removeAttrsValues: removeAttrsValues,
197224
removeWhitespaces: removeWhitespaces,
198-
removeDuplicateAttributes: removeDuplicateAttributes
225+
removeDuplicateAttributes: removeDuplicateAttributes,
226+
227+
getConditionalComment: getConditionalComment
199228
};
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<!--[if IE]><link href="all-ie-only.css" type="text/css" rel="stylesheet"/><![endif]-->
3+
<!--[if !IE]>-->
4+
<link href="non-ie.css" rel="stylesheet">
5+
<!--<![endif]-->
6+
<!--[if !IE 6]><!-->
7+
<link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
8+
<!--<![endif]-->
9+
<!-- comments1 -->
10+
<html>
11+
<!-- comments2 --><head lang="en"><!-- comments3 -->
12+
<meta charset="UTF-8">
13+
<title><!-- NOT A COMMENT --></title>
14+
</head><!-- comments4 -->
15+
<body>
16+
<!-- comments5 -->Text<!-- comments6 -->
17+
</body>
18+
</html>
19+
<!-- comments7 -->

test/diff/fixtures/first/ignore-comments.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,11 @@
11
<!DOCTYPE html>
2+
<!--[if IE]><link href="all-ie-only.css" type="text/css" rel="stylesheet"/><![endif]-->
3+
<!--[if !IE]>-->
4+
<link href="non-ie.css" rel="stylesheet">
5+
<!--<![endif]-->
6+
<!--[if !IE 6]><!-->
7+
<link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
8+
<!--<![endif]-->
29
<!-- comments1 -->
310
<html>
411
<!-- comments2 --><head lang="en"><!-- comments3 -->

test/diff/fixtures/second/bem-preset.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!DOCTYPE html><!-- comment -->
1+
<!DOCTYPE html>
22
<html>
33
<head lang="en">
44
<meta charset="UTF-8">
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<!-- [if IE]>
3+
<link type="text/css" rel="stylesheet" href="all-ie-only.css" />
4+
<![endif] -->
5+
<!-- [if !IE]> -->
6+
<link href="non-ie.css" rel="stylesheet">
7+
<!--<![endif] -->
8+
<!-- [if !IE 6]><! -->
9+
<link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
10+
<!--<![endif] -->
11+
<!-- comments1 -->
12+
<html>
13+
<!-- comments2 --><head lang="en"><!-- comments3 -->
14+
<meta charset="UTF-8">
15+
<title><!-- NOT A COMMENT --></title>
16+
</head><!-- comments4 -->
17+
<body>
18+
<!-- comments5 -->Text<!-- comments6 -->
19+
</body>
20+
</html>
21+
<!-- comments7 -->

test/diff/fixtures/second/ignore-comments.html

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,13 @@
11
<!DOCTYPE html>
2+
<!-- [if IE]>
3+
<link type="text/css" rel="stylesheet" href="all-ie-only.css" />
4+
<![endif] -->
5+
<!-- [if !IE]> -->
6+
<link href="non-ie.css" rel="stylesheet">
7+
<!--<![endif] -->
8+
<!-- [if !IE 6]><! -->
9+
<link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
10+
<!--<![endif] -->
211
<html>
312
<head lang="en">
413
<meta charset="UTF-8">

0 commit comments

Comments
 (0)