@svelte-vitals/vite 0.29.7 → 0.30.1

package/README.md

@@ -4,7 +4,7 @@
 
 Vite/SvelteKit plugin for [svelte-vitals](https://github.com/oekazuma/svelte-vitals). Two things in one package:
 
-- **Build-time gate** — piggybacks on `vite build`, parses the **prerendered HTML's `<head>`**, and runs the same rule engine as the CLI (SEO, Performance, Correctness, Security, Architecture) — library-agnostic, because it inspects the real output. Fails the build when findings reach `failOn`.
+- **Build-time gate** — piggybacks on `vite build`, parses the **prerendered HTML** (head metadata, images, headings, landmarks and ids), and runs the same rule engine as the CLI (SEO, Performance, Correctness, Security, Architecture, Accessibility) — library-agnostic, because it inspects the real output. Fails the build when findings reach `failOn`.
 - **Live dev dashboard** — on by default during `vite dev`: a searchable, filterable code-health dashboard at `/__svelte-vitals/`, covering the whole project from startup via static analysis, refined to real rendered values as you browse.
 
 > **ESM-only** (Node 22.13+). Ships ES modules only; `require()` is unsupported by design.

package/dist/{chunk-EHCC47NO.js → chunk-6FDRI4Q6.js}

@@ -1,5 +1,6 @@
 // src/providers/rendered/parse-html.ts
 import { parse } from "node-html-parser";
+import { decodeFragmentId, splitTokens, isTopFragment, LANDMARK_ROLES, IDREF_ATTRS } from "@svelte-vitals/core";
 function attrValue(v) {
   return v !== void 0 && v.trim().length > 0 ? "static" : "absent";
 }
@@ -26,6 +27,49 @@ function isClassicScriptType(type) {
   const normalized = type.trim().toLowerCase();
   return normalized === "" || JS_MIME_TYPES.has(normalized);
 }
+var SECTIONING_TAGS = /* @__PURE__ */ new Set(["article", "aside", "main", "nav", "section"]);
+function collectA11y(root) {
+  const landmarks = [];
+  const nestedLandmarks = [];
+  const ids = [];
+  const idRefs = [];
+  const walk = (el, ctx) => {
+    const tag = el.rawTagName?.toLowerCase();
+    const roleAttr = el.getAttribute("role");
+    let landmark;
+    if (roleAttr !== void 0) {
+      const role = splitTokens(roleAttr)[0];
+      landmark = role && LANDMARK_ROLES.has(role) ? role : void 0;
+    } else if (tag === "main") {
+      landmark = "main";
+    } else if ((tag === "header" || tag === "footer") && ctx.sectioning === 0) {
+      landmark = tag === "header" ? "banner" : "contentinfo";
+    }
+    if (landmark) {
+      landmarks.push(landmark);
+      const within = ctx.landmarks.at(-1);
+      if (within) nestedLandmarks.push({ kind: landmark, within });
+    }
+    const id = el.getAttribute("id");
+    if (id && id.trim()) ids.push(id);
+    const href = el.getAttribute("href");
+    if (href && href.startsWith("#") && href.length > 1) {
+      const fragment = decodeFragmentId(href.slice(1));
+      if (!isTopFragment(fragment)) idRefs.push({ id: fragment, attr: "href" });
+    }
+    for (const attr of IDREF_ATTRS) {
+      for (const token of splitTokens(el.getAttribute(attr) ?? void 0)) idRefs.push({ id: token, attr });
+    }
+    if (tag === "template") return;
+    const nextCtx = {
+      sectioning: ctx.sectioning + (SECTIONING_TAGS.has(tag) ? 1 : 0),
+      landmarks: landmark ? [...ctx.landmarks, landmark] : ctx.landmarks
+    };
+    for (const child of el.children) walk(child, nextCtx);
+  };
+  for (const child of root.children) walk(child, { sectioning: 0, landmarks: [] });
+  return { landmarks, nestedLandmarks, ids, idRefs };
+}
 function parseHtmlHead(html) {
   const root = parse(html);
   const head = root.querySelector("head") ?? root;
@@ -63,9 +107,9 @@ function parseHtmlHead(html) {
     });
   }
   for (const link of head.querySelectorAll("link")) {
-    const rel = link.getAttribute("rel");
+    const rel = link.getAttribute("rel")?.toLowerCase();
     if (!rel) continue;
-    const asAttr = link.getAttribute("as");
+    const asAttr = link.getAttribute("as")?.toLowerCase();
     const hasCrossorigin = link.hasAttribute("crossorigin");
     const hreflang = link.getAttribute("hreflang");
     const href = link.getAttribute("href");
@@ -118,7 +162,63 @@ function parseHtmlHead(html) {
     hasSrcset: img.hasAttribute("srcset"),
     line: 0
   }));
