fix(ssr): fix hydration mismatch caused by multi-line comments inside slot

fix #5355
This commit is contained in:
Evan You 2022-05-19 11:36:29 +08:00
parent 516bc548fc
commit e1bc2681ef
2 changed files with 31 additions and 1 deletions

View File

@ -49,6 +49,36 @@ describe('ssr: slot', () => {
).toBe(`<div><!--[--><!--]--></div>`) ).toBe(`<div><!--[--><!--]--></div>`)
}) })
test('empty slot (manual comments)', async () => {
expect(
await renderToString(
createApp({
components: {
one: {
template: `<div><slot/></div>`
}
},
template: `<one><!--hello--></one>`
})
)
).toBe(`<div><!--[--><!--]--></div>`)
})
test('empty slot (multi-line comments)', async () => {
expect(
await renderToString(
createApp({
components: {
one: {
template: `<div><slot/></div>`
}
},
template: `<one><!--he\nllo--></one>`
})
)
).toBe(`<div><!--[--><!--]--></div>`)
})
test('multiple elements', async () => { test('multiple elements', async () => {
expect( expect(
await renderToString( await renderToString(

View File

@ -82,7 +82,7 @@ export function ssrRenderSlotInner(
} }
} }
const commentRE = /<!--.*?-->/g const commentRE = /<!--[^]*?-->/gm
function isComment(item: SSRBufferItem) { function isComment(item: SSRBufferItem) {
return ( return (
typeof item === 'string' && typeof item === 'string' &&