@rsc-kit/core 0.13.1 → 0.15.0

package/dist/vite.js

@@ -18,7 +18,7 @@ import { createHash } from 'node:crypto';
 import { createRequire } from 'node:module';
 import { dirname, join, relative, resolve } from 'node:path';
 import { fileURLToPath, pathToFileURL } from 'node:url';
-import rsc from '@vitejs/plugin-rsc';
+import rsc, { getPluginApi } from '@vitejs/plugin-rsc';
 import { loadEnv } from 'vite';
 import { REPORT_FILE, buildReport } from './buildReport.js';
 import { MANIFEST_PATH, manifestWarning, webManifest } from './webManifest.js';
@@ -1009,7 +1009,37 @@ function resolveRscBundle(dir) {
     }
     return null;
 }
-async function prerenderAfterBundles(bundle, staticDir, assetsDir) {
+/**
+ * Every server action the bundle registered, from the plugin's own table.
+ *
+ * Only the app's: the engine registers a few of its own and they are not the
+ * project's to be warned about.
+ */
+function knownActionsOf(config, root) {
+    const api = getPluginApi(config);
+    const metaMap = api?.manager?.serverReferences?.metaMap;
+    if (!metaMap)
+        return [];
+    const out = [];
+    for (const meta of metaMap.values()) {
+        if (meta.importId.includes('/node_modules/'))
+            continue;
+        const file = relative(root, meta.importId.split('?')[0] ?? meta.importId);
+        for (const name of meta.exportNames) {
+            out.push({ id: `${meta.referenceKey}#${name}`, name, file });
+        }
+    }
+    return out;
+}
+async function auditActions(engine, known) {
+    const audit = engine
+        .auditActions;
+    if (!audit || known.length === 0)
+        return [];
+    const byId = new Map(known.map((k) => [k.id, k]));
+    return (await audit(known.map((k) => k.id))).map((a) => ({ ...byId.get(a.id), client: a.client, query: a.query }));
+}
+async function prerenderAfterBundles(bundle, staticDir, assetsDir, knownActions = []) {
     // A missing bundle used to be a silent `return`, and under Nitro it was the
     // normal case: the path was assumed to be <outDir>/dist/rsc/index.js, Nitro
     // builds the rsc environment somewhere else entirely, and so every Nitro app
@@ -1022,7 +1052,7 @@ async function prerenderAfterBundles(bundle, staticDir, assetsDir) {
             'Prerendering renders the app, so it needs the bundle the build just wrote. ' +
             'Build with prerender: false to render every page on demand instead.');
     }
-    const [{ prerender, summary, legend, notes, clientJsSize, pathKey: pathKeyOf }, { writeTo }, { prerenderApiRoutes },] = await Promise.all([
+    const [{ prerender, NotPrerenderable, summary, legend, notes, clientJsSize, pathKey: pathKeyOf }, { writeTo }, { prerenderApiRoutes },] = await Promise.all([
         import('./prerender.js'),
         import('./files.js'),
         import('./apiPrerender.js'),
@@ -1032,36 +1062,56 @@ async function prerenderAfterBundles(bundle, staticDir, assetsDir) {
     // Nothing warns — the page loads, with content from the previous build.
     rmSync(staticDir, { recursive: true, force: true });
     const engine = (await import(pathToFileURL(bundle).href));
-    const mark = { frozen: '○', shell: '◐', blocked: 'ƒ', error: '✗' };
+    const mark = { frozen: '○', shell: '◐', blocked: '✗', error: '✗' };
     let failed = 0;
     // Weighed from the page the prerenderer just wrote, so the column is what
     // that page actually loads rather than a total every route is charged for.
     const weigh = weighClientJs(assetsDir);
     const sized = new Map();
     const pending = [];
-    const results = await prerender({
-        engine,
-        write: writeTo(staticDir),
-        onResult: (r) => {
-            if (r.type === 'error')
-                failed++;
-            const key = pathKeyOf(r.url);
-            const file = [`${key}.html`, `${key}.ppr.html`]
-                .map((name) => join(staticDir, name))
-                .find((path) => existsSync(path));
-            const bytes = file ? weigh(readFileSync(file, 'utf-8')) : null;
-            if (bytes !== null)
-                sized.set(r.url, bytes);
-            pending.push({
-                line: `  ${mark[r.type] ?? ' '}  ${r.url}`,
-                bytes,
-                extra: [
-                    ...(r.reason ? [`     ${r.reason}`] : []),
-                    ...(r.warning ? [`     ⚠  ${r.warning}`] : []),
-                ],
-            });
-        },
-    });
+    // Every result as it lands, so a refusal still has the whole table.
+    //
+    // prerender() throws NotPrerenderable when a page blocked above every
+    // boundary, and it used to throw past everything below: no table printed,
+    // no report written. The terminal got the advice; the report on disk was
+    // the previous build's, and an agent reading it through the MCP server was
+    // told the routes were fine, as of some minutes ago. A build that refuses
+    // is the build an agent most needs written down.
+    const collected = [];
+    let refusal = null;
+    let results;
+    try {
+        results = await prerender({
+            engine,
+            write: writeTo(staticDir),
+            onResult: (r) => {
+                collected.push(r);
+                if (r.type === 'error' || r.type === 'blocked')
+                    failed++;
+                const key = pathKeyOf(r.url);
+                const file = [`${key}.html`, `${key}.ppr.html`]
+                    .map((name) => join(staticDir, name))
+                    .find((path) => existsSync(path));
+                const bytes = file ? weigh(readFileSync(file, 'utf-8')) : null;
+                if (bytes !== null)
+                    sized.set(r.url, bytes);
+                pending.push({
+                    line: `  ${mark[r.type] ?? ' '}  ${r.url}`,
+                    bytes,
+                    extra: [
+                        ...(r.reason ? [`     ${r.reason}`] : []),
+                        ...(r.warning ? [`     ⚠  ${r.warning}`] : []),
+                    ],
+                });
+            },
+        });
+    }
+    catch (error) {
+        if (!(error instanceof NotPrerenderable))
+            throw error;
+        refusal = error;
+        results = collected;
+    }
     // After the pages, sharing their output. An api route is a url the build
     // either answered or could not, which is the same question the table above
     // is already answering — a second list under its own heading would be two
@@ -1085,6 +1135,21 @@ async function prerenderAfterBundles(bundle, staticDir, assetsDir) {
             console.log(line);
     }
     const count = (type) => results.filter((r) => r.type === type).length;
+    // The actions, after the routes. Which ones a client built is a mark on the
+    // loaded function, so the bundle is asked; the answer is the one fact about
+    // an action nothing else in the app states — whether anything checks who
+    // calls it.
+    const audited = await auditActions(engine, knownActions);
+    const bare = audited.filter((a) => !a.client);
+    if (bare.length > 0) {
+        const byFile = new Map();
+        for (const a of bare)
+            byFile.set(a.file, [...(byFile.get(a.file) ?? []), a.name]);
+        console.log(`\n  \u26a0  ${bare.length} ${bare.length === 1 ? 'action runs' : 'actions run'} no middleware: ` +
+            [...byFile].map(([file, names]) => `${names.join(', ')} (${file})`).join('; '));
+        console.log('     Nothing checks who calls them. Fine for a public one; otherwise build it\n' +
+            '     from an action client, so the check cannot be forgotten.');
+    }
     // Written from the rows that were just printed rather than recomputed: the
     // report and the terminal must not be able to disagree about what happened.
     writeFileSync(join(outDir, REPORT_FILE), buildReport(results.map((r) => ({
@@ -1094,13 +1159,16 @@ async function prerenderAfterBundles(bundle, staticDir, assetsDir) {
         reason: r.reason,
         warning: r.warning ?? null,
         clientJs: sized.get(r.url) ?? null,
-    })), apis.map((a) => ({ url: a.url, name: a.name, type: a.type, reason: a.reason }))));
+    })), apis.map((a) => ({ url: a.url, name: a.name, type: a.type, reason: a.reason })), audited));
     const note = notes(results);
     const counted = [...results, ...apis];
     console.log(`
 ${legend(counted)}
 
   ${summary(counted)}${note ? `\n\n${note}` : ''}`);
+    // The table and the report are on disk. Now the refusal, in its own words.
+    if (refusal)
+        throw new Error(refusal.message);
     if (failed > 0) {
         throw new Error(`[rsc-kit] ${failed} route${failed === 1 ? '' : 's'} failed to render.\n` +
             'Prerendering runs your app: whatever those pages need at render time has to be\n' +
@@ -1241,6 +1309,19 @@ function patternOf(segments) {
 function renderRouteTypes(manifest) {
     const patterns = [...new Set(manifest.routes.map((route) => patternOf(route.segments)))].sort();
     const apis = [...new Set((manifest.apis ?? []).map((route) => patternOf(route.segments)))].sort();
+    // Each pattern to the page module that answers it, as a type-only import
+    // from the generated file's own directory. SearchExportOf reads the page's
+    // `searchParams` export, or undefined when there is none, so nothing here
+    // has to look inside the file - the typechecker already has every page
+    // open. One line per route, and a page without a schema costs nothing.
+    const search = new Map();
+    for (const route of manifest.routes) {
+        const pattern = patternOf(route.segments);
+        if (search.has(pattern))
+            continue;
+        const target = relative(typesDir, join(sourceDir, route.component)).replace(/\\/g, '/');
+        search.set(pattern, target.startsWith('.') ? target : './' + target);
+    }
     return [
         '// @generated — do not edit. Written by the RSC build from the route tree.',
         '//',
@@ -1258,6 +1339,11 @@ function renderRouteTypes(manifest) {
         patterns.length > 0
             ? '    routes:\n' + patterns.map((p) => '      | ' + JSON.stringify(p)).join('\n')
             : '    // No routes found under the source directory.\n    routes: never',
+        // The searchParams schema each page exports, read off the module's type.
+        // This is what types Link's `search` prop and href() per route.
+        '    search: {',
+        ...[...search].sort().map(([pattern, target]) => '      ' + JSON.stringify(pattern) + ': SearchExportOf<typeof import(' + JSON.stringify(target) + ')>'),
+        '    }',
         '  }',
         // Api routes are a separate union, so Link refuses an api url and apiUrl()
         // refuses a page. Linking to an api route navigates the browser away to a
@@ -1679,6 +1765,7 @@ import { httpHostCalls } from ${JSON.stringify(join(packageDir, 'hostCalls'))}
 import { prerenderedBeside } from ${JSON.stringify(join(packageDir, 'files'))}
 import { renderToReadableStream, decodeReply, loadServerAction } from '@vitejs/plugin-rsc/rsc'
 import { isQuery, queryCacheControl, isQueryValidationError } from ${JSON.stringify(join(packageDir, 'query'))}
+import { isActionValidationError, isClientBuilt } from ${JSON.stringify(join(packageDir, 'action'))}
 import { Suspense, createElement, Fragment } from 'react'
 import { AsyncLocalStorage } from 'node:async_hooks'
 ${imports.join('\n')}
@@ -1872,6 +1959,31 @@ export function manifest(): any {
   return ${JSON.stringify(routeManifest())}
 }
 
+/**
+ * For each server action id, whether a client built it. The build asks after
+ * the bundle exists, because the answer is a mark on the loaded function and
+ * nothing static could tell a wrapped export from a bare one.
+ */
+export async function auditActions(ids: string[]): Promise<{ id: string; client: boolean; query: boolean }[]> {
+  const out: { id: string; client: boolean; query: boolean }[] = []
+
+  for (const id of ids) {
+    let fn: unknown = null
+
+    try {
+      fn = await loadServerAction(id)
+    } catch {
+      continue
+    }
+
+    if (typeof fn !== 'function') continue
+
+    out.push({ id, client: isClientBuilt(fn), query: isQuery(fn) })
+  }
+
+  return out
+}
+
 /**
  * The param sets a route declares, or null when it declares none.
  *
@@ -2245,8 +2357,27 @@ async function renderTree(
   // Icons and share images the build found in app/. Rendered here so React
   // hoists them into <head>, the same way the manifest link is — an app never
   // edits its layout to get a favicon.
-  for (const [i, tag] of APP_HEAD.entries()) {
-    head.push(createElement(tag.tag, { key: '__a' + i, ...tag.props }))
+  // Where the site lives, for making a relative image or url absolute. Read
+  // here, above the found images, because those are the ones most likely to
+  // be relative: an opengraph-image.png in app/ is emitted as /_app/..., and a
+  // share-card scraper needs the origin in front of it.
+  const base = md?.metadataBase ? String(md.metadataBase) : null
+  const absolute = (value: unknown): string => {
+    const text = String(value instanceof URL ? value.href : value)
+
+    if (!base || /^[a-z][a-z0-9+.-]*:/i.test(text)) return text
+
+    return new URL(text, base).href
+  }
+
+  for (const [i, found] of APP_HEAD.entries()) {
+    const props = { ...found.props }
+
+    if (props.content && /^(og:image|twitter:image)$/.test(props.property ?? props.name ?? '')) {
+      props.content = absolute(props.content)
+    }
+
+    head.push(createElement(found.tag, { key: '__a' + i, ...props }))
   }
 
   if (WEB_MANIFEST) {
@@ -2271,16 +2402,123 @@ async function renderTree(
       if (bootstrap) head.push(createElement(DocumentTitle, { key: '__ts', title: String(md.title) }))
     }
     if (md.description != null) head.push(createElement('meta', { key: '__d', name: 'description', content: String(md.description) }))
+
+    // og: and its relatives are PROPERTY, not name. Facebook's scraper - and
+    // Slack's, and LinkedIn's - reads only property=, so every og tag this
+    // used to emit with name= was invisible to the thing it existed for.
+    // Twitter reads name=, which is why the two are not one rule.
+    const isProperty = (k: string) => /^(og|article|profile|book|music|video|fb):/.test(k)
+    // The keys whose CONTENT is a url. Exact, plus the :url and :secure_url
+    // spellings - not og:image:width, which a looser match turned into
+    // https://site/1200 and no scraper would ever read.
+    const isUrlKey = (k: string) => /^(og:image|og:url|twitter:image)(:(secure_)?url)?$/.test(k)
+    const tag = (k: string, v: unknown) =>
+      createElement('meta', {
+        key: '__m_' + k + '_' + String(v).slice(0, 40),
+        [isProperty(k) ? 'property' : 'name']: k,
+        content: isUrlKey(k) ? absolute(v) : String(v),
+      })
+
+    // One image, or several. Each becomes its own og:image plus the size and
+    // alt tags beside it, which is how a scraper is told which is which.
+    const images = (prefix: string, value: unknown): void => {
+      const list = Array.isArray(value) ? value : [value]
+
+      for (const item of list) {
+        if (item == null) continue
+
+        if (typeof item === 'object' && !(item instanceof URL)) {
+          const image = item as { url: unknown; width?: number; height?: number; alt?: string; type?: string }
+
+          head.push(tag(prefix, image.url))
+          if (image.width) head.push(tag(prefix + ':width', image.width))
+          if (image.height) head.push(tag(prefix + ':height', image.height))
+          if (image.alt) head.push(tag(prefix + ':alt', image.alt))
+          if (image.type) head.push(tag(prefix + ':type', image.type))
+        } else {
+          head.push(tag(prefix, item))
+        }
+      }
+    }
+
+    if (md.openGraph) {
+      const og = md.openGraph as Record<string, unknown>
+
+      if (og.title != null) head.push(tag('og:title', og.title))
+      if (og.description != null) head.push(tag('og:description', og.description))
+      if (og.url != null) head.push(tag('og:url', og.url))
+      if (og.siteName != null) head.push(tag('og:site_name', og.siteName))
+      if (og.type != null) head.push(tag('og:type', og.type))
+      if (og.locale != null) head.push(tag('og:locale', og.locale))
+      if (og.images != null) images('og:image', og.images)
+    }
+
+    if (md.twitter) {
+      const tw = md.twitter as Record<string, unknown>
+
+      if (tw.card != null) head.push(tag('twitter:card', tw.card))
+      if (tw.title != null) head.push(tag('twitter:title', tw.title))
+      if (tw.description != null) head.push(tag('twitter:description', tw.description))
+      if (tw.site != null) head.push(tag('twitter:site', tw.site))
+      if (tw.creator != null) head.push(tag('twitter:creator', tw.creator))
+      if (tw.images != null) images('twitter:image', tw.images)
+    }
+
+    // icons is links, not meta. A string is one icon; an object names which
+    // rel each is for. The ones found in app/ are already in APP_HEAD above,
+    // so this is for an app that wants to say it explicitly.
+    const links = (rel: string, value: unknown): void => {
+      const list = Array.isArray(value) ? value : [value]
+
+      for (const item of list) {
+        if (item == null) continue
+
+        const icon = typeof item === 'object' && !(item instanceof URL)
+          ? (item as Record<string, unknown>)
+          : { url: item }
+
+        head.push(
+          createElement('link', {
+            key: '__i_' + rel + '_' + String(icon.url).slice(0, 40),
+            rel: (icon.rel as string) ?? rel,
+            href: absolute(icon.url),
+            ...(icon.type ? { type: icon.type } : {}),
+            ...(icon.sizes ? { sizes: icon.sizes } : {}),
+            ...(icon.media ? { media: icon.media } : {}),
+          }),
+        )
+      }
+    }
+
+    if (md.icons != null) {
+      const icons = md.icons as Record<string, unknown> | string | unknown[]
+
+      if (typeof icons === 'string' || Array.isArray(icons) || icons instanceof URL) {
+        links('icon', icons)
+      } else {
+        if (icons.icon != null) links('icon', icons.icon)
+        if (icons.apple != null) links('apple-touch-icon', icons.apple)
+        if (icons.shortcut != null) links('shortcut icon', icons.shortcut)
+        if (icons.other != null) links('icon', icons.other)
+      }
+    }
+
     // other is flattened in beside the named keys, because it is a place to put
     // meta tags rather than a meta tag by that name. A key at the top level
-    // still renders — the type no longer invites one, but an app written
+    // still renders - the type no longer invites one, but an app written
     // against the old shape must not silently lose its tags.
-    const named = Object.entries(md).filter(([k]) => k !== 'other')
+    const structured = new Set(['title', 'description', 'metadataBase', 'openGraph', 'twitter', 'icons', 'other'])
+    const named = Object.entries(md).filter(([k]) => !structured.has(k))
     const extra = Object.entries((md.other ?? {}) as Record<string, unknown>)
 
     for (const [k, v] of [...named, ...extra]) {
-      if (k === 'title' || k === 'description' || v == null) continue
-      head.push(createElement('meta', { key: '__m_' + k, name: k, content: String(v) }))
+      if (v == null) continue
+
+      if (Array.isArray(v)) {
+        for (const item of v) head.push(tag(k, item))
+      } else {
+        head.push(tag(k, v))
+      }
     }
   }
 
@@ -2788,7 +3026,20 @@ export async function handleAction(
     )
   }
 
-  const result = await (action as (...a: unknown[]) => unknown)(...args)
+  // A plain "use server" function that threw fieldErrors() gets the same
+  // treatment createActionClient gives its handlers: the throw becomes the
+  // returned { validationErrors } that <Form> reads. Left thrown, React
+  // serialises the rejection opaquely — production strips the message — and the
+  // fields it named never reach the browser.
+  let result: unknown
+
+  try {
+    result = await (action as (...a: unknown[]) => unknown)(...args)
+  } catch (error) {
+    if (!isActionValidationError(error)) throw error
+
+    result = { validationErrors: error.errors }
+  }
 
   // Read after the action has run: what it invalidated is only known once its
   // host calls have been made. Rendering here rather than telling the browser
@@ -3917,7 +4168,7 @@ export function rscKit(options = {}) {
             const staticDir = clientOut
                 ? join(dirname(clientOut), 'server', NITRO_STATIC_DIR)
                 : join(outDir, NITRO_STATIC_DIR);
-            const { frozen, results } = await prerenderAfterBundles(bundle, staticDir, clientOut ?? publicAssetsDir);
+            const { frozen, results } = await prerenderAfterBundles(bundle, staticDir, clientOut ?? publicAssetsDir, builder ? knownActionsOf(builder.config, projectRoot) : []);
             // Manifest first. The service worker precaches whatever it finds in this
             // directory, so writing it afterwards leaves it out of the list — and an
             // installed app whose manifest is the one file that needs the network is
@@ -3931,6 +4182,15 @@ export function rscKit(options = {}) {
         },
         configResolved(config) {
             isWatch = config.build?.watch != null;
+            const nitroMain = config.plugins.find((p) => p.name === 'nitro:main');
+            if (nitroMain?.hotUpdate) {
+                const original = nitroMain.hotUpdate;
+                nitroMain.hotUpdate = function (ctx) {
+                    if (this.environment?.name === 'rsc')
+                        return;
+                    return original.call(this, ctx);
+                };
+            }
             // rsc() splits the module graph into client and server; a JSX transform
             // placed ahead of it sees the wrong graph and fails in ways that are hard
             // to trace back here. Cheaper to refuse than to let it through.