-  return { tags, htmlLang, headings, images };
+  const a11y = collectA11y(root);
+  return { tags, htmlLang, headings, images, ...a11y };
+}
+
+// src/providers/rendered/collect.ts
+import { readFile } from "fs/promises";
+import { join } from "path";
+import { glob } from "tinyglobby";
+function toOccurrenceMap(keys, file) {
+  const out = /* @__PURE__ */ Object.create(null);
+  for (const key of keys) (out[key] ??= []).push({ file, line: 0 });
+  return out;
+}
+function deriveRouteFromHtmlPath(relPath) {
+  let p = relPath.replace(/\\/g, "/").replace(/\.html$/, "");
+  if (p === "index") return "/";
+  if (p.endsWith("/index")) p = p.slice(0, -"/index".length);
+  return "/" + p;
+}
+async function collectRenderedHeads(prerenderPagesDir) {
+  const files = (await glob("**/*.html", { cwd: prerenderPagesDir })).sort();
+  const parsedFiles = await Promise.all(
+    files.map(async (rel) => ({ rel, parsed: parseHtmlHead(await readFile(join(prerenderPagesDir, rel), "utf8")) }))
+  );
+  const heads = [];
+  const headings = [];
+  const images = [];
+  const a11y = [];
+  let htmlLang = { presence: "none", value: "absent" };
+  for (const { rel, parsed } of parsedFiles) {
+    if (htmlLang.presence === "none" && parsed.htmlLang.presence === "own") htmlLang = parsed.htmlLang;
+    const route = deriveRouteFromHtmlPath(rel);
+    heads.push({
+      route,
+      source: "rendered",
+      tags: parsed.tags,
+      file: rel
+    });
+    headings.push({
+      route,
+      // Rendered mode does not track source lines (line 0 = unknown); file is the HTML path.
+      headings: parsed.headings.map((level) => ({ level, line: 0, file: rel }))
+    });
+    images.push({ route, images: parsed.images.map((img) => ({ ...img, file: rel })) });
+    a11y.push({
+      route,
+      landmarks: toOccurrenceMap(parsed.landmarks, rel),
+      nestedLandmarks: parsed.nestedLandmarks.map((n) => ({ ...n, file: rel, line: 0 })),
+      ids: toOccurrenceMap(parsed.ids, rel),
+      idRefs: parsed.idRefs.map((r) => ({ ...r, file: rel, line: 0 })),
+      idCandidates: [...new Set(parsed.ids)],
+      // The prerendered document IS the closed world: every id/landmark/reference it can ever
+      // have is already in it, unlike source mode which may hit an unresolved component.
+      fullyResolved: true
+    });
+  }
+  return { heads, headings, images, a11y, htmlLang };
 }
 
 // src/loopback.ts
@@ -133,5 +233,7 @@ function isLoopbackOrigin(origin) {
 
 export {
   parseHtmlHead,
+  toOccurrenceMap,
+  collectRenderedHeads,
   isLoopbackOrigin
 };

package/dist/hooks/index.js

@@ -1,7 +1,8 @@
 import {
   isLoopbackOrigin,
-  parseHtmlHead
-} from "../chunk-EHCC47NO.js";
+  parseHtmlHead,
+  toOccurrenceMap
+} from "../chunk-6FDRI4Q6.js";
 
 // src/hooks/handle.ts
 import { DEV } from "esm-env";
