astro 2.9.4 → 2.9.5

package/components/ViewTransitions.astro

@@ -13,14 +13,20 @@ const { fallback = 'animate' } = Astro.props as Props;
 <script>
 	type Fallback = 'none' | 'animate' | 'swap';
 	type Direction = 'forward' | 'back';
+	type State = {
+		index: number;
+		scrollY: number;
+	};
 	type Events = 'astro:load' | 'astro:beforeload';
 
+	const persistState = (state: State) => history.replaceState(state, '');
+
 	// The History API does not tell you if navigation is forward or back, so
 	// you can figure it using an index. On pushState the index is incremented so you
 	// can use that to determine popstate if going forward or back.
 	let currentHistoryIndex = history.state?.index || 0;
 	if (!history.state) {
-		history.replaceState({ index: currentHistoryIndex }, document.title);
+		persistState({ index: currentHistoryIndex, scrollY: 0 });
 	}
 
 	const supportsViewTransitions = !!document.startViewTransition;
@@ -29,6 +35,19 @@ const { fallback = 'animate' } = Astro.props as Props;
 	const triggerEvent = (name: Events) => document.dispatchEvent(new Event(name));
 	const onload = () => triggerEvent('astro:load');
 
+	const throttle = (cb: (...args: any[]) => any, delay: number) => {
+		let wait = false;
+		return (...args: any[]) => {
+			if (wait) return;
+
+			cb(...args);
+			wait = true;
+			setTimeout(() => {
+				wait = false;
+			}, delay);
+		};
+	};
+
 	async function getHTML(href: string) {
 		const res = await fetch(href);
 		const html = await res.text();
@@ -64,11 +83,16 @@ const { fallback = 'animate' } = Astro.props as Props;
 
 	const parser = new DOMParser();
 
-	async function updateDOM(dir: Direction, html: string, fallback?: Fallback) {
+	async function updateDOM(dir: Direction, html: string, state?: State, fallback?: Fallback) {
 		const doc = parser.parseFromString(html, 'text/html');
 		doc.documentElement.dataset.astroTransition = dir;
 		const swap = () => {
 			document.documentElement.replaceWith(doc.documentElement);
+
+			if (state?.scrollY != null) {
+				scrollTo(0, state.scrollY);
+			}
+
 			triggerEvent('astro:beforeload');
 		};
 
@@ -103,7 +127,7 @@ const { fallback = 'animate' } = Astro.props as Props;
 		}
 	}
 
-	async function navigate(dir: Direction, href: string) {
+	async function navigate(dir: Direction, href: string, state?: State) {
 		let finished: Promise<void>;
 		const { html, ok } = await getHTML(href);
 		// If there is a problem fetching the new page, just do an MPA navigation to it.
@@ -112,9 +136,9 @@ const { fallback = 'animate' } = Astro.props as Props;
 			return;
 		}
 		if (supportsViewTransitions) {
-			finished = document.startViewTransition(() => updateDOM(dir, html)).finished;
+			finished = document.startViewTransition(() => updateDOM(dir, html, state)).finished;
 		} else {
-			finished = updateDOM(dir, html, getFallback());
+			finished = updateDOM(dir, html, state, getFallback());
 		}
 		try {
 			await finished;
@@ -165,25 +189,30 @@ const { fallback = 'animate' } = Astro.props as Props;
 				ev.preventDefault();
 				navigate('forward', link.href);
 				currentHistoryIndex++;
-				history.pushState({ index: currentHistoryIndex }, '', link.href);
+				const newState: State = { index: currentHistoryIndex, scrollY };
+				persistState({ index: currentHistoryIndex - 1, scrollY });
+				history.pushState(newState, '', link.href);
 			}
 		});
-		window.addEventListener('popstate', (ev) => {
+		addEventListener('popstate', (ev) => {
 			if (!transitionEnabledOnThisPage()) {
 				// The current page doesn't haven't View Transitions,
 				// respect that with a full page reload
 				location.reload();
 				return;
 			}
+
 			// hash change creates no state.
 			if (ev.state === null) {
-				history.replaceState({ index: currentHistoryIndex }, '');
+				persistState({ index: currentHistoryIndex, scrollY });
 				ev.preventDefault();
 				return;
 			}
-			const nextIndex = history.state?.index ?? currentHistoryIndex + 1;
+
+			const state: State | undefined = history.state;
+			const nextIndex = state?.index ?? currentHistoryIndex + 1;
 			const direction: Direction = nextIndex > currentHistoryIndex ? 'forward' : 'back';
-			navigate(direction, location.href);
+			navigate(direction, location.href, state);
 			currentHistoryIndex = nextIndex;
 		});
 
@@ -206,5 +235,16 @@ const { fallback = 'animate' } = Astro.props as Props;
 			);
 		});
 		addEventListener('load', onload);
