Captured Fonts

1import { copyFileSync, existsSync, mkdirSync, readFileSync } from "node:fs";
2import { join } from "node:path";
3
4// Capture preserves subset and variable-axis descriptors in extracted/page.html.
5// Filenames alone cannot identify a face's character coverage.
6export function stageCapturedFonts(projectDir, families) {
7  const page = join(projectDir, "capture/extracted/page.html");
8  const result = { faces: [], families: new Set(), files: new Set() };
9  if (!existsSync(page)) return result;
10  const wanted = new Set(families.map((family) => family.toLowerCase()));
11  const html = readFileSync(page, "utf8");
12  const copied = new Set();
13  for (const style of html.matchAll(/<style\b[^>]*>([\s\S]*?)<\/style\s*>/gi)) {
14    const css = style[1].replace(/\/\*[\s\S]*?\*\//g, "");
15    for (const match of css.matchAll(/@font-face\s*\{([^}]+)\}/gi)) {
16      const body = match[1];
17      const familyValue = /(?:^|;)\s*font-family\s*:\s*([^;]+)/i.exec(body)?.[1]?.trim();
18      if (!familyValue) continue;
19      const family = familyValue.replace(/^(['"])(.*)\1$/, "$2");
20      if (!wanted.has(family.toLowerCase())) continue;
21      result.families.add(family.toLowerCase());
22      const source = /(?:^|;)\s*src\s*:\s*([^;]+)/i.exec(body);
23      if (!source) continue;
24      const sources = localFontSources(source[1], projectDir);
25      if (!sources.length) {
26        console.warn("Captured font has no downloaded source: " + family);
27        continue;
28      }
29      for (const file of sources) {
30        if (copied.has(file.name)) continue;
31        if (!copied.size) mkdirSync(join(projectDir, "assets/fonts"), { recursive: true });
32        copyFileSync(file.source, join(projectDir, file.target));
33        copied.add(file.name);
34        result.files.add(file.target);
35      }
36      const src = sources.map((file) => file.css).join(", ");
37      const rule = "@font-face{" + body.replace(source[1], src) + "}";
38      if (!result.faces.includes(rule)) result.faces.push(rule);
39    }
40  }
41  return result;
42}
43
44function localFontSources(source, projectDir) {
45  const files = [];
46  for (const match of source.matchAll(
47    /url\(\s*(?:"([^"]+)"|'([^']+)'|([^\s)]+))\s*\)(\s*format\([^)]*\))?/gi
48  )) {
49    const url = match[1] ?? match[2] ?? match[3];
50    const name = /^assets\/fonts\/([a-z0-9_.-]+\.(?:woff2?|ttf|otf))$/i.exec(url)?.[1];
51    if (!name) continue;
52    const path = join(projectDir, "capture/assets/fonts", name);
53    if (!existsSync(path)) continue;
54    const target = "assets/fonts/captured-" + name;
55    files.push({ name, source: path, target, css: 'url("' + target + '")' + (match[4] ?? "") });
56  }
57  return files;
58}