fix(nuxt): allow omitting fallback in island response (#25296)

This commit is contained in:
Julien Huang 2024-01-18 23:20:01 +01:00 committed by GitHub
parent 28b58c9145
commit ce7845cbcf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 3 additions and 5 deletions

View File

@ -134,7 +134,7 @@ export default defineComponent({
return html.replaceAll(SLOT_FALLBACK_RE, (full, slotName) => { return html.replaceAll(SLOT_FALLBACK_RE, (full, slotName) => {
if (!currentSlots.includes(slotName)) { if (!currentSlots.includes(slotName)) {
return full + payloadSlots[slotName]?.fallback ?? '' return full + (payloadSlots[slotName]?.fallback || '')
} }
return full return full
}) })

View File

@ -64,7 +64,7 @@ export interface NuxtIslandContext {
export interface NuxtIslandSlotResponse { export interface NuxtIslandSlotResponse {
props: Array<unknown> props: Array<unknown>
fallback: string fallback?: string
} }
export interface NuxtIslandClientResponse { export interface NuxtIslandClientResponse {
html: string html: string
@ -626,7 +626,7 @@ function getSlotIslandResponse (ssrContext: NuxtSSRContext): NuxtIslandResponse[
for (const slot in ssrContext.islandContext.slots) { for (const slot in ssrContext.islandContext.slots) {
response[slot] = { response[slot] = {
...ssrContext.islandContext.slots[slot], ...ssrContext.islandContext.slots[slot],
fallback: ssrContext.teleports?.[`island-fallback=${slot}`] || '' fallback: ssrContext.teleports?.[`island-fallback=${slot}`]
} }
} }
return response return response

View File

@ -1825,7 +1825,6 @@ describe('component islands', () => {
"html": "<div data-island-uid><div> count is above 2 </div><!--[--><div style="display: contents;" data-island-uid data-island-slot="default"></div><!--]--> that was very long ... <div id="long-async-component-count">3</div> <!--[--><div style="display: contents;" data-island-uid data-island-slot="test"></div><!--]--><p>hello world !!!</p><!--[--><div style="display: contents;" data-island-uid data-island-slot="hello"></div><!--teleport start--><!--teleport end--><!--]--><!--[--><div style="display: contents;" data-island-uid data-island-slot="fallback"></div><!--teleport start--><!--teleport end--><!--]--></div>", "html": "<div data-island-uid><div> count is above 2 </div><!--[--><div style="display: contents;" data-island-uid data-island-slot="default"></div><!--]--> that was very long ... <div id="long-async-component-count">3</div> <!--[--><div style="display: contents;" data-island-uid data-island-slot="test"></div><!--]--><p>hello world !!!</p><!--[--><div style="display: contents;" data-island-uid data-island-slot="hello"></div><!--teleport start--><!--teleport end--><!--]--><!--[--><div style="display: contents;" data-island-uid data-island-slot="fallback"></div><!--teleport start--><!--teleport end--><!--]--></div>",
"slots": { "slots": {
"default": { "default": {
"fallback": "",
"props": [], "props": [],
}, },
"fallback": { "fallback": {
@ -1854,7 +1853,6 @@ describe('component islands', () => {
], ],
}, },
"test": { "test": {
"fallback": "",
"props": [ "props": [
{ {
"count": 3, "count": 3,