Skip to content

Commit

Permalink
fix(html): preserve incomplete ie conditional comment (#5429)
Browse files Browse the repository at this point in the history
  • Loading branch information
ikatyang committed Nov 10, 2018
1 parent 8b1260a commit 182a92e
Show file tree
Hide file tree
Showing 4 changed files with 116 additions and 6 deletions.
25 changes: 19 additions & 6 deletions src/language-html/parser-html.js
Expand Up @@ -256,19 +256,32 @@ function parseIeConditionalComment(node, parseHtml) {
const [, openingTagSuffix, condition, data] = match;
const offset = "<!--".length + openingTagSuffix.length;
const contentStartSpan = node.sourceSpan.start.moveBy(offset);
const contentEndSpan = contentStartSpan.moveBy(data.length);
const ParseSourceSpan = node.sourceSpan.constructor;
return Object.assign(parseHtml(data, contentStartSpan), {
const [complete, children] = (() => {
try {
return [true, parseHtml(data, contentStartSpan).children];
} catch (e) {
const text = {
type: "text",
value: data,
sourceSpan: new ParseSourceSpan(contentStartSpan, contentEndSpan)
};
return [false, [text]];
}
})();
return {
type: "ieConditionalComment",
complete,
children,
condition: condition.trim().replace(/\s+/g, " "),
sourceSpan: node.sourceSpan,
startSourceSpan: new ParseSourceSpan(
node.sourceSpan.start,
contentStartSpan
),
endSourceSpan: new ParseSourceSpan(
contentStartSpan.moveBy(data.length),
node.sourceSpan.end
)
});
endSourceSpan: new ParseSourceSpan(contentEndSpan, node.sourceSpan.end)
};
}

function locStart(node) {
Expand Down
6 changes: 6 additions & 0 deletions src/language-html/utils.js
Expand Up @@ -55,6 +55,12 @@ function shouldPreserveContent(node) {
return true;
}

// incomplete html in ie conditional comment
// e.g. <!--[if lt IE 9]></div><![endif]-->
if (node.type === "ieConditionalComment" && !node.complete) {
return true;
}

// TODO: handle non-text children in <pre>
if (
isPreLikeNode(node) &&
Expand Down
83 changes: 83 additions & 0 deletions tests/html_comments/__snapshots__/jsfmt.spec.js.snap
Expand Up @@ -91,6 +91,14 @@ exports[`conditional.html - html-verify 1`] = `
<head></head>
<body></body>
</html>
<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<!DOCTYPE html>
<html>
Expand Down Expand Up @@ -124,6 +132,14 @@ exports[`conditional.html - html-verify 1`] = `
<body></body>
</html>
<body width="100%" align="center">
<center>
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div></div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</body>
`;
exports[`conditional.html - html-verify 2`] = `
Expand Down Expand Up @@ -160,6 +176,14 @@ exports[`conditional.html - html-verify 2`] = `
<head></head>
<body></body>
</html>
<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>
~
<!DOCTYPE html>
<html>
Expand Down Expand Up @@ -224,6 +248,17 @@ exports[`conditional.html - html-verify 2`] = `
<body></body>
</html>
<body
width="100%"
align="center"
>
<center>
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div></div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</body>
`;
exports[`conditional.html - html-verify 3`] = `
Expand Down Expand Up @@ -260,6 +295,14 @@ exports[`conditional.html - html-verify 3`] = `
<head></head>
<body></body>
</html>
<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<!DOCTYPE html>
<html>
Expand Down Expand Up @@ -293,6 +336,14 @@ exports[`conditional.html - html-verify 3`] = `
<body></body>
</html>
<body width="100%" align="center">
<center>
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div></div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</body>
`;
exports[`conditional.html - html-verify 4`] = `
Expand Down Expand Up @@ -329,6 +380,14 @@ exports[`conditional.html - html-verify 4`] = `
<head></head>
<body></body>
</html>
<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<!DOCTYPE html>
<html>
Expand Down Expand Up @@ -362,6 +421,14 @@ exports[`conditional.html - html-verify 4`] = `
<body></body>
</html>
<body width="100%" align="center">
<center>
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</body>
`;
exports[`conditional.html - html-verify 5`] = `
Expand Down Expand Up @@ -398,6 +465,14 @@ exports[`conditional.html - html-verify 5`] = `
<head></head>
<body></body>
</html>
<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<!DOCTYPE html>
<html>
Expand Down Expand Up @@ -446,6 +521,14 @@ exports[`conditional.html - html-verify 5`] = `
<body></body>
</html>
<body width="100%" align="center">
<center>
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div></div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</body>
`;
exports[`for_debugging.html - html-verify 1`] = `
Expand Down
8 changes: 8 additions & 0 deletions tests/html_comments/conditional.html
Expand Up @@ -31,3 +31,11 @@
<head></head>
<body></body>
</html>

<body width="100%" align="center">
<center >
<!--[if (gte mso 9)|(IE)]><table cellpadding="0" cellspacing="0" border="0" width="600" align="center"><tr><td><![endif]-->
<div> </div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center >
</body>

0 comments on commit 182a92e

Please sign in to comment.