snappy-prerender 2.6.0 → 2.7.0

package/src/core/sitemap.js

@@ -15,7 +15,7 @@ export function buildSitemap({ files, config, maxUrls = SITEMAP_MAX_URLS }) {
   if (!siteUrl) return null;
   const notFound = config.notFoundRoute ? normaliseRoute(config.notFoundRoute) : null;
 
-  const locs = new Set();
+  const entries = [];
   for (const file of files) {
     if (!file.file.endsWith('.html') || file.noindex) continue;
     if (file.route && notFound && normaliseRoute(file.route) === notFound) continue;
@@ -25,31 +25,40 @@ export function buildSitemap({ files, config, maxUrls = SITEMAP_MAX_URLS }) {
           trailingSlash: config.metadata?.trailingSlash,
         })
       : publicPath(file.file);
-    locs.add(`${siteUrl}${toPublicPath(path, config.base)}`);
+    entries.push({
+      loc: `${siteUrl}${toPublicPath(path, config.base)}`,
+      alternates: normaliseAlternates(file.alternates ?? [], siteUrl, config.base),
+      images: config.imageSitemap ? normaliseImages(file.images ?? [], siteUrl, config.base) : [],
+    });
   }
-  if (locs.size === 0) return null;
+  if (entries.length === 0) return null;
 
-  const sorted = [...locs].sort();
+  entries.sort((a, b) => a.loc.localeCompare(b.loc));
   const chunks = [];
