fix: islands are not being rendered correctly (#8580)

This commit is contained in:
Rishi Raj Jain 2023-09-18 15:05:27 +05:30 committed by GitHub
parent fca6892f8d
commit 8d361169b8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 3 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
add hide to style & script generated for island

View file

@ -1,7 +1,7 @@
import type { SSRResult } from '../../@types/astro.js';
import islandScript from './astro-island.prebuilt.js';
const ISLAND_STYLES = `<style>astro-island,astro-slot,astro-static-slot{display:contents}</style>`;
const ISLAND_STYLES = `<style style="display:none">astro-island,astro-slot,astro-static-slot{display:contents}</style>`;
export function determineIfNeedsHydrationScript(result: SSRResult): boolean {
if (result._metadata.hasHydrationScript) {
@ -36,12 +36,12 @@ export function getPrescripts(result: SSRResult, type: PrescriptType, directive:
// deps to be loaded immediately.
switch (type) {
case 'both':
return `${ISLAND_STYLES}<script>${getDirectiveScriptText(
return `${ISLAND_STYLES}<script style="display:none">${getDirectiveScriptText(
result,
directive
)};${islandScript}</script>`;
case 'directive':
return `<script>${getDirectiveScriptText(result, directive)}</script>`;
return `<script style="display:none">${getDirectiveScriptText(result, directive)}</script>`;
}
return '';
}