feat(html): update angular-html-parser (#5565)
- support [`htm`](https://github.com/developit/htm) (`<${Component}>content<//>`, `<div />`) - preserve [bogus comments](https://www.w3.org/TR/html5/syntax.html#bogus-comment-state) (`<! ... >`, `<? ... >`)master
parent
d124bbaacb
commit
28b938da97
|
@ -20,7 +20,7 @@
|
|||
"@glimmer/syntax": "0.30.3",
|
||||
"@iarna/toml": "2.0.0",
|
||||
"angular-estree-parser": "1.1.5",
|
||||
"angular-html-parser": "1.0.0",
|
||||
"angular-html-parser": "1.1.0",
|
||||
"camelcase": "4.1.0",
|
||||
"chalk": "2.1.0",
|
||||
"cjk-regex": "2.0.0",
|
||||
|
|
|
@ -9,7 +9,12 @@ const { parseIeConditionalComment } = require("./conditional-comment");
|
|||
|
||||
function ngHtmlParser(
|
||||
input,
|
||||
{ recognizeSelfClosing, normalizeTagName, normalizeAttributeName }
|
||||
{
|
||||
recognizeSelfClosing,
|
||||
normalizeTagName,
|
||||
normalizeAttributeName,
|
||||
allowHtmComponentClosingTags
|
||||
}
|
||||
) {
|
||||
const parser = require("angular-html-parser");
|
||||
const {
|
||||
|
@ -30,7 +35,8 @@ function ngHtmlParser(
|
|||
} = require("angular-html-parser/lib/compiler/src/ml_parser/html_tags");
|
||||
|
||||
const { rootNodes, errors } = parser.parse(input, {
|
||||
canSelfClose: recognizeSelfClosing
|
||||
canSelfClose: recognizeSelfClosing,
|
||||
allowHtmComponentClosingTags
|
||||
});
|
||||
|
||||
if (errors.length !== 0) {
|
||||
|
@ -255,7 +261,8 @@ function locEnd(node) {
|
|||
function createParser({
|
||||
recognizeSelfClosing = false,
|
||||
normalizeTagName = false,
|
||||
normalizeAttributeName = false
|
||||
normalizeAttributeName = false,
|
||||
allowHtmComponentClosingTags = false
|
||||
} = {}) {
|
||||
return {
|
||||
preprocess: text => text.replace(/\r\n?/g, "\n"),
|
||||
|
@ -263,7 +270,8 @@ function createParser({
|
|||
_parse(text, options, {
|
||||
recognizeSelfClosing,
|
||||
normalizeTagName,
|
||||
normalizeAttributeName
|
||||
normalizeAttributeName,
|
||||
allowHtmComponentClosingTags
|
||||
}),
|
||||
hasPragma,
|
||||
astFormat: "html",
|
||||
|
@ -275,8 +283,10 @@ function createParser({
|
|||
module.exports = {
|
||||
parsers: {
|
||||
html: createParser({
|
||||
recognizeSelfClosing: true,
|
||||
normalizeTagName: true,
|
||||
normalizeAttributeName: true
|
||||
normalizeAttributeName: true,
|
||||
allowHtmComponentClosingTags: true
|
||||
}),
|
||||
angular: createParser(),
|
||||
vue: createParser({ recognizeSelfClosing: true })
|
||||
|
|
|
@ -18,6 +18,7 @@ const PREPROCESS_PIPELINE = [
|
|||
extractWhitespaces,
|
||||
addCssDisplay,
|
||||
addIsSelfClosing,
|
||||
addHasHtmComponentClosingTag,
|
||||
addIsSpaceSensitive,
|
||||
mergeSimpleElementIntoText
|
||||
];
|
||||
|
@ -401,6 +402,23 @@ function addIsSelfClosing(ast /*, options */) {
|
|||
);
|
||||
}
|
||||
|
||||
function addHasHtmComponentClosingTag(ast, options) {
|
||||
return ast.map(node =>
|
||||
node.type !== "element"
|
||||
? node
|
||||
: Object.assign(node, {
|
||||
hasHtmComponentClosingTag:
|
||||
node.endSourceSpan &&
|
||||
/^<\s*\/\s*\/\s*>$/.test(
|
||||
options.originalText.slice(
|
||||
node.endSourceSpan.start.offset,
|
||||
node.endSourceSpan.end.offset
|
||||
)
|
||||
)
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
function addCssDisplay(ast, options) {
|
||||
return ast.map(node =>
|
||||
Object.assign(node, { cssDisplay: getNodeCssStyleDisplay(node, options) })
|
||||
|
|
|
@ -313,9 +313,15 @@ function genericPrint(path, options, print) {
|
|||
case "comment": {
|
||||
return concat([
|
||||
printOpeningTagPrefix(node, options),
|
||||
"<!--",
|
||||
concat(replaceNewlines(node.value, literalline)),
|
||||
"-->",
|
||||
concat(
|
||||
replaceNewlines(
|
||||
options.originalText.slice(
|
||||
options.locStart(node),
|
||||
options.locEnd(node)
|
||||
),
|
||||
literalline
|
||||
)
|
||||
),
|
||||
printClosingTagSuffix(node, options)
|
||||
]);
|
||||
}
|
||||
|
@ -839,6 +845,11 @@ function printClosingTagStartMarker(node, options) {
|
|||
switch (node.type) {
|
||||
case "ieConditionalComment":
|
||||
return "<!";
|
||||
case "element":
|
||||
if (node.hasHtmComponentClosingTag) {
|
||||
return "<//";
|
||||
}
|
||||
// fall through
|
||||
default:
|
||||
return `</${node.rawName}`;
|
||||
}
|
||||
|
|
|
@ -91,6 +91,87 @@ printWidth: 80
|
|||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`bogus.html 1`] = `
|
||||
====================================options=====================================
|
||||
parsers: ["html"]
|
||||
printWidth: 80
|
||||
| printWidth
|
||||
=====================================input======================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
=====================================output=====================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`bogus.html 2`] = `
|
||||
====================================options=====================================
|
||||
parsers: ["html"]
|
||||
printWidth: 1
|
||||
| printWidth
|
||||
=====================================input======================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
=====================================output=====================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`bogus.html 3`] = `
|
||||
====================================options=====================================
|
||||
parsers: ["html"]
|
||||
printWidth: Infinity
|
||||
=====================================input======================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
=====================================output=====================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`bogus.html 4`] = `
|
||||
====================================options=====================================
|
||||
htmlWhitespaceSensitivity: "strict"
|
||||
parsers: ["html"]
|
||||
printWidth: 80
|
||||
| printWidth
|
||||
=====================================input======================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
=====================================output=====================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`bogus.html 5`] = `
|
||||
====================================options=====================================
|
||||
htmlWhitespaceSensitivity: "ignore"
|
||||
parsers: ["html"]
|
||||
printWidth: 80
|
||||
| printWidth
|
||||
=====================================input======================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
=====================================output=====================================
|
||||
<? hello ?>
|
||||
<!- world ->
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
||||
exports[`conditional.html 1`] = `
|
||||
====================================options=====================================
|
||||
parsers: ["html"]
|
||||
|
|
|
@ -0,0 +1,2 @@
|
|||
<? hello ?>
|
||||
<!- world ->
|
|
@ -55,6 +55,10 @@ html\`\`
|
|||
|
||||
html\`<my-element obj=\${obj}></my-element>\`;
|
||||
|
||||
html\` <\${Footer} >footer content<// > \`
|
||||
|
||||
html\` <div /> \`
|
||||
|
||||
=====================================output=====================================
|
||||
import { LitElement, html } from "@polymer/lit-element";
|
||||
|
||||
|
@ -98,5 +102,13 @@ html\`
|
|||
<my-element obj=\${obj}></my-element>
|
||||
\`;
|
||||
|
||||
html\`
|
||||
<\${Footer}>footer content<//>
|
||||
\`;
|
||||
|
||||
html\`
|
||||
<div />
|
||||
\`;
|
||||
|
||||
================================================================================
|
||||
`;
|
||||
|
|
|
@ -46,3 +46,7 @@ const someHtml2 = /* HTML */ `<div > hello ${world} </div >`;
|
|||
html``
|
||||
|
||||
html`<my-element obj=${obj}></my-element>`;
|
||||
|
||||
html` <${Footer} >footer content<// > `
|
||||
|
||||
html` <div /> `
|
||||
|
|
|
@ -675,9 +675,9 @@ angular-estree-parser@1.1.5:
|
|||
lines-and-columns "^1.1.6"
|
||||
tslib "^1.9.3"
|
||||
|
||||
angular-html-parser@1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/angular-html-parser/-/angular-html-parser-1.0.0.tgz#57feed04674c170fa56bfcd556cf7b2cd677e170"
|
||||
angular-html-parser@1.1.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/angular-html-parser/-/angular-html-parser-1.1.0.tgz#0199c3c675c6bc9e1c7df9b41569c9df99b53f8c"
|
||||
dependencies:
|
||||
tslib "^1.9.3"
|
||||
|
||||
|
|
Loading…
Reference in New Issue