Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-02-24 09:28:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

test: set back old tests for webpack with isWebpack

Browse Source
This commit is contained in:
julien huang 2023-08-20 22:59:34 +02:00
parent 85bc7d52c6
commit 41fcb19550
1 changed files with 32 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
test/basic.test.ts
View File

@ -1452,7 +1452,11 @@ describe('server components/islands', () => {
const text = (await page.innerText('pre')).replace(/nuxt-ssr-client="([^"]*)"/g, (_, content) => `nuxt-ssr-client="${content.split('-')[0]}"`) const text = (await page.innerText('pre')).replace(/nuxt-ssr-client="([^"]*)"/g, (_, content) => `nuxt-ssr-client="${content.split('-')[0]}"`)
expect(text).toMatchInlineSnapshot('" End page <pre></pre><section id=\\"fallback\\"><div nuxt-ssr-component-uid=\\"0\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <!--[--><div style=\\"display: contents;\\" nuxt-ssr-client=\\"SugarCounter\\"></div><!--teleport start--><!--teleport end--><!--]--></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section><section id=\\"no-fallback\\"><div nuxt-ssr-component-uid=\\"1\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <!--[--><div style=\\"display: contents;\\" nuxt-ssr-client=\\"SugarCounter\\"></div><!--teleport start--><!--teleport end--><!--]--></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section>"') if (isWebpack) {
expect(text).toMatchInlineSnapshot('" End page <pre></pre><section id=\\"fallback\\"><div nuxt-ssr-component-uid=\\"0\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <div class=\\"sugar-counter\\" nuxt-client=\\"\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section><section id=\\"no-fallback\\"><div nuxt-ssr-component-uid=\\"1\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <div class=\\"sugar-counter\\" nuxt-client=\\"\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section>"')
} else {
expect(text).toMatchInlineSnapshot('" End page <pre></pre><section id=\\"fallback\\"><div nuxt-ssr-component-uid=\\"0\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <!--[--><div style=\\"display: contents;\\" nuxt-ssr-client=\\"SugarCounter\\"></div><!--teleport start--><!--teleport end--><!--]--></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section><section id=\\"no-fallback\\"><div nuxt-ssr-component-uid=\\"1\\"> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">42</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <!--[--><div style=\\"display: contents;\\" nuxt-ssr-client=\\"SugarCounter\\"></div><!--teleport start--><!--teleport end--><!--]--></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div></section>"')
}
expect(text).toContain('async component that was very long') expect(text).toContain('async component that was very long')
// Wait for all pending micro ticks to be cleared // Wait for all pending micro ticks to be cleared
@ -1720,7 +1724,22 @@ describe('component islands', () => {
result.teleports = {} result.teleports = {}
result.chunks = {} result.chunks = {}
result.html = result.html.replace(/ nuxt-ssr-client="([^"]*)"/g, (_, content) => `'nuxt-ssr-client="${content.split('-')[0]}"`) result.html = result.html.replace(/ nuxt-ssr-client="([^"]*)"/g, (_, content) => `'nuxt-ssr-client="${content.split('-')[0]}"`)
expect(result).toMatchInlineSnapshot(` if (isWebpack) {
expect(result).toMatchInlineSnapshot(`
{
"chunks": {},
"head": {
"link": [],
"style": [],
},
"html": "<div nuxt-ssr-component-uid> This is a .server (20ms) async component that was very long ... <div id=\\"async-server-component-count\\">2</div><div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><div class=\\"interactive-component-wrapper\\" style=\\"border:solid 1px red;\\"> The component bellow is not a slot but declared as interactive <div class=\\"sugar-counter\\" nuxt-client> Sugar Counter 12 x 1 = 12 <button> Inc </button></div></div><div style=\\"display:contents;\\" nuxt-ssr-slot-name=\\"default\\"></div></div>",
"props": {},
"state": {},
"teleports": {},
}
`)
} else {
expect(result).toMatchInlineSnapshot(`
{ {
"chunks": {}, "chunks": {},
"head": { "head": {
@ -1733,21 +1752,21 @@ describe('component islands', () => {
"teleports": {}, "teleports": {},
} }
`) `)
const propsEntries = Object.entries(props)
const propsEntries = Object.entries(props) const teleportsEntries = Object.entries(teleports)
const teleportsEntries = Object.entries(teleports) const chunksEntries = Object.entries(chunks)
const chunksEntries = Object.entries(chunks) expect(propsEntries).toHaveLength(1)
expect(propsEntries).toHaveLength(1) expect(teleportsEntries).toHaveLength(1)
expect(teleportsEntries).toHaveLength(1) expect(propsEntries[0][0].startsWith('SugarCounter-')).toBeTruthy()
expect(propsEntries[0][0].startsWith('SugarCounter-')).toBeTruthy() expect(teleportsEntries[0][0].startsWith('SugarCounter-')).toBeTruthy()
expect(teleportsEntries[0][0].startsWith('SugarCounter-')).toBeTruthy() expect(chunksEntries[0][0]).toBe('SugarCounter')
expect(chunksEntries[0][0]).toBe('SugarCounter') expect(propsEntries[0][1]).toMatchInlineSnapshot(`
expect(propsEntries[0][1]).toMatchInlineSnapshot(`
{ {
"multiplier": 1, "multiplier": 1,
} }
`) `)
expect(teleportsEntries[0][1]).toMatchInlineSnapshot('"<div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><!--teleport anchor-->"') expect(teleportsEntries[0][1]).toMatchInlineSnapshot('"<div class=\\"sugar-counter\\"> Sugar Counter 12 x 1 = 12 <button> Inc </button></div><!--teleport anchor-->"')
}
}) })
it('renders pure components', async () => { it('renders pure components', async () => {