feat(fonts): warn when no data

.changeset/lazy-ducks-fix.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Adds a terminal warning when a remote provider returns no data for a family when using the experimental fonts API 

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

@@ -100,3 +100,7 @@ export interface FontFetcher {
 export interface FontTypeExtractor {
 	extract: (url: string) => FontType;
 }
+
+export interface FontLogger {
+	log: (type: 'warn', message: string) => void;
+}

packages/astro/src/assets/fonts/implementations/logger.ts

@@ -0,0 +1,13 @@
+import type { Logger } from '../../../core/logger/core.js';
+import type { FontLogger } from '../definitions.js';
+
+export function createAstroFontLogger({ logger }: { logger: Logger }): FontLogger {
+	return {
+		log: (_type, message) => {
+			if (_type === 'warn') {
+				return logger.warn('assets', message);
+			}
+			_type satisfies never;
+		},
+	};
+}

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

@@ -3,6 +3,7 @@ import type { Storage } from 'unstorage';
 import { LOCAL_PROVIDER_NAME } from './constants.js';
 import type {
 	CssRenderer,
+	FontLogger,
 	FontMetricsResolver,
 	FontTypeExtractor,
 	Hasher,
@@ -25,6 +26,7 @@ import type {
 	PreloadData,
 } from './types.js';
 import { pickFontFaceProperty, unifontFontFaceDataToProperties } from './utils.js';
+import { bold } from 'kleur/colors';
 
 /**
  * Manages how fonts are resolved:
@@ -54,6 +56,7 @@ export async function orchestrate({
 	systemFallbacksProvider,
 	fontMetricsResolver,
 	fontTypeExtractor,
+	logger,
 	createUrlProxy,
 	defaults,
 }: {
@@ -66,6 +69,7 @@ export async function orchestrate({
 	systemFallbacksProvider: SystemFallbacksProvider;
 	fontMetricsResolver: FontMetricsResolver;
 	fontTypeExtractor: FontTypeExtractor;
+	logger: FontLogger;
 	createUrlProxy: (params: CreateUrlProxyParams) => UrlProxy;
 	defaults: Defaults;
 }): Promise<{
@@ -163,6 +167,12 @@ export async function orchestrate({
 				// from families (inside extractUnifontProviders).
 				[family.provider.name!],
 			);
+			if (result.fonts.length === 0) {
+				logger.log(
+					'warn',
+					`No data found for family ${bold(family.name)}. Review your configuration`,
+				);
+			}
 			// The data returned by the remote provider contains original URLs. We proxy them.
 			fonts = normalizeRemoteFontFaces({ fonts: result.fonts, urlProxy });
 		}

packages/astro/src/assets/fonts/vite-plugin-fonts.ts

@@ -45,6 +45,7 @@ import {
 import { createUrlProxy } from './implementations/url-proxy.js';
 import { orchestrate } from './orchestrate.js';
 import type { ConsumableMap, FontFileDataMap } from './types.js';
+import { createAstroFontLogger } from './implementations/logger.js';
 
 interface Options {
 	settings: AstroSettings;
@@ -143,6 +144,7 @@ export function fontsPlugin({ settings, sync, logger }: Options): Plugin {
 			systemFallbacksProvider,
 			fontMetricsResolver,
 			fontTypeExtractor,
+			logger: createAstroFontLogger({ logger }),
 			createUrlProxy: ({ local, ...params }) => {
 				const dataCollector = createDataCollector(params);
 				const contentResolver = local

packages/astro/test/units/assets/fonts/orchestrate.test.js

@@ -16,6 +16,7 @@ import { createUrlProxy } from '../../../../dist/assets/fonts/implementations/ur
 import { orchestrate } from '../../../../dist/assets/fonts/orchestrate.js';
 import { defineAstroFontProvider } from '../../../../dist/assets/fonts/providers/index.js';
 import {
+	createSpyLogger,
 	createSpyStorage,
 	fakeFontMetricsResolver,
 	fakeHasher,
@@ -29,6 +30,8 @@ describe('fonts orchestrate()', () => {
 		const errorHandler = simpleErrorHandler;
 		const fontTypeExtractor = createFontTypeExtractor({ errorHandler });
 		const hasher = fakeHasher;
+		const { logger, messages } = createSpyLogger();
+
 		const { fontFileDataMap, consumableMap } = await orchestrate({
 			families: [
 				{
@@ -56,6 +59,7 @@ describe('fonts orchestrate()', () => {
 			systemFallbacksProvider: createSystemFallbacksProvider(),
 			fontMetricsResolver: fakeFontMetricsResolver,
 			fontTypeExtractor,
+			logger,
 			createUrlProxy: ({ local, ...params }) => {
 				const dataCollector = createDataCollector(params);
 				const contentResolver = createRemoteUrlProxyContentResolver();
@@ -69,6 +73,7 @@ describe('fonts orchestrate()', () => {
 			},
 			defaults: DEFAULTS,
 		});
+
 		assert.deepStrictEqual(
 			[...fontFileDataMap.entries()],
 			[
@@ -96,10 +101,12 @@ describe('fonts orchestrate()', () => {
 		assert.equal(entry?.css.includes(':root{--test:Test-'), true);
 		// Fallback
 		assert.equal(entry?.css.includes('fallback: Arial"'), true);
+
+		assert.equal(messages.length, 0);
 	});
 
 	it('works with a remote provider', async () => {
-		const fakeUnifontProvider = defineFontProvider('test', () => {
+		const fakeUnifontProvider = defineFontProvider('normal', () => {
 			return {
 				resolveFont: () => {
 					return {
@@ -123,14 +130,23 @@ describe('fonts orchestrate()', () => {
 			};
 		});
 		const fakeAstroProvider = defineAstroFontProvider({
-			entrypoint: 'test',
+			entrypoint: 'normal',
+		});
+
+		const fakeEmptyUnifontProvider = defineFontProvider('empty', () => ({
+			resolveFont: () => ({ fonts: [] }),
+		}));
+		const fakeEmptyAstroProvider = defineAstroFontProvider({
+			entrypoint: 'empty',
 		});
 
 		const root = new URL(import.meta.url);
 		const { storage } = createSpyStorage();
 		const errorHandler = simpleErrorHandler;
 		const fontTypeExtractor = createFontTypeExtractor({ errorHandler });
 		const hasher = fakeHasher;
+		const { logger, messages } = createSpyLogger();
+
 		const { fontFileDataMap, consumableMap } = await orchestrate({
 			families: [
 				{
@@ -139,14 +155,20 @@ describe('fonts orchestrate()', () => {
 					provider: fakeAstroProvider,
 					fallbacks: ['serif'],
 				},
+				{
+					name: 'Foo',
+					cssVariable: '--foo',
+					provider: fakeEmptyAstroProvider,
+					fallbacks: ['serif'],
+				},
 			],
 			hasher,
 			remoteFontProviderResolver: createRemoteFontProviderResolver({
 				root,
 				errorHandler,
 				modResolver: {
-					resolve: async () => ({
-						provider: fakeUnifontProvider,
+					resolve: async (id) => ({
+						provider: id.endsWith('empty') ? fakeEmptyUnifontProvider : fakeUnifontProvider,
 					}),
 				},
 			}),
@@ -156,6 +178,7 @@ describe('fonts orchestrate()', () => {
 			systemFallbacksProvider: createSystemFallbacksProvider(),
 			fontMetricsResolver: fakeFontMetricsResolver,
 			fontTypeExtractor,
+			logger,
 			createUrlProxy: ({ local, ...params }) => {
 				const dataCollector = createDataCollector(params);
 				const contentResolver = createRemoteUrlProxyContentResolver();
@@ -183,7 +206,7 @@ describe('fonts orchestrate()', () => {
 				],
 			],
 		);
-		assert.deepStrictEqual([...consumableMap.keys()], ['--test']);
+		assert.deepStrictEqual([...consumableMap.keys()], ['--test', '--foo']);
 		const entry = consumableMap.get('--test');
 		assert.deepStrictEqual(entry?.preloadData, [
 			{ url: 'https://example.com/foo.woff2.woff2', type: 'woff2' },
@@ -194,5 +217,7 @@ describe('fonts orchestrate()', () => {
 		assert.equal(entry?.css.includes(':root{--test:Test-'), true);
 		// Fallback
 		assert.equal(entry?.css.includes('fallback: Times New Roman"'), true);
+
+		assert.equal(messages.length, 1);
 	});
 });

packages/astro/test/units/assets/fonts/utils.js

@@ -81,3 +81,16 @@ export const fakeFontMetricsResolver = {
 		return JSON.stringify(input, null, 2) + `,`;
 	},
 };
+
+export function createSpyLogger() {
+	/** @type {Array<string>} */
+	const messages = [];
+	/** @type {import('../../../../dist/assets/fonts/definitions').FontLogger} */
+	const logger = {
+		log: (_type, message) => {
+			messages.push(message);
+		},
+	};
+
+	return { logger, messages };
+}