root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 7 Packages Projects Releases Wiki Activity

refactor: improve comment handling in renderVNode to avoid escaping anchors

This commit is contained in:
daiwei 2025-08-13 16:34:25 +08:00
parent 1af4c304a9
commit ae485d22f4
3 changed files with 25 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
packages/compiler-ssr/__tests__/ssrVaporAnchors.spec.ts
View File

@ -178,16 +178,16 @@ describe('insertion anchors', () => {
(_ctx.foo) (_ctx.foo)
? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [
_createVNode("span"), _createVNode("span"),
_createCommentVNode("if") _createCommentVNode("<!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_ctx.bar) : (_ctx.bar)
? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
_createVNode("span"), _createVNode("span"),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_openBlock(), _createBlock(_Fragment, { key: 2 }, [ : (_openBlock(), _createBlock(_Fragment, { key: 2 }, [
_createVNode("span"), _createVNode("span"),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)), ], 64 /* STABLE_FRAGMENT */)),
_createCommentVNode("p]"), _createCommentVNode("p]"),
_createVNode("span") _createVNode("span")
@ -335,7 +335,7 @@ describe('insertion anchors', () => {
_createCommentVNode("p]"), _createCommentVNode("p]"),
_createVNode("span") _createVNode("span")
]), ]),
_createCommentVNode("if") _createCommentVNode("<!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_ctx.bar) : (_ctx.bar)
? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
@ -348,7 +348,7 @@ describe('insertion anchors', () => {
_createCommentVNode("p]"), _createCommentVNode("p]"),
_createVNode("span") _createVNode("span")
]), ]),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_openBlock(), _createBlock(_Fragment, { key: 2 }, [ : (_openBlock(), _createBlock(_Fragment, { key: 2 }, [
_createVNode("span", null, [ _createVNode("span", null, [
@ -360,7 +360,7 @@ describe('insertion anchors', () => {
_createCommentVNode("p]"), _createCommentVNode("p]"),
_createVNode("span") _createVNode("span")
]), ]),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)), ], 64 /* STABLE_FRAGMENT */)),
_createCommentVNode("p]"), _createCommentVNode("p]"),
_createVNode("span") _createVNode("span")
@ -617,21 +617,21 @@ describe('block anchors', () => {
(_ctx.count === 1) (_ctx.count === 1)
? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [
_createVNode("span", null, "1"), _createVNode("span", null, "1"),
_createCommentVNode("if") _createCommentVNode("<!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_ctx.count === 2) : (_ctx.count === 2)
? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
_createVNode("span", null, "2"), _createVNode("span", null, "2"),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_ctx.count === 3) : (_ctx.count === 3)
? (_openBlock(), _createBlock(_Fragment, { key: 2 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 2 }, [
_createVNode("span", null, "3"), _createVNode("span", null, "3"),
_createCommentVNode("if--><!--if--><!--if") _createCommentVNode("<!--if--><!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_openBlock(), _createBlock(_Fragment, { key: 3 }, [ : (_openBlock(), _createBlock(_Fragment, { key: 3 }, [
_createVNode("span", null, "4"), _createVNode("span", null, "4"),
_createCommentVNode("if--><!--if--><!--if") _createCommentVNode("<!--if--><!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
] ]
} }
@ -682,18 +682,18 @@ describe('block anchors', () => {
(_ctx.count === 1) (_ctx.count === 1)
? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 0 }, [
_createVNode("span", { innerHTML: _ctx.html }, null, 8 /* PROPS */, ["innerHTML"]), _createVNode("span", { innerHTML: _ctx.html }, null, 8 /* PROPS */, ["innerHTML"]),
_createCommentVNode("if") _createCommentVNode("<!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_ctx.count === 2) : (_ctx.count === 2)
? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [ ? (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
_createVNode("span", { _createVNode("span", {
textContent: _toDisplayString(_ctx.txt) textContent: _toDisplayString(_ctx.txt)
}, null, 8 /* PROPS */, ["textContent"]), }, null, 8 /* PROPS */, ["textContent"]),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
: (_openBlock(), _createBlock(_Fragment, { key: 2 }, [ : (_openBlock(), _createBlock(_Fragment, { key: 2 }, [
_createVNode("span", null, "4"), _createVNode("span", null, "4"),
_createCommentVNode("if--><!--if") _createCommentVNode("<!--if--><!--if-->")
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
] ]
} }

4
packages/compiler-ssr/src/transforms/ssrTransformComponent.ts
View File

@ -529,9 +529,7 @@ function injectIfAnchors(
if (blockAnchorLabel) { if (blockAnchorLabel) {
const repeatCount = j - i - (isElse ? 1 : 0) + 1 const repeatCount = j - i - (isElse ? 1 : 0) + 1
wrapperNode.children.push( wrapperNode.children.push(
createAnchor( createAnchor(`<!--${blockAnchorLabel}-->`.repeat(repeatCount)),
`<!--${blockAnchorLabel}-->`.repeat(repeatCount).slice(4, -3),
),
) )
} }
node.children = injectVaporAnchors(node.children, node) node.children = injectVaporAnchors(node.children, node)

16
packages/server-renderer/src/render.ts
View File

@ -236,11 +236,17 @@ export function renderVNode(
push(escapeHtml(children as string)) push(escapeHtml(children as string))
break break
case Comment: case Comment:
push( if (children) {
children const content = children as string
? `<!--${escapeHtmlComment(children as string)}-->` // avoid escaping comments
: `<!---->`, if (content.startsWith('<!--') && content.endsWith('-->')) {
) push(content)
} else {
push(`<!--${escapeHtmlComment(content)}-->`)
}
} else {
push(`<!---->`)
}
break break
case Static: case Static:
push(children as string) push(children as string)