Skip to content

Commit

Permalink
fix(html): do not touch comments (#5525)
Browse files Browse the repository at this point in the history
  • Loading branch information
ikatyang committed Nov 23, 2018
1 parent 228a8b0 commit 7da4ed7
Show file tree
Hide file tree
Showing 8 changed files with 513 additions and 758 deletions.
137 changes: 69 additions & 68 deletions src/language-html/printer-html.js
Expand Up @@ -25,12 +25,12 @@ const {
forceBreakChildren,
forceBreakContent,
forceNextEmptyLine,
getCommentData,
getLastDescendant,
getPrettierIgnoreAttributeCommentData,
hasPrettierIgnore,
inferScriptParser,
isScriptLikeTag,
isTextLikeNode,
normalizeParts,
preferHardlineAsLeadingSpaces,
replaceDocNewlines,
Expand Down Expand Up @@ -222,9 +222,10 @@ function genericPrint(path, options, print) {
: node.lastChild.hasTrailingSpaces &&
node.lastChild.isTrailingSpaceSensitive
? line
: node.lastChild.type === "text" &&
node.isWhitespaceSensitive &&
node.isIndentationSensitive &&
: (node.lastChild.type === "comment" ||
(node.lastChild.type === "text" &&
node.isWhitespaceSensitive &&
node.isIndentationSensitive)) &&
new RegExp(
`\\n\\s{${options.tabWidth *
countParents(
Expand Down Expand Up @@ -292,33 +293,12 @@ function genericPrint(path, options, print) {
printClosingTagEnd(node, options)
]);
case "comment": {
const value = getCommentData(node);
return concat([
group(
concat([
printOpeningTagStart(node, options),
value.trim().length === 0
? ""
: concat([
indent(
concat([
node.prev &&
needsToBorrowNextOpeningTagStartMarker(node.prev)
? breakParent
: "",
line,
concat(replaceNewlines(value, hardline))
])
),
(node.next
? needsToBorrowPrevClosingTagEndMarker(node.next)
: needsToBorrowLastChildClosingTagEndMarker(node.parent))
? " "
: line
])
])
),
printClosingTagEnd(node, options)
printOpeningTagPrefix(node, options),
"<!--",
concat(replaceNewlines(node.value, literalline)),
"-->",
printClosingTagSuffix(node, options)
]);
}
case "attribute":
Expand Down Expand Up @@ -373,7 +353,16 @@ function printChildren(path, options, print) {
path.map((childPath, childIndex) => {
const childNode = childPath.getValue();

if (childNode.type === "text") {
if (isTextLikeNode(childNode)) {
if (childNode.prev && isTextLikeNode(childNode.prev)) {
const prevBetweenLine = printBetweenLine(childNode.prev, childNode);
if (prevBetweenLine) {
if (forceNextEmptyLine(childNode.prev)) {
return concat([hardline, hardline, printChild(childPath)]);
}
return concat([prevBetweenLine, printChild(childPath)]);
}
}
return printChild(childPath);
}

Expand All @@ -396,7 +385,7 @@ function printChildren(path, options, print) {
} else if (prevBetweenLine === hardline) {
prevParts.push(hardline);
} else {
if (childNode.prev.type === "text") {
if (isTextLikeNode(childNode.prev)) {
leadingParts.push(prevBetweenLine);
} else {
leadingParts.push(
Expand All @@ -410,11 +399,11 @@ function printChildren(path, options, print) {

if (nextBetweenLine) {
if (forceNextEmptyLine(childNode)) {
if (childNode.next.type === "text") {
if (isTextLikeNode(childNode.next)) {
nextParts.push(hardline, hardline);
}
} else if (nextBetweenLine === hardline) {
if (childNode.next.type === "text") {
if (isTextLikeNode(childNode.next)) {
nextParts.push(hardline);
}
} else {
Expand Down Expand Up @@ -497,34 +486,44 @@ function printChildren(path, options, print) {
}

function printBetweenLine(prevNode, nextNode) {
return (needsToBorrowNextOpeningTagStartMarker(prevNode) &&
/**
* 123<a
* ~
* ><b>
*/
(nextNode.firstChild ||
/**
* 123<!--
* ~
* -->
*/
nextNode.isSelfClosing ||
return isTextLikeNode(prevNode) && isTextLikeNode(nextNode)
? prevNode.isTrailingSpaceSensitive
? prevNode.hasTrailingSpaces
? preferHardlineAsLeadingSpaces(nextNode)
? hardline
: line
: ""
: preferHardlineAsLeadingSpaces(nextNode)
? hardline
: softline
: (needsToBorrowNextOpeningTagStartMarker(prevNode) &&
/**
* 123<a
* ~
* ><b>
*/
(nextNode.firstChild ||
/**
* 123<!--
* ~
* -->
*/
nextNode.isSelfClosing ||
/**
* 123<span
* ~
* attr
*/
(nextNode.type === "element" && nextNode.attrs.length !== 0))) ||
/**
* 123<span
* ~
* attr
* <img
* src="long"
* ~
* />123
*/
(nextNode.type === "element" && nextNode.attrs.length !== 0))) ||
/**
* <img
* src="long"
* ~
* />123
*/
(prevNode.type === "element" &&
prevNode.isSelfClosing &&
needsToBorrowPrevClosingTagEndMarker(nextNode))
(prevNode.type === "element" &&
prevNode.isSelfClosing &&
needsToBorrowPrevClosingTagEndMarker(nextNode))
? ""
: !nextNode.isLeadingSpaceSensitive ||
preferHardlineAsLeadingSpaces(nextNode) ||
Expand Down Expand Up @@ -682,7 +681,8 @@ function needsToBorrowNextOpeningTagStartMarker(node) {
*/
return (
node.next &&
node.type === "text" &&
!isTextLikeNode(node.next) &&
isTextLikeNode(node) &&
node.isTrailingSpaceSensitive &&
!node.hasTrailingSpaces
);
Expand Down Expand Up @@ -711,7 +711,12 @@ function needsToBorrowPrevClosingTagEndMarker(node) {
* ><a
* ^
*/
return node.prev && node.isLeadingSpaceSensitive && !node.hasLeadingSpaces;
return (
node.prev &&
!isTextLikeNode(node.prev) &&
node.isLeadingSpaceSensitive &&
!node.hasLeadingSpaces
);
}

function needsToBorrowLastChildClosingTagEndMarker(node) {
Expand All @@ -726,7 +731,7 @@ function needsToBorrowLastChildClosingTagEndMarker(node) {
node.lastChild &&
node.lastChild.isTrailingSpaceSensitive &&
!node.lastChild.hasTrailingSpaces &&
getLastDescendant(node.lastChild).type !== "text"
!isTextLikeNode(getLastDescendant(node.lastChild))
);
}

Expand All @@ -746,7 +751,7 @@ function needsToBorrowParentClosingTagStartMarker(node) {
!node.next &&
!node.hasTrailingSpaces &&
node.isTrailingSpaceSensitive &&
getLastDescendant(node).type === "text"
isTextLikeNode(getLastDescendant(node))
);
}

Expand Down Expand Up @@ -774,8 +779,6 @@ function printClosingTagSuffix(node, options) {

function printOpeningTagStartMarker(node) {
switch (node.type) {
case "comment":
return "<!--";
case "ieConditionalComment":
case "ieConditionalStartComment":
return `<!--[if ${node.condition}`;
Expand Down Expand Up @@ -828,8 +831,6 @@ function printClosingTagEndMarker(node, options) {
return "";
}
switch (node.type) {
case "comment":
return "-->";
case "ieConditionalComment":
case "ieConditionalEndComment":
return `[endif]-->`;
Expand Down
73 changes: 7 additions & 66 deletions src/language-html/utils.js
Expand Up @@ -92,7 +92,7 @@ function shouldPreserveContent(node, options) {
}

function hasPrettierIgnore(node) {
if (node.type === "attribute" || node.type === "text") {
if (node.type === "attribute" || isTextLikeNode(node)) {
return false;
}

Expand Down Expand Up @@ -126,6 +126,11 @@ function getPrettierIgnoreAttributeCommentData(value) {
return match[1].split(/\s+/);
}

/** there's no opening/closing tag or it's considered not breakable */
function isTextLikeNode(node) {
return node.type === "text" || node.type === "comment";
}

function isScriptLikeTag(node) {
return (
node.type === "element" &&
Expand Down Expand Up @@ -519,70 +524,6 @@ function getNodeCssStyleWhiteSpace(node) {
);
}

function getCommentData(node) {
const rightTrimmedValue = node.value.trimRight();

const hasLeadingEmptyLine = /^[^\S\n]*?\n/.test(node.value);
if (hasLeadingEmptyLine) {
/**
* <!--
* 123
* 456
* -->
*/
return dedentString(rightTrimmedValue.replace(/^\s*\n/, ""));
}

/**
* <!-- 123 -->
*
* <!-- 123
* -->
*
* <!-- 123
*
* -->
*/
if (!rightTrimmedValue.includes("\n")) {
return rightTrimmedValue.trimLeft();
}

const firstNewlineIndex = rightTrimmedValue.indexOf("\n");
const dataWithoutLeadingLine = rightTrimmedValue.slice(firstNewlineIndex + 1);
const minIndentationForDataWithoutLeadingLine = getMinIndentation(
dataWithoutLeadingLine
);

const leadingSpaces = rightTrimmedValue.match(/^[^\n\S]*/)[0].length;
const commentDataStartColumn =
node.sourceSpan.start.col + "<!--".length + leadingSpaces;

/**
* <!-- 123
* 456 -->
*/
if (minIndentationForDataWithoutLeadingLine >= commentDataStartColumn) {
return dedentString(
" ".repeat(commentDataStartColumn) +
rightTrimmedValue.slice(leadingSpaces)
);
}

const leadingLineValue = rightTrimmedValue.slice(0, firstNewlineIndex);
/**
* <!-- 123
* 456 -->
*/
return (
leadingLineValue.trim() +
"\n" +
dedentString(
dataWithoutLeadingLine,
minIndentationForDataWithoutLeadingLine
)
);
}

function getMinIndentation(text) {
let minIndentation = Infinity;

Expand Down Expand Up @@ -670,7 +611,6 @@ module.exports = {
forceBreakChildren,
forceBreakContent,
forceNextEmptyLine,
getCommentData,
getLastDescendant,
getNodeCssStyleDisplay,
getNodeCssStyleWhiteSpace,
Expand All @@ -684,6 +624,7 @@ module.exports = {
isLeadingSpaceSensitiveNode,
isPreLikeNode,
isScriptLikeTag,
isTextLikeNode,
isTrailingSpaceSensitiveNode,
isWhitespaceSensitiveNode,
normalizeParts,
Expand Down

0 comments on commit 7da4ed7

Please sign in to comment.