+		// There's not a good way to record scroll position before a back button.
+		// So the way we do it is by listening to scroll and just continuously recording it.
+		addEventListener(
+			'scroll',
+			throttle(() => {
+				if (history.state) {
+					persistState({ ...history.state, scrollY });
+				}
+			}, 300),
+			{ passive: true }
+		);
 	}
 </script>

package/dist/@types/astro.d.ts

@@ -1826,7 +1826,6 @@ export interface SSRMetadata {
     headInTree: boolean;
     extraHead: string[];
     propagators: Map<AstroComponentFactory, AstroComponentInstance>;
-    contentKeys: Set<string>;
 }
 export interface PreviewServer {
     host?: string;

package/dist/content/runtime.js

@@ -5,8 +5,8 @@ import {
   createComponent,
   createHeadAndContent,
   renderComponent,
+  renderScriptElement,
   renderTemplate,
-  renderUniqueScriptElement,
   renderUniqueStylesheet,
   unescapeHTML
 } from "../runtime/server/index.js";
@@ -222,7 +222,7 @@ async function render({
           }).join("");
         }
         if (Array.isArray(collectedScripts)) {
-          scripts = collectedScripts.map((script) => renderUniqueScriptElement(result, script)).join("");
+          scripts = collectedScripts.map((script) => renderScriptElement(script)).join("");
         }
         let props = baseProps;
         if (id.endsWith("mdx")) {

package/dist/core/constants.js

@@ -1,4 +1,4 @@
-const ASTRO_VERSION = "2.9.4";
+const ASTRO_VERSION = "2.9.5";
 const SUPPORTED_MARKDOWN_FILE_EXTENSIONS = [
   ".markdown",
   ".mdown",

package/dist/core/dev/dev.js

@@ -54,7 +54,7 @@ async function dev(settings, options) {
       isRestart: options.isRestart
     })
   );
-  const currentVersion = "2.9.4";
+  const currentVersion = "2.9.5";
   if (currentVersion.includes("-")) {
     warn(options.logging, null, msg.prerelease({ currentVersion }));
   }

package/dist/core/messages.js

@@ -47,7 +47,7 @@ function serverStart({
   base,
   isRestart = false
 }) {
-  const version = "2.9.4";
+  const version = "2.9.5";
   const localPrefix = `${dim("\u2503")} Local    `;
   const networkPrefix = `${dim("\u2503")} Network  `;
   const emptyPrefix = " ".repeat(11);
@@ -233,7 +233,7 @@ function printHelp({
     message.push(
       linebreak(),
       `  ${bgGreen(black(` ${commandName} `))} ${green(
-        `v${"2.9.4"}`
+        `v${"2.9.5"}`
       )} ${headline}`
     );
   }

package/dist/core/render/result.js

@@ -178,8 +178,7 @@ function createResult(args) {
       hasDirectives: /* @__PURE__ */ new Set(),
       headInTree: false,
       extraHead: [],
-      propagators: /* @__PURE__ */ new Map(),
-      contentKeys: /* @__PURE__ */ new Set()
+      propagators: /* @__PURE__ */ new Map()
     }
   };
   return result;

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

@@ -3,7 +3,7 @@ export { createAstro } from './astro-global.js';
 export { renderEndpoint } from './endpoint.js';
 export { escapeHTML, HTMLBytes, HTMLString, isHTMLString, markHTMLString, unescapeHTML, } from './escape.js';
 export { renderJSX } from './jsx.js';
-export { addAttribute, createHeadAndContent, defineScriptVars, Fragment, maybeRenderHead, renderTemplate as render, renderComponent, Renderer as Renderer, renderHead, renderHTMLElement, renderPage, renderScriptElement, renderSlot, renderSlotToString, renderTemplate, renderToString, renderUniqueScriptElement, renderUniqueStylesheet, voidElementNames, } from './render/index.js';
+export { addAttribute, createHeadAndContent, defineScriptVars, Fragment, maybeRenderHead, renderTemplate as render, renderComponent, Renderer as Renderer, renderHead, renderHTMLElement, renderPage, renderScriptElement, renderSlot, renderSlotToString, renderTemplate, renderToString, renderUniqueStylesheet, voidElementNames, } from './render/index.js';
 export type { AstroComponentFactory, AstroComponentInstance, ComponentSlots, RenderInstruction, } from './render/index.js';
 export { renderTransition } from './transition.js';
 export declare function mergeSlots(...slotted: unknown[]): Record<string, () => any>;

package/dist/runtime/server/index.js

@@ -27,7 +27,6 @@ import {
   renderSlotToString,
   renderTemplate as renderTemplate2,
   renderToString,
-  renderUniqueScriptElement,
   renderUniqueStylesheet,
   voidElementNames
 } from "./render/index.js";
@@ -116,7 +115,6 @@ export {
   renderTemplate2 as renderTemplate,
   renderToString,
   renderTransition,
-  renderUniqueScriptElement,
   renderUniqueStylesheet,
   spreadAttributes,
   unescapeHTML,

package/dist/runtime/server/render/astro/instance.d.ts

@@ -15,6 +15,6 @@ export declare class AstroComponentInstance {
     init(result: SSRResult): Promise<AstroFactoryReturnValue>;
     render(destination: RenderDestination): Promise<void>;
 }
-export declare function createAstroComponentInstance(result: SSRResult, displayName: string, factory: AstroComponentFactory, props: ComponentProps, slots?: any): Promise<AstroComponentInstance>;
+export declare function createAstroComponentInstance(result: SSRResult, displayName: string, factory: AstroComponentFactory, props: ComponentProps, slots?: any): AstroComponentInstance;
 export declare function isAstroComponentInstance(obj: unknown): obj is AstroComponentInstance;
 export {};

package/dist/runtime/server/render/astro/instance.js

@@ -17,6 +17,8 @@ class AstroComponentInstance {
     }
   }
   async init(result) {
+    if (this.returnValue !== void 0)
+      return this.returnValue;
     this.returnValue = this.factory(result, this.props, this.slotValues);
     return this.returnValue;
   }
@@ -47,15 +49,11 @@ function validateComponentProps(props, displayName) {
     }
   }
 }