@@ -42,17 +43,38 @@ async function postIngest(origin, route, results, failedRuleIds) {
 }
 async function analyzeAndIngest(html, route, origin, rules, config, lastSignature) {
   try {
-    const { tags, htmlLang, headings: levels, images: imgs } = parseHtmlHead(html);
+    const {
+      tags,
+      htmlLang,
+      headings: levels,
+      images: imgs,
+      landmarks,
+      nestedLandmarks,
+      ids,
+      idRefs
+    } = parseHtmlHead(html);
     const head = { route, source: "rendered", tags, file: route };
     const headings = [
       { route, headings: levels.map((level) => ({ level, line: 0, file: route })) }
     ];
     const images = [{ route, images: imgs.map((img) => ({ ...img, file: route })) }];
+    const a11y = [
+      {
+        route,
+        landmarks: toOccurrenceMap(landmarks, route),
+        nestedLandmarks: nestedLandmarks.map((n) => ({ ...n, file: route, line: 0 })),
+        ids: toOccurrenceMap(ids, route),
+        idRefs: idRefs.map((r) => ({ ...r, file: route, line: 0 })),
+        idCandidates: [...new Set(ids)],
+        fullyResolved: true
+      }
+    ];
     const project = { hasRobotsTxt: true, hasSitemap: true, htmlLang };
     const { results: ruleResults, failedRules } = await runRules(rules, {
       heads: [head],
       headings,
       images,
+      a11y,
       project,
       config
     });
@@ -84,15 +106,8 @@ function svelteVitalsHandle(options = {}) {
     return resolve(event, {
       transformPageChunk: ({ html, done }) => {
         buffer += html;
-        if (done)
-          void analyzeAndIngest(
-            buffer,
-            event.route.id ?? event.url.pathname,
-            event.url.origin,
-            rules,
-            config,
-            lastSignature
-          );
+        if (done && event.route.id != null)
+          void analyzeAndIngest(buffer, event.route.id, event.url.origin, rules, config, lastSignature);
         return html;
       }
     });

package/dist/index.js

@@ -1,12 +1,12 @@
 import {
-  isLoopbackOrigin,
-  parseHtmlHead
-} from "./chunk-EHCC47NO.js";
+  collectRenderedHeads,
+  isLoopbackOrigin
+} from "./chunk-6FDRI4Q6.js";
 
 // src/plugin.ts
 import { existsSync } from "fs";
 import { writeFile, mkdir } from "fs/promises";
-import { join as join4, isAbsolute, dirname, relative as relative3, basename, sep as sep2 } from "path";
+import { join as join3, isAbsolute, dirname, relative as relative3, basename, sep as sep2 } from "path";
 import {
   CATEGORIES as CATEGORIES2,
   defaultConfig,
@@ -35,47 +35,9 @@ import {
 } from "@svelte-vitals/core";
 import { loadConfigFile } from "svelte-vitals";
 
-// src/providers/rendered/collect.ts
-import { readFile } from "fs/promises";
-import { join } from "path";
-import { glob } from "tinyglobby";
-function deriveRouteFromHtmlPath(relPath) {
-  let p = relPath.replace(/\\/g, "/").replace(/\.html$/, "");
-  if (p === "index") return "/";
-  if (p.endsWith("/index")) p = p.slice(0, -"/index".length);
-  return "/" + p;
-}
-async function collectRenderedHeads(prerenderPagesDir) {
-  const files = (await glob("**/*.html", { cwd: prerenderPagesDir })).sort();
-  const parsedFiles = await Promise.all(
-    files.map(async (rel) => ({ rel, parsed: parseHtmlHead(await readFile(join(prerenderPagesDir, rel), "utf8")) }))
-  );
-  const heads = [];
-  const headings = [];
-  const images = [];
-  let htmlLang = { presence: "none", value: "absent" };
-  for (const { rel, parsed } of parsedFiles) {
-    if (htmlLang.presence === "none" && parsed.htmlLang.presence === "own") htmlLang = parsed.htmlLang;
-    const route = deriveRouteFromHtmlPath(rel);
-    heads.push({
-      route,
-      source: "rendered",
-      tags: parsed.tags,
-      file: rel
-    });
-    headings.push({
-      route,
-      // Rendered mode does not track source lines (line 0 = unknown); file is the HTML path.
-      headings: parsed.headings.map((level) => ({ level, line: 0, file: rel }))
-    });
-    images.push({ route, images: parsed.images.map((img) => ({ ...img, file: rel })) });
-  }
-  return { heads, headings, images, htmlLang };
-}
-
 // src/providers/rendered/project.ts
-import { access, readFile as readFile2 } from "fs/promises";
-import { join as join2 } from "path";
+import { access, readFile } from "fs/promises";
+import { join } from "path";
 import {
   ROBOTS_SOURCE_PATHS,
   SITEMAP_SOURCE_PATHS,
@@ -93,22 +55,22 @@ async function exists(path) {
   }
 }
 async function existsAny(cwd, paths) {
-  const found = await Promise.all(paths.map((p) => exists(join2(cwd, p))));
+  const found = await Promise.all(paths.map((p) => exists(join(cwd, p))));
   return found.some(Boolean);
 }
 async function robotsRefsSitemap(cwd) {
   try {
-    return /^\s*sitemap:/im.test(await readFile2(join2(cwd, "static/robots.txt"), "utf8"));
+    return /^\s*sitemap:/im.test(await readFile(join(cwd, "static/robots.txt"), "utf8"));
   } catch {
     return void 0;
   }
 }
 async function readFirstConfig(cwd, files) {
   for (const file of files) {
-    const path = join2(cwd, file);
+    const path = join(cwd, file);
     if (!await exists(path)) continue;
     try {
-      return { file, source: await readFile2(path, "utf8") };
+      return { file, source: await readFile(path, "utf8") };
     } catch {
       return void 0;
     }
@@ -136,16 +98,16 @@ async function collectRenderedProject(cwd, htmlLang) {
 }
 
 // src/providers/source/components.ts
-import { readFile as readFile3, access as access2 } from "fs/promises";
-import { join as join3 } from "path";
-import { glob as glob2 } from "tinyglobby";
+import { readFile as readFile2, access as access2 } from "fs/promises";
+import { join as join2 } from "path";
+import { glob } from "tinyglobby";
 import {
   collectComponentFacts as collect,
   collectKitModuleFacts as collectKit,
   collectSourceFiles as collectFiles
 } from "@svelte-vitals/core";
 var nodeRuntime = {
-  readFile: (path) => readFile3(path, "utf8"),
+  readFile: (path) => readFile2(path, "utf8"),
   async exists(path) {
     try {
       await access2(path);
@@ -154,8 +116,8 @@ var nodeRuntime = {
       return false;
     }
   },
-  glob: (pattern, cwd) => glob2(pattern, { cwd, dot: false }),
-  join: (...parts) => join3(...parts)
+  glob: (pattern, cwd) => glob(pattern, { cwd, dot: false }),
+  join: (...parts) => join2(...parts)
 };
 function collectComponentFacts(root) {
   return collect(nodeRuntime, root);
@@ -207,7 +169,7 @@ async function resolveConfig(cwd, options) {
 }
 async function analyze(prerenderPagesDir, cwd, options, extraProjectFacts, resolved) {
   const { config, warnings } = resolved ?? await resolveConfig(cwd, options);
-  const [{ heads, headings, images, htmlLang }, components, sourceFiles] = await Promise.all([
+  const [{ heads, headings, images, a11y, htmlLang }, components, sourceFiles] = await Promise.all([
     collectRenderedHeads(prerenderPagesDir),
     collectComponentFacts(cwd),
     collectSourceFiles(cwd)
@@ -226,6 +188,7 @@ async function analyze(prerenderPagesDir, cwd, options, extraProjectFacts, resol
     heads,
     headings,
     images,
+    a11y,
     project,
     components,
     config,
@@ -242,7 +205,7 @@ async function analyze(prerenderPagesDir, cwd, options, extraProjectFacts, resol
   const summary = summarize(results, scoringConfig);
   const failed = hasFailureAtOrAbove(summary, scoringConfig.failOn);
   const coverageNote = `Analyzed ${heads.length} prerendered route(s). SSR/dynamic routes are not covered \u2014 run \`npx svelte-vitals\` for those.
-Scanned ${components.length} component(s) under src/ for Correctness/Security/Architecture/Bundle findings.`;
+Scanned ${components.length} component(s) under src/ for Correctness/Security/Architecture/Accessibility/Bundle findings.`;
   const consoleReport = formatConsoleReport(results, scoringConfig, { mode: "rendered / plugin" }) + "\n" + coverageNote + "\n";
   const jsonReport = formatJsonReport(
     results,
@@ -265,7 +228,7 @@ Scanned ${components.length} component(s) under src/ for Correctness/Security/Ar
 }
 
 // src/minify-flag.ts
-import { readFile as readFile4 } from "fs/promises";
+import { readFile as readFile3 } from "fs/promises";
 import { relative } from "path";
 import { findMinifyDisabled } from "@svelte-vitals/core";
 async function resolveMinifyDisabled(minify, configFile, root) {
@@ -275,7 +238,7 @@ async function resolveMinifyDisabled(minify, configFile, root) {
   const file = rel === "" ? configFile.split("\\").join("/") : rel;
   let line;
   try {
-    line = findMinifyDisabled(await readFile4(configFile, "utf8"))?.line;
+    line = findMinifyDisabled(await readFile3(configFile, "utf8"))?.line;
   } catch {
   }
   return { file, ...line !== void 0 ? { line } : {} };
@@ -626,23 +589,27 @@ function svelteVitals(options = {}) {
   validateRulesOption(options.rules);
   validateOverridesOption(options.overrides, options.rules);
   let root = options.cwd ?? process.cwd();
-  let minifyFlag;
+  let minify;
+  let configFile;
   const buildPlugin = {
     name: "svelte-vitals",
     apply: "build",
     enforce: "post",
+    config(userConfig) {
+      minify = userConfig.build?.minify;
+    },
     configResolved(config) {
       if (!options.cwd) root = config.root;
-      if (!config.build.ssr) minifyFlag = { minify: config.build.minify, configFile: config.configFile };
+      configFile = config.configFile;
     },
     async closeBundle() {
-      const pagesDir = options.prerenderDir ? options.prerenderDir : join4(root, DEFAULT_PRERENDER_DIR);
-      const resolved = isAbsolute(pagesDir) ? pagesDir : join4(root, pagesDir);
+      const pagesDir = options.prerenderDir ? options.prerenderDir : join3(root, DEFAULT_PRERENDER_DIR);
+      const resolved = isAbsolute(pagesDir) ? pagesDir : join3(root, pagesDir);
       if (!existsSync(resolved)) return;
       const resolvedConfig = await resolveConfig(root, options);
       let result;
       try {
-        const viteMinifyDisabled = minifyFlag ? await resolveMinifyDisabled(minifyFlag.minify, minifyFlag.configFile, root) : void 0;
+        const viteMinifyDisabled = await resolveMinifyDisabled(minify, configFile, root);
         result = await analyze(
           resolved,
           root,
@@ -661,7 +628,7 @@ function svelteVitals(options = {}) {
         console.log(out);
       }
       if (options.outFile) {
-        const outPath = isAbsolute(options.outFile) ? options.outFile : join4(root, options.outFile);
+        const outPath = isAbsolute(options.outFile) ? options.outFile : join3(root, options.outFile);
         await mkdir(dirname(outPath), { recursive: true });
         await writeFile(outPath, result.jsonReport);
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@svelte-vitals/vite",
-  "version": "0.29.7",
+  "version": "0.30.1",
   "description": "Vite/SvelteKit plugin for svelte-vitals — analyzes prerendered HTML during vite build, plus a live dev dashboard.",
   "type": "module",
   "license": "MIT",
@@ -42,8 +42,8 @@
     "esm-env": "^1.2.2",
     "node-html-parser": "^9.0.1",
     "tinyglobby": "^0.2.17",
-    "@svelte-vitals/core": "0.42.0",
-    "svelte-vitals": "0.46.0"
+    "@svelte-vitals/core": "0.43.1",
+    "svelte-vitals": "0.47.1"
   },
   "peerDependencies": {
     "@sveltejs/kit": "^2.70.2",