Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/lucky-rocks-return.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'astro': patch
---

Fixes a case where extra font sources were removed when using the experimental fonts API
59 changes: 35 additions & 24 deletions packages/astro/src/assets/fonts/load.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,11 +53,16 @@ export async function loadFonts({
// When going through the urls/filepaths returned by providers,
// We save the hash and the associated original value so we can use
// it in the vite middleware during development
const collect: ProxyURLOptions['collect'] = ({ hash, type, value }) => {
const collect = (
{ hash, type, value }: Parameters<ProxyURLOptions['collect']>[0],
collectPreload: boolean,
): ReturnType<ProxyURLOptions['collect']> => {
const url = base + hash;
if (!hashToUrlMap.has(hash)) {
hashToUrlMap.set(hash, value);
preloadData.push({ url, type });
if (collectPreload) {
preloadData.push({ url, type });
}
}
// If a family has fallbacks, we store the first url we get that may
// be used for the fallback generation, if capsize doesn't have this
Expand Down Expand Up @@ -90,7 +95,7 @@ export async function loadFonts({
}
return hashString(v + content);
},
collect,
collect: (data) => collect(data, true),
});
},
});
Expand All @@ -117,27 +122,33 @@ export async function loadFonts({
typeof font.meta?.priority === 'number' ? font.meta.priority === 0 : true,
)
// Collect URLs
.map((font) => ({
...font,
src: font.src
// Limit src to 1 file (eg. if woff2 and woff are present, will only take woff2) to avoid
// downloading too many files
.slice(0, 1)
.map((source) =>
'name' in source
? source
: {
...source,
originalURL: source.url,
url: proxyURL({
value: source.url,
// We only use the url for hashing since the service returns urls with a hash already
hashString,
collect,
}),
},
),
}));
.map((font) => {
// The index keeps track of encountered URLs. We can't use the index on font.src.map
// below because it may contain sources without urls, which would prevent preloading completely
let index = 0;
return {
...font,
src: font.src.map((source) => {
if ('name' in source) {
return source;
}
const proxied = {
...source,
originalURL: source.url,
url: proxyURL({
value: source.url,
// We only use the url for hashing since the service returns urls with a hash already
hashString,
// We only collect the first URL to avoid preloading fallback sources (eg. we only
// preload woff2 if woff is available)
collect: (data) => collect(data, index === 0),
}),
};
index++;
return proxied;
}),
};
});
Comment on lines +130 to +151
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: for readability, I would put this code before the return, and maybe use a for loop instead

}

for (const data of fonts) {
Expand Down