-async function createAstroComponentInstance(result, displayName, factory, props, slots = {}) {
+function createAstroComponentInstance(result, displayName, factory, props, slots = {}) {
   validateComponentProps(props, displayName);
   const instance = new AstroComponentInstance(result, props, slots, factory);
   if (isAPropagatingComponent(result, factory) && !result._metadata.propagators.has(factory)) {
     result._metadata.propagators.set(factory, instance);
-    const returnValue = await instance.init(result);
-    if (isHeadAndContent(returnValue)) {
-      result._metadata.extraHead.push(returnValue.head);
-    }
   }
   return instance;
 }

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

@@ -41,10 +41,10 @@ async function renderToReadableStream(result, componentFactory, props, children,
   );
   if (templateResult instanceof Response)
     return templateResult;
+  let renderedFirstPageChunk = false;
   if (isPage) {
     await bufferHeadContent(result);
   }
-  let renderedFirstPageChunk = false;
   return new ReadableStream({
     start(controller) {
       const destination = {

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

@@ -320,7 +320,7 @@ async function renderHTMLComponent(result, Component, _props, slots = {}) {
   };
 }
 async function renderAstroComponent(result, displayName, Component, props, slots = {}) {
-  const instance = await createAstroComponentInstance(result, displayName, Component, props, slots);
+  const instance = createAstroComponentInstance(result, displayName, Component, props, slots);
   const chunks = [];
   const temporaryDestination = {
     write: (chunk) => chunks.push(chunk)

package/dist/runtime/server/render/index.d.ts

@@ -6,6 +6,6 @@ export { renderHTMLElement } from './dom.js';
 export { maybeRenderHead, renderHead } from './head.js';
 export { renderPage } from './page.js';
 export { renderSlot, renderSlotToString, type ComponentSlots } from './slot.js';
-export { renderScriptElement, renderUniqueScriptElement, renderUniqueStylesheet } from './tags.js';
+export { renderScriptElement, renderUniqueStylesheet } from './tags.js';
 export type { RenderInstruction } from './types';
 export { addAttribute, defineScriptVars, voidElementNames } from './util.js';

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

@@ -5,7 +5,7 @@ import { renderHTMLElement } from "./dom.js";
 import { maybeRenderHead, renderHead } from "./head.js";
 import { renderPage } from "./page.js";
 import { renderSlot, renderSlotToString } from "./slot.js";
-import { renderScriptElement, renderUniqueScriptElement, renderUniqueStylesheet } from "./tags.js";
+import { renderScriptElement, renderUniqueStylesheet } from "./tags.js";
 import { addAttribute, defineScriptVars, voidElementNames } from "./util.js";
 export {
   Fragment,
@@ -26,7 +26,6 @@ export {
   renderSlotToString,
   renderTemplate,
   renderToString,
-  renderUniqueScriptElement,
   renderUniqueStylesheet,
   voidElementNames
 };

package/dist/runtime/server/render/tags.d.ts

@@ -1,5 +1,4 @@
 import type { SSRElement, SSRResult } from '../../../@types/astro';
 import type { StylesheetAsset } from '../../../core/app/types';
 export declare function renderScriptElement({ props, children }: SSRElement): string;
-export declare function renderUniqueScriptElement(result: SSRResult, { props, children }: SSRElement): string;
 export declare function renderUniqueStylesheet(result: SSRResult, sheet: StylesheetAsset): string | undefined;

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

@@ -5,52 +5,19 @@ function renderScriptElement({ props, children }) {
     children
   });
 }
-function renderUniqueScriptElement(result, { props, children }) {
-  if (Array.from(result.scripts).some((s) => {
-    if (s.props.type === props.type && s.props.src === props.src) {
-      return true;
-    }
-    if (!props.src && s.children === children)
-      return true;
-  }))
-    return "";
-  const key = `script-${props.type}-${props.src}-${children}`;
-  if (checkOrAddContentKey(result, key))
-    return "";
-  return renderScriptElement({ props, children });
-}
 function renderUniqueStylesheet(result, sheet) {
   if (sheet.type === "external") {
     if (Array.from(result.styles).some((s) => s.props.href === sheet.src))
       return "";
-    const key = "link-external-" + sheet.src;
-    if (checkOrAddContentKey(result, key))
-      return "";
-    return renderElement("link", {
-      props: {
-        rel: "stylesheet",
-        href: sheet.src
-      },
-      children: ""
-    });
+    return renderElement("link", { props: { rel: "stylesheet", href: sheet.src }, children: "" });
   }
   if (sheet.type === "inline") {
     if (Array.from(result.styles).some((s) => s.children.includes(sheet.content)))
       return "";
-    const key = `link-inline-` + sheet.content;
-    if (checkOrAddContentKey(result, key))
-      return "";
     return renderElement("style", { props: { type: "text/css" }, children: sheet.content });
   }
 }
-function checkOrAddContentKey(result, key) {
-  if (result._metadata.contentKeys.has(key))
-    return true;
-  result._metadata.contentKeys.add(key);
-  return false;
-}
 export {
   renderScriptElement,
-  renderUniqueScriptElement,
   renderUniqueStylesheet
 };

package/dist/vite-plugin-astro-server/route.d.ts

@@ -22,7 +22,7 @@ type HandleRoute = {
     incomingRequest: http.IncomingMessage;
     incomingResponse: http.ServerResponse;
     manifest: SSRManifest;
-    status?: number;
+    status?: 404 | 500;
 };
 export declare function handleRoute({ matchedRoute, url, pathname, status, body, origin, env, manifestData, incomingRequest, incomingResponse, manifest, }: HandleRoute): Promise<void>;
 export {};

package/dist/vite-plugin-astro-server/route.js

@@ -3,6 +3,7 @@ import { attachToResponse } from "../core/cookies/index.js";
 import { AstroErrorData, isAstroError } from "../core/errors/index.js";
 import { warn } from "../core/logger/core.js";
 import { loadMiddleware } from "../core/middleware/loadMiddleware.js";
+import { isEndpointResult } from "../core/render/core.js";
 import {
   createRenderContext,
   getParamsAndProps,
@@ -151,7 +152,7 @@ async function handleRoute({
   });
   const onRequest = (_a = options.middleware) == null ? void 0 : _a.onRequest;
   const result = await tryRenderRoute(route.type, renderContext, env, mod, onRequest);
-  if (route.type === "endpoint" && !(result instanceof Response)) {
+  if (isEndpointResult(result, route.type)) {
     if (result.type === "response") {
       if (result.response.headers.get("X-Astro-Response") === "Not-Found") {
         const fourOhFourRoute = await matchRoute("/404", env, manifestData);
@@ -186,7 +187,7 @@ async function handleRoute({
       attachToResponse(response, result.cookies);
       await writeWebResponse(incomingResponse, response);
     }
-  } else if (result instanceof Response) {
+  } else {
     if (result.status === 404) {
       const fourOhFourRoute = await matchRoute("/404", env, manifestData);
       return handleRoute({
@@ -204,7 +205,17 @@ async function handleRoute({
       });
     }
     let response = result;
-    if (status && response.status !== status) {
+    if (
+      // We are in a recursion, and it's possible that this function is called itself with a status code
+      // By default, the status code passed via parameters is computed by the matched route.
+      //
+      // By default, we should give priority to the status code passed, although it's possible that
+      // the `Response` emitted by the user is a redirect. If so, then return the returned response.
+      response.status < 400 && response.status >= 300
+    ) {
+      await writeSSRResult(request, response, incomingResponse);
+      return;
+    } else if (status && response.status !== status && (status === 404 || status === 500)) {
       response = new Response(result.body, { ...result, status });
     }
     await writeSSRResult(request, response, incomingResponse);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro",
-  "version": "2.9.4",
+  "version": "2.9.5",
   "description": "Astro is a modern site builder with web best practices, performance, and DX front-of-mind.",
   "type": "module",
   "author": "withastro",