chore(fonts): classes (#14920)

Author: florian-lefebvre

packages/astro/src/assets/fonts/definitions.ts

@@ -28,7 +28,7 @@ export interface LocalProviderUrlResolver {
 	resolve: (input: string) => string;
 }
 
-interface ProxyData {
+export interface ProxyData {
 	weight: unifont.FontFaceData['weight'];
 	style: unifont.FontFaceData['style'];
 	subset: NonNullable<unifont.FontFaceData['meta']>['subset'];
@@ -46,7 +46,7 @@ export interface UrlProxy {
 
 export interface UrlResolver {
 	resolve: (hash: string) => string;
-	getCspResources: () => Array<string>;
+	readonly cspResources: Array<string>;
 }
 
 export interface UrlProxyContentResolver {
@@ -112,3 +112,10 @@ export interface UrlProxyHashResolver {
 export interface StringMatcher {
 	getClosestMatch: (target: string, candidates: Array<string>) => string;
 }
+
+export interface Storage {
+	getItem: (key: string) => Promise<any | null>;
+	getItemRaw: (key: string) => Promise<Buffer | null>;
+	setItem: (key: string, value: any) => Promise<void>;
+	setItemRaw: (key: string, value: any) => Promise<void>;
+}

packages/astro/src/assets/fonts/infra/build-remote-font-provider-mod-resolver.ts

@@ -1,9 +1,7 @@
 import type { RemoteFontProviderModResolver } from '../definitions.js';
 
-export function createBuildRemoteFontProviderModResolver(): RemoteFontProviderModResolver {
-	return {
-		resolve(id) {
-			return import(id);
-		},
-	};
+export class BuildRemoteFontProviderModResolver implements RemoteFontProviderModResolver {
+	async resolve(id: string): Promise<any> {
+		return await import(id);
+	}
 }

packages/astro/src/assets/fonts/infra/build-url-proxy-hash-resolver.ts

@@ -1,15 +1,35 @@
-import type { Hasher, UrlProxyContentResolver, UrlProxyHashResolver } from '../definitions.js';
+import type {
+	Hasher,
+	ProxyData,
+	UrlProxyContentResolver,
+	UrlProxyHashResolver,
+} from '../definitions.js';
+import type { FontType } from '../types.js';
 
-export function createBuildUrlProxyHashResolver({
-	hasher,
-	contentResolver,
-}: {
-	hasher: Hasher;
-	contentResolver: UrlProxyContentResolver;
-}): UrlProxyHashResolver {
-	return {
-		resolve({ originalUrl, type }) {
-			return `${hasher.hashString(contentResolver.resolve(originalUrl))}.${type}`;
-		},
-	};
+export class BuildUrlProxyHashResolver implements UrlProxyHashResolver {
+	readonly #hasher: Hasher;
+	readonly #contentResolver: UrlProxyContentResolver;
+
+	constructor({
+		hasher,
+		contentResolver,
+	}: {
+		hasher: Hasher;
+		contentResolver: UrlProxyContentResolver;
+	}) {
+		this.#hasher = hasher;
+		this.#contentResolver = contentResolver;
+	}
+
+	resolve({
+		originalUrl,
+		type,
+	}: {
+		originalUrl: string;
+		type: FontType;
+		cssVariable: string;
+		data: ProxyData;
+	}): string {
+		return `${this.#hasher.hashString(this.#contentResolver.resolve(originalUrl))}.${type}`;
+	}
 }

packages/astro/src/assets/fonts/infra/build-url-resolver.ts

@@ -4,38 +4,49 @@ import { getAssetsPrefix } from '../../utils/getAssetsPrefix.js';
 import { createPlaceholderURL, stringifyPlaceholderURL } from '../../utils/url.js';
 import type { UrlResolver } from '../definitions.js';
 
-export function createBuildUrlResolver({
-	base,
-	assetsPrefix,
-	searchParams,
-}: {
-	base: string;
-	assetsPrefix: AssetsPrefix;
-	searchParams: URLSearchParams;
-}): UrlResolver {
-	const resources = new Set<string>();
-	return {
-		resolve(hash) {
-			const prefix = assetsPrefix ? getAssetsPrefix(fileExtension(hash), assetsPrefix) : undefined;
-			let urlPath: string;
-			if (prefix) {
-				resources.add(prefix);
-				urlPath = joinPaths(prefix, base, hash);
-			} else {
-				resources.add("'self'");
-				urlPath = prependForwardSlash(joinPaths(base, hash));
-			}
+export class BuildUrlResolver implements UrlResolver {
+	readonly #resources = new Set<string>();
+	readonly #base: string;
+	readonly #assetsPrefix: AssetsPrefix;
+	readonly #searchParams: URLSearchParams;
 
-			// Create URL object and append searchParams if available (for adapter-level tracking like skew protection)
-			const url = createPlaceholderURL(urlPath);
-			searchParams.forEach((value, key) => {
-				url.searchParams.set(key, value);
-			});
+	constructor({
+		base,
+		assetsPrefix,
+		searchParams,
+	}: {
+		base: string;
+		assetsPrefix: AssetsPrefix;
+		searchParams: URLSearchParams;
+	}) {
+		this.#base = base;
+		this.#assetsPrefix = assetsPrefix;
+		this.#searchParams = searchParams;
+	}
 
-			return stringifyPlaceholderURL(url);
-		},
-		getCspResources() {
-			return Array.from(resources);
-		},
-	};
+	resolve(hash: string): string {
+		const prefix = this.#assetsPrefix
+			? getAssetsPrefix(fileExtension(hash), this.#assetsPrefix)
+			: undefined;
+		let urlPath: string;
+		if (prefix) {
+			this.#resources.add(prefix);
+			urlPath = joinPaths(prefix, this.#base, hash);
+		} else {
+			this.#resources.add("'self'");
+			urlPath = prependForwardSlash(joinPaths(this.#base, hash));
+		}
+
+		// Create URL object and append searchParams if available (for adapter-level tracking like skew protection)
+		const url = createPlaceholderURL(urlPath);
+		this.#searchParams.forEach((value, key) => {
+			url.searchParams.set(key, value);
+		});
+
+		return stringifyPlaceholderURL(url);
+	}
+
+	get cspResources(): Array<string> {
+		return Array.from(this.#resources);
+	}
 }

packages/astro/src/assets/fonts/infra/cached-font-fetcher.ts

@@ -1,40 +1,48 @@
 import { isAbsolute } from 'node:path';
-import type { Storage } from 'unstorage';
 import { AstroError, AstroErrorData } from '../../../core/errors/index.js';
-import type { FontFetcher } from '../definitions.js';
+import type { FontFetcher, Storage } from '../definitions.js';
+import type { FontFileData } from '../types.js';
 import { cache } from '../utils.js';
 
-export function createCachedFontFetcher({
-	storage,
-	fetch,
-	readFile,
-}: {
-	storage: Storage;
-	fetch: (url: string, init?: RequestInit) => Promise<Response>;
-	readFile: (url: string) => Promise<Buffer>;
-}): FontFetcher {
-	return {
-		async fetch({ hash, url, init }) {
-			return await cache(storage, hash, async () => {
-				try {
-					if (isAbsolute(url)) {
-						return await readFile(url);
-					}
-					const response = await fetch(url, init ?? undefined);
-					if (!response.ok) {
-						throw new Error(`Response was not successful, received status code ${response.status}`);
-					}
-					return Buffer.from(await response.arrayBuffer());
-				} catch (cause) {
-					throw new AstroError(
-						{
-							...AstroErrorData.CannotFetchFontFile,
-							message: AstroErrorData.CannotFetchFontFile.message(url),
-						},
-						{ cause },
-					);
+export class CachedFontFetcher implements FontFetcher {
+	readonly #storage: Storage;
+	readonly #fetch: (url: string, init?: RequestInit) => Promise<Response>;
+	readonly #readFile: (url: string) => Promise<Buffer>;
+
+	constructor({
+		storage,
+		fetch,
+		readFile,
+	}: {
+		storage: Storage;
+		fetch: (url: string, init?: RequestInit) => Promise<Response>;
+		readFile: (url: string) => Promise<Buffer>;
+	}) {
+		this.#storage = storage;
+		this.#fetch = fetch;
+		this.#readFile = readFile;
+	}
+
+	async fetch({ hash, url, init }: FontFileData): Promise<Buffer> {
+		return await cache(this.#storage, hash, async () => {
+			try {
+				if (isAbsolute(url)) {
+					return await this.#readFile(url);
+				}
+				const response = await this.#fetch(url, init ?? undefined);
+				if (!response.ok) {
+					throw new Error(`Response was not successful, received status code ${response.status}`);
 				}
-			});
-		},
-	};
+				return Buffer.from(await response.arrayBuffer());
+			} catch (cause) {
+				throw new AstroError(
+					{
+						...AstroErrorData.CannotFetchFontFile,
+						message: AstroErrorData.CannotFetchFontFile.message(url),
+					},
+					{ cause },
+				);
+			}
+		});
+	}
 }