-  for (let index = 0; index < sorted.length; index += maxUrls) {
-    chunks.push(sorted.slice(index, index + maxUrls));
+  for (let index = 0; index < entries.length; index += maxUrls) {
+    chunks.push(entries.slice(index, index + maxUrls));
   }
 
   if (chunks.length === 1) {
-    return { files: [{ name: 'sitemap.xml', contents: urlSet(chunks[0]) }], routes: sorted.length };
+    return {
+      files: [{ name: 'sitemap.xml', contents: urlSet(chunks[0]) }],
+      routes: entries.length,
+      locs: entries.map((entry) => entry.loc),
+    };
   }
 
-  const entries = chunks.map((chunk, index) => {
+  const chunksWithNames = chunks.map((chunk, index) => {
     const name = `sitemap-${index + 1}.xml`;
     const loc = `${siteUrl}${toPublicPath(`/${name}`, config.base)}`;
     return { name, contents: urlSet(chunk), loc };
   });
   return {
     files: [
-      { name: 'sitemap.xml', contents: sitemapIndex(entries) },
-      ...entries.map(({ name, contents }) => ({ name, contents })),
+      { name: 'sitemap.xml', contents: sitemapIndex(chunksWithNames) },
+      ...chunksWithNames.map(({ name, contents }) => ({ name, contents })),
     ],
-    routes: sorted.length,
+    routes: entries.length,
+    locs: entries.map((entry) => entry.loc),
   };
 }
 
@@ -75,9 +84,76 @@ export function withSitemapDirective(robots, sitemapUrl) {
 }
 
 // Builds one urlset document.
-function urlSet(locs) {
-  const urls = locs.map((loc) => `  <url>\n    <loc>${escapeXml(loc)}</loc>\n  </url>`).join('\n');
-  return `<?xml version="1.0" encoding="UTF-8"?>\n<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">\n${urls}\n</urlset>\n`;
+function urlSet(entries) {
+  const hasAlternates = entries.some((entry) => entry.alternates.length > 0);
+  const hasImages = entries.some((entry) => entry.images.length > 0);
+  const namespaces = [
+    'xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"',
+    hasAlternates ? 'xmlns:xhtml="http://www.w3.org/1999/xhtml"' : null,
+    hasImages ? 'xmlns:image="http://www.google.com/schemas/sitemap-image/1.1"' : null,
+  ]
+    .filter(Boolean)
+    .join(' ');
+  const urls = entries
+    .map((entry) => {
+      const lines = [`    <loc>${escapeXml(entry.loc)}</loc>`];
+      for (const alternate of entry.alternates) {
+        lines.push(
+          `    <xhtml:link rel="alternate" hreflang="${escapeXml(alternate.hreflang)}" href="${escapeXml(alternate.href)}"/>`,
+        );
+      }
+      for (const image of entry.images) {
+        lines.push(
+          `    <image:image>\n      <image:loc>${escapeXml(image)}</image:loc>\n    </image:image>`,
+        );
+      }
+      return `  <url>\n${lines.join('\n')}\n  </url>`;
+    })
+    .join('\n');
+  return `<?xml version="1.0" encoding="UTF-8"?>\n<urlset ${namespaces}>\n${urls}\n</urlset>\n`;
+}
+
+// Resolves hreflang links and removes duplicates.
+function normaliseAlternates(alternates, siteUrl, base) {
+  const seen = new Set();
+  const result = [];
+  for (const alternate of alternates) {
+    const href = absoluteSitemapUrl(alternate.href, siteUrl, base);
+    if (!href) continue;
+    const key = `${alternate.hreflang}|${href}`;
+    if (seen.has(key)) continue;
+    seen.add(key);
+    result.push({ hreflang: alternate.hreflang, href });
+  }
+  return result;
+}
+
+// Resolves image URLs to absolute same-origin URLs.
+function normaliseImages(images, siteUrl, base) {
+  const seen = new Set();
+  const result = [];
+  for (const image of images) {
+    const absolute = absoluteSitemapUrl(image, siteUrl, base);
+    if (!absolute || new URL(absolute).origin !== new URL(siteUrl).origin) continue;
+    if (seen.has(absolute)) continue;
+    seen.add(absolute);
+    result.push(absolute);
+  }
+  return result;
+}
+
+// Resolves a site-relative path against the public base, leaving absolute URLs alone.
+function absoluteSitemapUrl(value, siteUrl, base) {
+  if (!value) return null;
+  const raw = String(value);
+  if (/^https?:\/\//i.test(raw)) return raw;
+  if (raw.startsWith('//')) return `https:${raw}`;
+  const basePrefix = base === '/' ? '' : base.slice(0, -1);
+  if (basePrefix && (raw === basePrefix || raw.startsWith(`${basePrefix}/`))) {
+    return `${siteUrl}${raw}`;
+  }
+  const path = raw.startsWith('/') ? raw : `/${raw}`;
+  return `${siteUrl}${basePrefix}${path}`;
 }
 
 // Builds the sitemap index that points at the numbered sitemaps.

package/src/core/verify.js

@@ -1,24 +1,17 @@
+import fs from 'node:fs/promises';
+import path from 'node:path';
 import { blockThirdPartyRequests } from './blocking.js';
 import { DEFAULTS } from './config.js';
+import { frameworkFromMarkers, isHydrationError } from './frameworks.js';
+import { compareContainers } from './hydration-diff.js';
+import { routeToFile } from './output.js';
 import { isPageEmpty } from './page-content.js';
-import { toServerUrl } from './routes.js';
+import { resolveRouteConfig } from './route-config.js';
+import { normaliseRoute, toServerUrl } from './routes.js';
 import { mapLimit } from './scheduler.js';
 import { settlePage, trackNetwork } from './settle.js';
 
-const HYDRATION_PATTERNS = [
-  /hydrat/i,
-  /text content did not match/i,
-  /prop [`"].+?[`"] did not match/i,
-  /server-rendered HTML/i,
-  // React 16 and 17 phrase their mismatch warnings differently and never use the
-  // minified codes, which only exist from React 18 on.
-  /did not expect server HTML/i,
-  /expected server HTML to contain/i,
-  /react\.dev\/errors\/(418|419|421|422|423|424|425)/i,
-  /Minified React error #(418|419|421|422|423|424|425)\b/i,
-];
-
-// Containers used by the common React setups, so the probe can find the prerendered
+// Containers used by the common setups, so the probe can find the prerendered
 // subtree without configuration.
 const CONTAINER_SELECTOR = '#root, #app, #__next';
 
@@ -48,19 +41,9 @@ function bootProbe() {
   });
 }
 
-/**
- * Classifies a console or page error as a React hydration failure. Exported so the
- * pattern set is testable without a browser. Patterns stay narrow on purpose: a
- * false positive fails a user's build, so unrelated 4xx React codes and generic
- * "does not match" messages are deliberately not treated as hydration errors.
- */
-export function isHydrationError(message) {
-  return HYDRATION_PATTERNS.some((pattern) => pattern.test(message));
-}
-
 /**
  * Classifies how a prerendered page booted. `hydrated` means the app adopted the
- * markup, `re-rendered` means it discarded it, `undetected` means no React root was
+ * markup, `re-rendered` means it discarded it, `undetected` means no framework root was
  * found on the container, and `unknown` means the prerendered child was never seen.
  */
 export function classifyBoot({ markupPreserved, frameworkMounted }) {
@@ -74,16 +57,22 @@ export function classifyBoot({ markupPreserved, frameworkMounted }) {
  * hydration errors plus how each route booted. This is the pass that catches markup
  * that only breaks once the app re-attaches, and apps that never attach to it at all.
  */
-export async function verifyRoutes({ browser, origin, routes, config }) {
+export async function verifyRoutes({ browser, origin, routes, config, outputDir = null }) {
   const { results, errors } = await mapLimit(routes, config.concurrency, (route) =>
-    verifyRoute({ browser, origin, route, config }),
+    verifyRoute({ browser, origin, route, config: resolveRouteConfig(config, route), outputDir }),
   );
   const verified = results.filter(Boolean);
   const modes = { hydrated: 0, 're-rendered': 0, undetected: 0, unknown: 0 };
-  for (const entry of verified) modes[entry.mode] += 1;
+  const frameworks = {};
+  for (const entry of verified) {
+    modes[entry.mode] += 1;
+    const name = entry.framework ?? 'unknown';
+    frameworks[name] = (frameworks[name] ?? 0) + 1;
+  }
   return {
     routes: verified,
     modes,
+    frameworks,
     ok: verified.every((entry) => entry.ok) && errors.length === 0,
     errors: errors.map(({ item, error }) => ({ route: item, message: error.message })),
   };
@@ -93,7 +82,7 @@ export async function verifyRoutes({ browser, origin, routes, config }) {
  * Verifies one route against the same request rules as the render pass, so what is
  * verified matches what was rendered.
  */
-async function verifyRoute({ browser, origin, route, config }) {
+async function verifyRoute({ browser, origin, route, config, outputDir }) {
   const context = await browser.newContext({
     viewport: config.viewport,
     storageState: config.storageState ?? undefined,
@@ -104,18 +93,12 @@ async function verifyRoute({ browser, origin, route, config }) {
     serviceWorkers: 'block',
   });
   const page = await context.newPage();
-  const hydrationErrors = [];
-  const consoleErrors = [];
-  const pageErrors = [];
-  // Hydration messages arrive through either channel, so both are classified the same way.
-  const collect = (message, target) => {
-    if (isHydrationError(message)) hydrationErrors.push(message);
-    else target.push(message);
-  };
+  const consoleMessages = [];
+  const pageMessages = [];
   page.on('console', (message) => {
-    if (message.type() === 'error') collect(message.text(), consoleErrors);
+    if (message.type() === 'error') consoleMessages.push(message.text());
   });
-  page.on('pageerror', (error) => collect(error.message, pageErrors));
+  page.on('pageerror', (error) => pageMessages.push(error.message));
 
   const tracker = trackNetwork(page);
   try {
@@ -130,29 +113,90 @@ async function verifyRoute({ browser, origin, route, config }) {
     const status = response?.status() ?? null;
     await settlePage(page, config, tracker);
     const empty = await isPageEmpty(page);
+    const statusCode = await page.evaluate(() => {
+      const marker = document.querySelector('meta[name="prerender-status-code"]');
+      if (!marker) return null;
+      const value = Number.parseInt(marker.getAttribute('content') ?? '', 10);
+      return Number.isFinite(value) ? value : null;
+    });
+    const notFoundRoute = config.notFoundRoute ? normaliseRoute(config.notFoundRoute) : null;
+    const isNotFoundRoute = notFoundRoute !== null && normaliseRoute(route) === notFoundRoute;
+    const notFound = statusCode === 404 || isNotFoundRoute;
 
     const boot = await page.evaluate((selector) => {
       const probe = window.__snappyBoot ?? {};
       const container =
         document.querySelector(selector) ?? document.body?.firstElementChild ?? null;
-      const frameworkMounted = container
-        ? Object.keys(container).some(
-            (key) => key.startsWith('__reactContainer') || key === '_reactRootContainer',
-          )
-        : false;
+      const markers = container
+        ? {
+            react: Object.keys(container).some(
+              (key) => key.startsWith('__reactContainer') || key === '_reactRootContainer',
+            ),
+            vue: Boolean(
+              container.__vue_app__ ||
+                container.__vueParentComponent ||
+                container._vnode ||
+                container.__vue__,
+            ),
+            preact: Boolean(
+              container.__k ||
+                container._children ||
+                container.firstElementChild?.__k ||
+                container.firstElementChild?._children,
+            ),
+            svelte: Boolean(
+              container.__svelte_meta || container.querySelector?.('[data-svelte-h]'),
+            ),
+          }
+        : {};
       const child = probe.prerenderedChild ?? null;
-      return { frameworkMounted, markupPreserved: child ? child.isConnected : null };
+      return { markers, markupPreserved: child ? child.isConnected : null };
     }, CONTAINER_SELECTOR);
+    const detected = frameworkFromMarkers(boot.markers, config.framework);
+    // Classify only after the framework is known, so an explicit `framework` choice and
+    // the detected framework select the matching message patterns.
+    const hydrationErrors = [];
+    const consoleErrors = [];
+    const pageErrors = [];
+    for (const message of consoleMessages) {
+      if (isHydrationError(message, detected.name ?? 'auto')) hydrationErrors.push(message);
+      else consoleErrors.push(message);
+    }
+    for (const message of pageMessages) {
+      if (isHydrationError(message, detected.name ?? 'auto')) hydrationErrors.push(message);
+      else pageErrors.push(message);
+    }
+    const mode = classifyBoot({
+      markupPreserved: boot.markupPreserved,
+      frameworkMounted: detected.mounted,
+    });
+    let firstMismatch = null;
+    if (outputDir && (hydrationErrors.length > 0 || mode === 're-rendered')) {
+      const liveHtml = await page.evaluate((selector) => {
+        const container = document.querySelector(selector) ?? document.body;
+        return container?.outerHTML ?? null;
+      }, CONTAINER_SELECTOR);
+      const file = path.join(outputDir, routeToFile(route, config));
+      const expectedHtml = await fs.readFile(file, 'utf8').catch(() => null);
+      if (liveHtml && expectedHtml) firstMismatch = compareContainers(expectedHtml, liveHtml);
+    }
 
     return {
       route,
       status,
+      statusCode,
+      notFound,
+      framework: detected.name,
       empty,
       hydrationErrors,
       consoleErrors,
       pageErrors,
-      ok: hydrationErrors.length === 0 && (status === null || status < 400) && !empty,
-      mode: classifyBoot(boot),
+      ok:
+        hydrationErrors.length === 0 &&
+        (status === null || status < 400 || (isNotFoundRoute && status === 404)) &&
+        !empty,
+      mode,
+      firstMismatch,
       markupPreserved: boot.markupPreserved,
     };
   } finally {

package/src/core/write.js

@@ -1,16 +1,21 @@
 import { createHash } from 'node:crypto';
 import { findBuildOriginUrls } from './build-origin.js';
+import { applyCspHashes } from './csp.js';
 import { inlineCriticalCss } from './inline-css.js';
 import { minifyHtml } from './minify.js';
 import { normaliseHtml } from './normalize.js';
 import {
   findOutputCollisions,
+  routeToFile,
   routeToScreenshotFile,
   writeBufferIfChanged,
   writeFileIfChanged,
   writeRouteHtml,
 } from './output.js';
+import { collectPageMeta } from './page-meta.js';
+import { collectScriptSources, injectPreloadLinks } from './preload-links.js';
 import { collectPageResources } from './preload-manifest.js';
+import { resolveRouteConfig } from './route-config.js';
 import { normaliseRoute, toPublicPath } from './routes.js';
 
 /**
@@ -36,16 +41,43 @@ export async function writeAllRoutes({
   for (const route of sorted) {
     if (conflicted.has(route)) continue;
     try {
+      const routeConfig = resolveRouteConfig(config, route);
+      const result = rendered.get(route);
       const { file, resources } = await writeRouteOutput({
         route,
-        result: rendered.get(route),
+        result,
         outputDir,
-        config,
+        config: routeConfig,
         log,
         state,
         report,
       });
       report.files.push(file);
+      report.routeDetails.push({
+        route,
+        order: result.order ?? null,
+        file: file.file,
+        status: file.status,
+        bytes: file.bytes,
+        depth: result.depth ?? null,
+        attempts: result.attempts ?? 1,
+        httpStatus: result.httpStatus ?? null,
+        finalUrl: result.finalUrl ?? null,
+        empty: result.empty === true,
+        notFound: file.notFound === true,
+        noindex: file.noindex === true,
+        meta: file.meta ?? null,
+        images: file.images ?? [],
+        alternates: file.alternates ?? [],
+        mode: null,
+        framework: null,
+        hydrationErrors: [],
+        pageErrors: result.pageErrors ?? [],
+        consoleErrors: result.consoleErrors ?? [],
+        failedRequests: result.failedRequests ?? [],
+        firstMismatch: null,
+        buildOriginUrls: file.buildOriginUrls ?? [],
+      });
       if (resources) manifestEntries.push({ route, ...resources });
       if (file.hash) {
         const group = hashes.get(file.hash) ?? [];
@@ -205,6 +237,53 @@ async function writeRouteOutput({ route, result, outputDir, config, log, state,
   if (config.minifyHtml) {
     output = await minifyHtml(output, config.minifyHtml, config.minifyCss);
   }
+  const preTransformScripts = config.transformHtml ? collectScriptSources(output) : new Set();
+  if (config.transformHtml) {
+    const transformed = await config.transformHtml(output, {
+      route,
+      file: routeToFile(route, config),
+      stats,
+      config,
+    });
+    if (transformed !== null && transformed !== undefined && typeof transformed !== 'string') {
+      throw new TypeError('transformHtml must return a string, null or undefined');
+    }
+    output = transformed ?? output;
+  }
+  if (config.preloadLinks) {
+    const basePrefix = config.base === '/' ? '' : config.base.slice(0, -1);
+    const skipScripts = new Set(
+      [...preTransformScripts].map((src) => {
+        if (!src.startsWith('/')) return src;
+        const appRelative =
+          basePrefix && (src === basePrefix || src.startsWith(`${basePrefix}/`))
+            ? src.slice(basePrefix.length)
+            : src;
+        return toPublicPath(appRelative, config.base);
+      }),
+    );
+    output = injectPreloadLinks(output, {
+      scripts: config.removeScriptTags ? [] : [...result.collector.scripts],
+      fonts: result.collector.fonts,
+      lcpImage: result.lcpImage,
+      base: config.base,
+      ignoreForPreload: config.ignoreForPreload,
+      skipScripts,
+    });
+  }
+  if (config.csp === 'hash') {
+    const policy = applyCspHashes(output);
+    if (policy.existingPolicy) {
+      log.warn(`  ${route}: kept the existing CSP meta and injected no hashes`);
+      report.cspSkipped.push(route);
+    } else {
+      output = policy.html;
+      log.debug(
+        `  csp ${route}: hashed ${policy.hashedScripts} script(s) and ${policy.hashedStyles} style(s)`,
+      );
+    }
+  }
+  const meta = collectPageMeta(output);
   warnOnBuildOriginMetadata({
     origins: stats.metadataOrigins,
     removed: stats.removedMetadata,
@@ -212,11 +291,11 @@ async function writeRouteOutput({ route, result, outputDir, config, log, state,
     log,
     state,
   });
-  if (stats.titleElements > 1) report.duplicateTitles.push(route);
+  if (meta.titleCount > 1) report.duplicateTitles.push(route);
+  const buildOrigins = findBuildOriginUrls(output);
   if (config.failOnBuildOriginMetadata) {
-    const origins = findBuildOriginUrls(output);
-    if (origins.length > 0) {
-      const message = `metadata still points at the build server: ${origins.join(', ')}`;
+    if (buildOrigins.length > 0) {
+      const message = `metadata still points at the build server: ${buildOrigins.join(', ')}`;
       report.errors.push({ route, message });
       log.error(`  ${route}: ${message}`);
     }
@@ -233,7 +312,13 @@ async function writeRouteOutput({ route, result, outputDir, config, log, state,
       hash: createHash('sha256')
         .update(result.html ?? output)
         .digest('hex'),
-      noindex: stats.noindex,
+      noindex: meta.noindex,
+      notFound: result.notFound === true,
+      meta,
+      images: meta.images,
+      alternates: meta.alternates,
+      inlineStyleAttributes: meta.inlineStyleAttributes,
+      buildOriginUrls: buildOrigins,
     },
     resources,
   };

package/src/head/index.js

@@ -26,7 +26,7 @@ export function Head(props) {
     sequenceRef.current = sequence;
   }
 
-  const entries = buildHeadEntries(props, readMetadataDefaults());
+  const entries = buildHeadEntries(props, readMetadataDefaults(), idRef.current);
 
   // A layout effect so a route change updates the head before the browser paints, and a
   // plain effect on the server, where layout effects never run.
@@ -45,7 +45,7 @@ export function Head(props) {
  */
 export function setHead(id, props) {
   sequence += 1;
-  registerHead(id, sequence, buildHeadEntries(props, readMetadataDefaults()));
+  registerHead(id, sequence, buildHeadEntries(props, readMetadataDefaults(), id));
 }
 
 /**

package/src/head/manager.js

@@ -5,6 +5,7 @@ const CREATED_ATTRIBUTE = 'data-snappy-head-created';
 const stack = [];
 const snapshots = new WeakMap();
 const createdElements = new WeakSet();
+const htmlOriginals = new Map();
 const originals = readRecordedOriginals();
 publishOriginals();
 
@@ -56,7 +57,9 @@ function applyMerged() {
   if (typeof document === 'undefined' || !document.head) return;
   const head = document.head;
   const merged = mergeHeadEntries(stack);
-  const desired = new Map(merged.map((entry) => [headKey(entry), entry]));
+  const headEntries = merged.filter((entry) => entry.kind !== 'html');
+  const htmlEntries = merged.filter((entry) => entry.kind === 'html');
+  const desired = new Map(headEntries.map((entry) => [headKey(entry), entry]));
 
   for (const [key, entry] of desired) {
     const matches = findTags(head, key);
@@ -74,7 +77,27 @@ function applyMerged() {
     if (!desired.has(key)) releaseTag(element, key);
   }
 
-  orderTags(head, merged);
+  applyHtmlAttributes(htmlEntries);
+  orderTags(head, headEntries);
+}
+
+// Applies lang/dir to the document element and restores the original value when no Head
+// wants the attribute any more.
+function applyHtmlAttributes(entries) {
+  if (typeof document === 'undefined' || !document.documentElement) return;
+  const root = document.documentElement;
+  const desired = new Map(entries.map((entry) => [entry.key, entry.value]));
+  for (const [key, value] of desired) {
+    if (!htmlOriginals.has(key)) htmlOriginals.set(key, root.getAttribute(key));
+    root.setAttribute(key, value);
+  }
+  for (const key of [...htmlOriginals.keys()]) {
+    if (desired.has(key)) continue;
+    const previous = htmlOriginals.get(key);
+    if (previous === null) root.removeAttribute(key);
+    else root.setAttribute(key, previous);
+    htmlOriginals.delete(key);
+  }
 }
 
 /**
@@ -87,6 +110,9 @@ function findTags(head, key) {
     const title = head.querySelector('title');
     return title ? [title] : [];
   }
+  const owned = head.querySelector(`[${OWNER_ATTRIBUTE}="${cssEscape(key)}"]`);
+  if (owned) return [owned];
+  if (key.startsWith('link:')) return findLinkTags(head, key.slice(5));
   const [kind, attribute, ...rest] = key.split(':');
   const value = rest.join(':');
   if (
@@ -95,18 +121,32 @@ function findTags(head, key) {
   ) {
     return [...head.querySelectorAll(`meta[${attribute}="${cssEscape(value)}"]`)];
   }
-  if (kind === 'link' && attribute === 'rel') return findRelLinks(head, value);
-  const owned = head.querySelector(`[${OWNER_ATTRIBUTE}="${cssEscape(key)}"]`);
-  return owned ? [owned] : [];
+  return [];
 }
 
-// Matches links by rel, and by href when the key carries one, so two links that share a rel
-// but point elsewhere stay distinct.
-function findRelLinks(head, value) {
-  const [rel, href] = value.split('|');
-  const links = [...head.querySelectorAll(`link[rel="${cssEscape(rel)}"]`)];
-  if (href === undefined) return links;
-  return links.filter((link) => link.getAttribute('href') === href);
+// Matches links that a previous run or the app itself wrote. Head-owned links carry the
+// owner attribute and are found above; this handles adoption on the first run.
+function findLinkTags(head, spec) {
+  const links = [...head.querySelectorAll('link')];
+  if (spec.startsWith('rel:')) {
+    const [rel, hreflang, href] = spec.slice(4).split('|');
+    return links.filter(
+      (link) =>
+        link.getAttribute('rel') === rel &&
+        (hreflang === undefined || link.getAttribute('hreflang') === hreflang) &&
+        (href === undefined || link.getAttribute('href') === href),
+    );
+  }
+  if (!spec.includes('=')) return [];
+  const attrs = Object.fromEntries(
+    spec.split('|').map((pair) => {
+      const index = pair.indexOf('=');
+      return [pair.slice(0, index), pair.slice(index + 1)];
+    }),
+  );
+  return links.filter((link) =>
+    Object.entries(attrs).every(([name, value]) => link.getAttribute(name) === value),
+  );
 }
 
 function createTag(head, entry) {
@@ -140,6 +180,7 @@ function writeTag(element, entry, key) {
     if (!Object.hasOwn(entry.attrs, attribute.name)) element.removeAttribute(attribute.name);
   }
   for (const [name, value] of Object.entries(entry.attrs)) element.setAttribute(name, value);
+  if (entry.kind === 'script') element.textContent = entry.text;
 }
 
 // Remembers what a tag looked like before the head layer first touched it, so an app-owned
@@ -155,7 +196,7 @@ function snapshotTag(element, key) {
   }
   const snapshot = {
     attrs: Object.fromEntries(attrs),
-    text: element.tagName === 'TITLE' ? element.textContent : null,
+    text: element.tagName === 'TITLE' || element.tagName === 'SCRIPT' ? element.textContent : null,
   };
   snapshots.set(element, snapshot);
   if (createdElements.has(element) || element.hasAttribute(CREATED_ATTRIBUTE)) return;