diff options
author | 2023-09-18 15:05:27 +0530 | |
---|---|---|
committer | 2023-09-18 17:35:27 +0800 | |
commit | 8d361169b8e487933d671ce347f0ce74922c80cc (patch) | |
tree | c35c516970f55ccc699d95cfdd6419e24a072fbe | |
parent | fca6892f8d6a30ceb1e04213be2414dd4cb4d389 (diff) | |
download | astro-8d361169b8e487933d671ce347f0ce74922c80cc.tar.gz astro-8d361169b8e487933d671ce347f0ce74922c80cc.tar.zst astro-8d361169b8e487933d671ce347f0ce74922c80cc.zip |
fix: islands are not being rendered correctly (#8580)
-rw-r--r-- | .changeset/eighty-trainers-accept.md | 5 | ||||
-rw-r--r-- | packages/astro/src/runtime/server/scripts.ts | 6 |
2 files changed, 8 insertions, 3 deletions
diff --git a/.changeset/eighty-trainers-accept.md b/.changeset/eighty-trainers-accept.md new file mode 100644 index 000000000..c4bb890a1 --- /dev/null +++ b/.changeset/eighty-trainers-accept.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +add hide to style & script generated for island diff --git a/packages/astro/src/runtime/server/scripts.ts b/packages/astro/src/runtime/server/scripts.ts index 47cd122f1..791be3201 100644 --- a/packages/astro/src/runtime/server/scripts.ts +++ b/packages/astro/src/runtime/server/scripts.ts @@ -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 ''; } |