astro 5.8.1 → 5.9.0

package/dist/runtime/server/render/server-islands.js

@@ -1,6 +1,7 @@
-import { encryptString } from "../../../core/encryption.js";
+import { encryptString, generateCspDigest } from "../../../core/encryption.js";
 import { markHTMLString } from "../escape.js";
 import { renderChild } from "./any.js";
+import { createThinHead } from "./astro/head-and-content.js";
 import { createRenderInstruction } from "./instruction.js";
 import { renderSlotToString } from "./slot.js";
 const internalProps = /* @__PURE__ */ new Set([
@@ -31,54 +32,63 @@ function isWithinURLLimit(pathname, params) {
   const chars = url.length;
   return chars < 2048;
 }
-function renderServerIsland(result, _displayName, props, slots) {
-  return {
-    async render(destination) {
-      const componentPath = props["server:component-path"];
-      const componentExport = props["server:component-export"];
-      const componentId = result.serverIslandNameMap.get(componentPath);
-      if (!componentId) {
-        throw new Error(`Could not find server component name`);
-      }
-      for (const key2 of Object.keys(props)) {
-        if (internalProps.has(key2)) {
-          delete props[key2];
-        }
+class ServerIslandComponent {
+  result;
+  props;
+  slots;
+  displayName;
+  hostId;
+  islandContent;
+  constructor(result, props, slots, displayName) {
+    this.result = result;
+    this.props = props;
+    this.slots = slots;
+    this.displayName = displayName;
+  }
+  async init() {
+    const componentPath = this.props["server:component-path"];
+    const componentExport = this.props["server:component-export"];
+    const componentId = this.result.serverIslandNameMap.get(componentPath);
+    if (!componentId) {
+      throw new Error(`Could not find server component name`);
+    }
+    for (const key2 of Object.keys(this.props)) {
+      if (internalProps.has(key2)) {
+        delete this.props[key2];
       }
-      destination.write(createRenderInstruction({ type: "server-island-runtime" }));
-      destination.write("<!--[if astro]>server-island-start<![endif]-->");
-      const renderedSlots = {};
-      for (const name in slots) {
-        if (name !== "fallback") {
-          const content = await renderSlotToString(result, slots[name]);
-          renderedSlots[name] = content.toString();
-        } else {
-          await renderChild(destination, slots.fallback(result));
-        }
+    }
+    const renderedSlots = {};
+    for (const name in this.slots) {
+      if (name !== "fallback") {
+        const content2 = await renderSlotToString(this.result, this.slots[name]);
+        renderedSlots[name] = content2.toString();
       }
-      const key = await result.key;
-      const propsEncrypted = Object.keys(props).length === 0 ? "" : await encryptString(key, JSON.stringify(props));
-      const hostId = crypto.randomUUID();
-      const slash = result.base.endsWith("/") ? "" : "/";
-      let serverIslandUrl = `${result.base}${slash}_server-islands/${componentId}${result.trailingSlash === "always" ? "/" : ""}`;
-      const potentialSearchParams = createSearchParams(
-        componentExport,
-        propsEncrypted,
-        safeJsonStringify(renderedSlots)
-      );
-      const useGETRequest = isWithinURLLimit(serverIslandUrl, potentialSearchParams);
-      if (useGETRequest) {
-        serverIslandUrl += "?" + potentialSearchParams.toString();
-        destination.write(
+    }
+    const key = await this.result.key;
+    const propsEncrypted = Object.keys(this.props).length === 0 ? "" : await encryptString(key, JSON.stringify(this.props));
+    const hostId = crypto.randomUUID();
+    const slash = this.result.base.endsWith("/") ? "" : "/";
+    let serverIslandUrl = `${this.result.base}${slash}_server-islands/${componentId}${this.result.trailingSlash === "always" ? "/" : ""}`;
+    const potentialSearchParams = createSearchParams(
+      componentExport,
+      propsEncrypted,
+      safeJsonStringify(renderedSlots)
+    );
+    const useGETRequest = isWithinURLLimit(serverIslandUrl, potentialSearchParams);
+    if (useGETRequest) {
+      serverIslandUrl += "?" + potentialSearchParams.toString();
+      this.result._metadata.extraHead.push(
+        markHTMLString(
           `<link rel="preload" as="fetch" href="${serverIslandUrl}" crossorigin="anonymous">`
-        );
-      }
-      destination.write(`<script type="module" data-astro-rerun data-island-id="${hostId}">${useGETRequest ? (
-        // GET request
-        `let response = await fetch('${serverIslandUrl}');`
-      ) : (
-        // POST request
-        `let data = {
+        )
+      );
+    }
+    const method = useGETRequest ? (
+      // GET request
+      `let response = await fetch('${serverIslandUrl}');`
+    ) : (
+      // POST request
+      `let data = {
 	componentExport: ${safeJsonStringify(componentExport)},
 	encryptedProps: ${safeJsonStringify(propsEncrypted)},
 	slots: ${safeJsonStringify(renderedSlots)},
@@ -87,33 +97,54 @@ let response = await fetch('${serverIslandUrl}', {
 	method: 'POST',
 	body: JSON.stringify(data),
 });`
-      )}
-replaceServerIsland('${hostId}', response);</script>`);
+    );
+    const content = `${method}replaceServerIsland('${hostId}', response);`;
+    if (this.result.shouldInjectCspMetaTags) {
+      this.result._metadata.extraScriptHashes.push(
+        await generateCspDigest(SERVER_ISLAND_REPLACER, this.result.cspAlgorithm)
+      );
+      const contentDigest = await generateCspDigest(content, this.result.cspAlgorithm);
+      this.result._metadata.extraScriptHashes.push(contentDigest);
     }
-  };
+    this.islandContent = content;
+    this.hostId = hostId;
+    return createThinHead();
+  }
+  async render(destination) {
+    for (const name in this.slots) {
+      if (name === "fallback") {
+        await renderChild(destination, this.slots.fallback(this.result));
+      }
+    }
+    destination.write(createRenderInstruction({ type: "server-island-runtime" }));
+    destination.write("<!--[if astro]>server-island-start<![endif]-->");
+    destination.write(
+      `<script type="module" data-astro-rerun data-island-id="${this.hostId}">${this.islandContent}</script>`
+    );
+  }
 }
-const renderServerIslandRuntime = () => markHTMLString(
-  `
-	<script>
-		async function replaceServerIsland(id, r) {
-			let s = document.querySelector(\`script[data-island-id="\${id}"]\`);
-			// If there's no matching script, or the request fails then return
-			if (!s || r.status !== 200 || r.headers.get('content-type')?.split(';')[0].trim() !== 'text/html') return;
-			// Load the HTML before modifying the DOM in case of errors
-			let html = await r.text();
-			// Remove any placeholder content before the island script
-			while (s.previousSibling && s.previousSibling.nodeType !== 8 && s.previousSibling.data !== '[if astro]>server-island-start<![endif]')
-				s.previousSibling.remove();
-			s.previousSibling?.remove();
-			// Insert the new HTML
-			s.before(document.createRange().createContextualFragment(html));
-			// Remove the script. Prior to v5.4.2, this was the trick to force rerun of scripts.  Keeping it to minimize change to the existing behavior.
-			s.remove();
-		}
-	</script>`.split("\n").map((line) => line.trim()).filter((line) => line && !line.startsWith("//")).join(" ")
+const renderServerIslandRuntime = () => {
+  return `<script>${SERVER_ISLAND_REPLACER}</script>`;
+};
+const SERVER_ISLAND_REPLACER = markHTMLString(
+  `async function replaceServerIsland(id, r) {
+	let s = document.querySelector(\`script[data-island-id="\${id}"]\`);
+	// If there's no matching script, or the request fails then return
+	if (!s || r.status !== 200 || r.headers.get('content-type')?.split(';')[0].trim() !== 'text/html') return;
+	// Load the HTML before modifying the DOM in case of errors
+	let html = await r.text();
+	// Remove any placeholder content before the island script
+	while (s.previousSibling && s.previousSibling.nodeType !== 8 && s.previousSibling.data !== '[if astro]>server-island-start<![endif]')
+		s.previousSibling.remove();
+	s.previousSibling?.remove();
+	// Insert the new HTML
+	s.before(document.createRange().createContextualFragment(html));
+	// Remove the script. Prior to v5.4.2, this was the trick to force rerun of scripts.  Keeping it to minimize change to the existing behavior.
+	s.remove();
+}`.split("\n").map((line) => line.trim()).filter((line) => line && !line.startsWith("//")).join(" ")
 );
 export {
+  ServerIslandComponent,
   containsServerDirective,
-  renderServerIsland,
   renderServerIslandRuntime
 };

package/dist/runtime/server/render/util.js

@@ -75,6 +75,9 @@ Make sure to use the static attribute syntax (\`${key}={value}\`) instead of the
   if (key === "popover" && typeof value === "boolean") {
     return markHTMLString(value ? ` popover` : "");
   }
+  if (key === "download" && typeof value === "boolean") {
+    return markHTMLString(value ? ` download` : "");
+  }
   return markHTMLString(` ${key}="${toAttributeString(value, shouldEscape)}"`);
 }
 function internalSpreadAttributes(values, shouldEscape = true) {

package/dist/runtime/server/scripts.d.ts

@@ -1,5 +1,5 @@
 import type { SSRResult } from '../../types/public/internal.js';
 export declare function determineIfNeedsHydrationScript(result: SSRResult): boolean;
 export declare function determinesIfNeedsDirectiveScript(result: SSRResult, directive: string): boolean;
-export type PrescriptType = null | 'both' | 'directive';
+export type PrescriptType = 'both' | 'directive';
 export declare function getPrescripts(result: SSRResult, type: PrescriptType, directive: string): string;

package/dist/runtime/server/scripts.js

@@ -1,6 +1,6 @@
+import { ISLAND_STYLES } from "./astro-island-styles.js";
 import islandScriptDev from "./astro-island.prebuilt-dev.js";
 import islandScript from "./astro-island.prebuilt.js";
-const ISLAND_STYLES = `<style>astro-island,astro-slot,astro-static-slot{display:contents}</style>`;
 function determineIfNeedsHydrationScript(result) {
   if (result._metadata.hasHydrationScript) {
     return false;
@@ -25,13 +25,10 @@ function getDirectiveScriptText(result, directive) {
 function getPrescripts(result, type, directive) {
   switch (type) {
     case "both":
-      return `${ISLAND_STYLES}<script>${getDirectiveScriptText(result, directive)};${process.env.NODE_ENV === "development" ? islandScriptDev : islandScript}</script>`;
+      return `<style>${ISLAND_STYLES}</style><script>${getDirectiveScriptText(result, directive)}</script><script>${process.env.NODE_ENV === "development" ? islandScriptDev : islandScript}</script>`;
     case "directive":
       return `<script>${getDirectiveScriptText(result, directive)}</script>`;
-    case null:
-      break;
   }
-  return "";
 }
 export {
   determineIfNeedsHydrationScript,

package/dist/runtime/server/transition.d.ts

@@ -1,7 +1,7 @@
 import type { SSRResult } from '../../types/public/internal.js';
 import type { TransitionAnimationPair, TransitionAnimationValue } from '../../types/public/view-transitions.js';
 export declare function createTransitionScope(result: SSRResult, hash: string): string;
-export declare function renderTransition(result: SSRResult, hash: string, animationName: TransitionAnimationValue | undefined, transitionName: string): string;
+export declare function renderTransition(result: SSRResult, hash: string, animationName: TransitionAnimationValue | undefined, transitionName: string): Promise<string>;
 export declare function createAnimationScope(transitionName: string, animations: Record<string, TransitionAnimationPair>): {
     scope: string;
     styles: string;

package/dist/runtime/server/transition.js

@@ -1,4 +1,5 @@
 import cssesc from "cssesc";
+import { generateCspDigest } from "../../core/encryption.js";
 import { fade, slide } from "../../transitions/index.js";
 import { markHTMLString } from "./escape.js";
 const transitionNameMap = /* @__PURE__ */ new WeakMap();
@@ -39,7 +40,7 @@ function reEncode(s) {
   }
   return reEncodeInValidStart[result.codePointAt(0) ?? 0] ? "_" + result : result;
 }
-function renderTransition(result, hash, animationName, transitionName) {
+async function renderTransition(result, hash, animationName, transitionName) {
   if (typeof (transitionName ?? "") !== "string") {
     throw new Error(`Invalid transition name {${transitionName}}`);
   }
@@ -56,7 +57,11 @@ function renderTransition(result, hash, animationName, transitionName) {
     sheet.addAnimationRaw("new", "animation: none; mix-blend-mode: normal;");
     sheet.addModern("group", "animation: none");
   }
-  result._metadata.extraHead.push(markHTMLString(`<style>${sheet.toString()}</style>`));
+  const css = sheet.toString();
+  if (result.shouldInjectCspMetaTags) {
+    result._metadata.extraStyleHashes.push(await generateCspDigest(css, result.cspAlgorithm));
+  }
+  result._metadata.extraHead.push(markHTMLString(`<style>${css}</style>`));
   return scope;
 }
 function createAnimationScope(transitionName, animations) {

package/dist/types/public/config.d.ts

@@ -9,6 +9,7 @@ import type { AssetsPrefix } from '../../core/app/types.js';
 import type { AstroConfigType } from '../../core/config/schemas/index.js';
 import type { REDIRECT_STATUS_CODES } from '../../core/constants.js';
 import type { AstroCookieSetOptions } from '../../core/cookies/cookies.js';
+import type { CspAlgorithm, CspDirective, CspHash } from '../../core/csp/config.js';
 import type { LoggerLevel } from '../../core/logger/core.js';
 import type { EnvSchema } from '../../env/schema.js';
 import type { AstroIntegration } from './integrations.js';
@@ -17,6 +18,7 @@ export type Locales = (string | {
     path: string;
 })[];
 export type { AstroFontProvider as FontProvider };
+export type { CspAlgorithm };
 type NormalizeLocales<T extends Locales> = {
     [K in keyof T]: T[K] extends string ? T[K] : T[K] extends {
         codes: Array<string>;
@@ -2118,6 +2120,244 @@ export interface ViteUserConfig extends OriginalViteUserConfig {
          * include a trailing `-`, matching standard behavior in other Markdown tooling.
          */
         headingIdCompat?: boolean;
+        /**
+         * @name experimental.csp
+         * @type {boolean | object}
+         * @default `false`
+         * @version 5.9.0
+         * @description
+         *
+         * Enables built-in support for Content Security Policy (CSP). For more information,
+         * refer to the [experimental CSP documentation](https://docs.astro.build/en/reference/experimental-flags/csp/)
+         *
+         */
+        csp?: boolean | {
+            /**
+             * @name experimental.csp.algorithm
+             * @type {"SHA-256" | "SHA-384" | "SHA-512"}
+             * @default `'SHA-256'`
+             * @version 5.9.0
+             * @description
+             *
+             * The [hash function](https://developer.mozilla.org/en-US/docs/Glossary/Hash_function) to use to generate the hashes of the styles and scripts emitted by Astro.
+             *
+             * ```js
+             * import { defineConfig } from 'astro/config';
+             *
+             * export default defineConfig({
+             *   experimental: {
+             *     csp: {
+             *       algorithm: 'SHA-512'
+             *     }
+             *   }
+             * });
+             * ```
+             */
+            algorithm?: CspAlgorithm;
+            /**
+             * @name experimental.csp.styleDirective
+             * @type {{ hashes?: CspHash[], resources?: string[] }}
+             * @default `undefined`
+             * @version 5.9.0
+             * @description
+             *
+             * A configuration object that allows you to override the default sources for the `style-src` directive
+             * with the `resources` property, or to provide additional `hashes` to be rendered.
+             *
+             * These properties are added to all pages and completely override Astro's default resources, not add to them.
+             * Therefore, you must explicitly specify any default values that you want to be included.
+             */
+            styleDirective?: {
+                /**
+                 * @name experimental.csp.styleDirective.hashes
+                 * @type {CspHash[]}
+                 * @default `[]`
+                 * @version 5.9.0
+                 * @description
+                 *
+                 * A list of additional hashes added to the `style-src` directive.
+                 *
+                 * If you have external styles that aren't generated by Astro, this configuration option allows you to provide additional hashes to be rendered.
+                 *
+                 * You must provide hashes that start with `sha384-`, `sha512-` or `sha256-`. Other values will cause a validation error. These hashes are added to all pages.
+                 *
+                 * ```js
+                 * import { defineConfig } from 'astro/config';
+                 *
+                 * export default defineConfig({
+                 *   experimental: {
+                 *     csp: {
+                 *       styleDirective: {
+                 *         hashes: [
+                 *           "sha384-styleHash",
+                 *           "sha512-styleHash",
+                 *           "sha256-styleHash"
+                 *         ]
+                 *       }
+                 *     }
+                 *   }
+                 * });
+                 * ```
+                 */
+                hashes?: CspHash[];
+                /**
+                 * @name experimental.csp.styleDirective.resources
+                 * @type {string[]}
+                 * @default `[]`
+                 * @version 5.9.0
+                 * @description
+                 *
+                 * A list of resources applied to the `style-src` directive. These resources are added to all pages and will override Astro's defaults.
+                 *
+                 * ```js
+                 * import { defineConfig } from 'astro/config';
+                 *
+                 * export default defineConfig({
+                 *   experimental: {
+                 *     csp: {
+                 *       styleDirective: {
+                 *         resources: [
+                 *           "self",
+                 *           "https://styles.cdn.example.com"
+                 *         ]
+                 *       }
+                 *     }
+                 *   }
+                 * });
+                 * ```
+                 */
+                resources?: string[];
+            };
+            /**
+             * @name experimental.csp.scriptDirective
+             * @type {{ hashes?: CspHash[], resources?: string[], strictDynamic?: boolean }}
+             * @default `undefined`
+             * @version 5.9.0
+             * @description
+             *
+             * A configuration object that allows you to override the default sources for the `script-src` directive
+             * with the `resources` property, or to provide additional `hashes` to be rendered.
+             *
+             * These properties are added to all pages and completely override Astro's default resources, not add to them.
+             * Therefore, you must explicitly specify any default values that you want to be included.
+             *
+             */
+            scriptDirective?: {
+                /**
+                 * @name experimental.csp.scriptDirective.hashes
+                 * @type {CspHash[]}
+                 * @default `[]`
+                 * @version 5.9.0
+                 * @description
+                 *
+                 * A list of additional hashes added to the `script-src` directive.
+                 *
+                 * If you have external scripts that aren't generated by Astro, or inline scripts, this configuration option allows you to provide additional hashes to be rendered.
+                 *
+                 * You must provide hashes that start with `sha384-`, `sha512-` or `sha256-`. Other values will cause a validation error. These hashes are added to all pages.
+                 *
+                 * ```js
+                 * import { defineConfig } from 'astro/config';
+                 *
+                 * export default defineConfig({
+                 *   experimental: {
+                 *     csp: {
+                 *       scriptDirective: {
+                 *         hashes: [
+                 *           "sha384-scriptHash",
+                 *           "sha512-scriptHash",
+                 *           "sha256-scriptHash"
+                 *         ]
+                 *       }
+                 *     }
+                 *   }
+                 * });
+                 * ```
+                 */
+                hashes?: CspHash[];
+                /**
+                 * @name experimental.csp.scriptDirective.resources
+                 * @type {string[]}
+                 * @default `[]`
+                 * @version 5.9.0
+                 * @description
+                 *
+                 * A list of resources applied to the `script-src` directive. These resources are added to all pages and will override Astro's defaults.
+                 *
+                 * ```js
+                 * import { defineConfig } from 'astro/config';
+                 *
+                 * export default defineConfig({
+                 *   experimental: {
+                 *     csp: {
+                 *       scriptDirective: {
+                 *         resources: [
+                 *           "self",
+                 *           "https://cdn.example.com"
+                 *         ]
+                 *       }
+                 *     }
+                 *   }
+                 * });
+                 * ```
+                 *
+                 */
+                resources?: string[];
+                /**
+                 * @name experimental.csp.scriptDirective.strictDynamic
+                 * @type {boolean}
+                 * @default `false`
+                 * @version 5.9.0
+                 * @description
+                 *
+                 * Enables the keyword `strict-dynamic` to support the dynamic injection of scripts.
+                 *
+                 * ```js
+                 * import { defineConfig } from 'astro/config';
+                 *
+                 * export default defineConfig({
+                 *   experimental: {
+                 *     csp: {
+                 *       scriptDirective: {
+                 *         strictDynamic: true
+                 *       }
+                 *     }
+                 *   }
+                 * });
+                 * ```
+                 */
+                strictDynamic?: boolean;
+            };
+            /**
+             * @name experimental.csp.directives
+             * @type {string[]}
+             * @default `[]`
+             * @version 5.9.0
+             * @description
+             *
+             * An array of additional directives to add the content of the `Content-Security-Policy` `<meta>` element.
+             *
+             * Use this configuration to add other directive definitions such as `default-src`, `image-src`, etc.
+             *
+             * ##### Example
+             *
+             * You can define a directive to fetch images only from a CDN `cdn.example.com`.
+             *
+             * ```js
+             * export default defineConfig({
+             * 	experimental: {
+             * 		csp: {
+             * 			directives: [
+             * 				"image-src 'https://cdn.example.com"
+             * 			]
+             * 		}
+             * 	}
+             * })
+             * ```
+             *
+             */
+            directives?: CspDirective[];
+        };
         /**
          * @name experimental.preserveScriptOrder
          * @type {boolean}

package/dist/types/public/context.d.ts

@@ -2,6 +2,7 @@ import type { z } from 'zod';
 import type { ActionAccept, ActionClient, ActionReturnType } from '../../actions/runtime/virtual/server.js';
 import type { SUPPORTED_MARKDOWN_FILE_EXTENSIONS } from '../../core/constants.js';
 import type { AstroCookies } from '../../core/cookies/cookies.js';
+import type { CspDirective, CspHash } from '../../core/csp/config.js';
 import type { AstroSession } from '../../core/session.js';
 import type { AstroComponentFactory } from '../../runtime/server/index.js';
 import type { Params, RewritePayload } from './common.js';
@@ -310,6 +311,56 @@ export interface AstroSharedContext<Props extends Record<string, any> = Record<s
      * Whether the current route is prerendered or not.
      */
     isPrerendered: boolean;
+    /**
+     * It adds a specific CSP directive to the route being rendered.
+     *
+     * ## Example
+     *
+     * ```js
+     * ctx.insertDirective("default-src 'self' 'unsafe-inline' https://example.com")
+     * ```
+     */
+    insertDirective: (directive: CspDirective) => void;
+    /**
+     * It set the resource for the directive `style-src` in the route being rendered. It overrides Astro's default.
+     *
+     * ## Example
+     *
+     * ```js
+     * ctx.insertStyleResource("https://styles.cdn.example.com/")
+     * ```
+     */
+    insertStyleResource: (payload: string) => void;
+    /**
+     * Insert a single style hash to the route being rendered.
+     *
+     * ## Example
+     *
+     * ```js
+     * ctx.insertStyleHash("sha256-1234567890abcdef1234567890")
+     * ```
+     */
+    insertStyleHash: (hash: CspHash) => void;
+    /**
+     * It set the resource for the directive `script-src` in the route being rendered.
+     *
+     * ## Example
+     *
+     * ```js
+     * ctx.insertScriptResource("https://scripts.cdn.example.com/")
+     * ```
+     */
+    insertScriptResource: (resource: string) => void;
+    /**
+     * Insert a single script hash to the route being rendered.
+     *
+     * ## Example
+     *
+     * ```js
+     * ctx.insertScriptHash("sha256-1234567890abcdef1234567890")
+     * ```
+     */
+    insertScriptHash: (hash: CspHash) => void;
 }
 /**
  * The `APIContext` is the object made available to endpoints and middleware.

package/dist/types/public/integrations.d.ts

@@ -53,6 +53,15 @@ export type AdapterSupportsKind = (typeof AdapterFeatureStability)[keyof typeof
 export type AdapterSupportWithMessage = {
     support: Exclude<AdapterSupportsKind, 'stable'>;
     message: string;
+    /**
+     * Determines if a feature support warning/error in the adapter should be suppressed:
+     * - `"default"`: Suppresses the default warning/error message.
+     * - `"all"`: Suppresses both the custom and the default warning/error message.
+     *
+     * This is useful when the warning/error might not be applicable in certain contexts,
+     * or the default message might cause confusion and conflict with a custom one.
+     */
+    suppress?: 'all' | 'default';
 };
 export type AdapterSupport = AdapterSupportsKind | AdapterSupportWithMessage;
 export interface AstroAdapterFeatures {