fix(adobe): refresh kit meta every five minutes (#198)

drevantonder · web-flow · commit efe4f81e84bc · 2025-06-23T10:26:21.000+01:00
diff --git a/src/providers/adobe.ts b/src/providers/adobe.ts
@@ -16,28 +16,50 @@ async function getAdobeFontMeta(id: string): Promise<AdobeFontKit> {
   return kit
 }
 
+const KIT_REFRESH_TIMEOUT = 5 * 60 * 1000
+
 export default defineFontProvider<ProviderOption>('adobe', async (options, ctx) => {
   if (!options.id) {
     return
   }
 
   const familyMap = new Map<string, string>()
+  const notFoundFamilies = new Set<string>()
   const fonts = {
     kits: [] as AdobeFontKit[],
   }
+  let lastRefreshKitTime: number
 
   const kits = typeof options.id === 'string' ? [options.id] : options.id
-  await Promise.all(kits.map(async (id) => {
-    const meta = await ctx.storage.getItem<AdobeFontKit>(`adobe:meta-${id}.json`, () => getAdobeFontMeta(id))
-    if (!meta) {
-      throw new TypeError('No font metadata found in adobe response.')
-    }
 
-    fonts.kits.push(meta)
-    for (const family of meta.families) {
-      familyMap.set(family.name, family.id)
-    }
-  }))
+  await fetchKits()
+
+  async function fetchKits(bypassCache: boolean = false) {
+    familyMap.clear()
+    notFoundFamilies.clear()
+    fonts.kits = []
+
+    await Promise.all(kits.map(async (id) => {
+      let meta: AdobeFontKit
+      const key = `adobe:meta-${id}.json`
+      if (bypassCache) {
+        meta = await getAdobeFontMeta(id)
+        await ctx.storage.setItem(key, meta)
+      }
+      else {
+        meta = await ctx.storage.getItem(key, () => getAdobeFontMeta(id))
+      }
+
+      if (!meta) {
+        throw new TypeError('No font metadata found in adobe response.')
+      }
+
+      fonts.kits.push(meta)
+      for (const family of meta.families) {
+        familyMap.set(family.name, family.id)
+      }
+    }))
+  }
 
   async function getFontDetails(family: string, options: ResolveFontOptions) {
     options.weights = options.weights.map(String)
@@ -90,7 +112,25 @@ export default defineFontProvider<ProviderOption>('adobe', async (options, ctx)
       return [...familyMap.keys()]
     },
     async resolveFont(family, options) {
+      // Check if family is in negative cache first (used to prevent unnecessary refreshes)
+      if (notFoundFamilies.has(family)) {
+        return
+      }
+
+      // Try refreshing the kit metadata if family is not found. We use a debounce mechanism to avoid frequent refreshes.
+      if (!familyMap.has(family)) {
+        const lastRefetch = lastRefreshKitTime || 0
+        const now = Date.now()
+
+        if (now - lastRefetch > KIT_REFRESH_TIMEOUT) {
+          lastRefreshKitTime = Date.now()
+          await fetchKits(true)
+        }
+      }
+
       if (!familyMap.has(family)) {
+        // Add to negative cache to avoid future refreshes for this family
+        notFoundFamilies.add(family)
         return
       }
 
diff --git a/test/providers/adobe.test.ts b/test/providers/adobe.test.ts
@@ -28,7 +28,7 @@ describe('adobe', () => {
     const unifont = await createUnifont([providers.adobe({ id: ['bob'] })])
 
     const restoreFetch = mockFetchReturn(/^https:\/\/typekit.com\/api\//, () => {
-      return { json: () => Promise.resolve({ kit: '' }) }
+      return Promise.resolve({ json: () => Promise.resolve({ kit: '' }) })
     })
     expect(await unifont.resolveFont('Aleo').then(r => r.fonts)).toMatchInlineSnapshot(`[]`)
 
@@ -38,6 +38,7 @@ describe('adobe', () => {
     )
 
     restoreFetch()
+    vi.restoreAllMocks()
   })
 
   it('works', async () => {
@@ -120,4 +121,103 @@ describe('adobe', () => {
     })
     expect(fonts.length).toBe(4)
   })
+
+  it('refreshes kit metadata when font is not found in cache', async () => {
+    let apiCallCount = 0
+
+    // Mock the API endpoint to return different kits on subsequent calls
+    const restoreFetch = mockFetchReturn(
+      /^https:\/\/typekit.com\/api\/v1\/json\/kits\/test123\/published/,
+      () => {
+        apiCallCount++
+
+        if (apiCallCount === 1) {
+          // First API call - return kit without NewFont
+          return Promise.resolve({
+            json: () => Promise.resolve({
+              kit: {
+                id: 'test123',
+                families: [
+                  {
+                    id: 'aleo',
+                    name: 'Aleo',
+                    slug: 'aleo',
+                    css_names: ['aleo'],
+                    css_stack: 'aleo, serif',
+                    variations: ['n4', 'i4'],
+                  },
+                ],
+              },
+            }),
+          })
+        }
+        else {
+          // Second API call - return kit with NewFont
+          return Promise.resolve({
+            json: () => Promise.resolve({
+              kit: {
+                id: 'test123',
+                families: [
+                  {
+                    id: 'aleo',
+                    name: 'Aleo',
+                    slug: 'aleo',
+                    css_names: ['aleo'],
+                    css_stack: 'aleo, serif',
+                    variations: ['n4', 'i4'],
+                  },
+                  {
+                    id: 'newfont',
+                    name: 'NewFont',
+                    slug: 'newfont',
+                    css_names: ['newfont'],
+                    css_stack: 'newfont, sans-serif',
+                    variations: ['n4', 'n7'],
+                  },
+                ],
+              },
+            }),
+          })
+        }
+      },
+    )
+
+    // Add a mock for the CSS file that will be fetched
+    mockFetchReturn(
+      /^https:\/\/use\.typekit\.net\/test123\.css/,
+      () => {
+        return Promise.resolve({
+          text: () => Promise.resolve(`
+            @font-face {
+              font-family: "newfont";
+              src: url("https://use.typekit.net/font.woff2") format("woff2");
+              font-weight: 400;
+              font-style: normal;
+            }
+          `),
+        })
+      },
+    )
+
+    try {
+      // Initialize unifont with the initial kit (without NewFont)
+      const unifont = await createUnifont([providers.adobe({ id: 'test123' })])
+      expect(apiCallCount).toBe(1)
+
+      // Verify NewFont is not initially available
+      const initialFonts = await unifont.listFonts()
+      expect(initialFonts).not.toContain('NewFont')
+
+      // Try to resolve NewFont - this should trigger a refetch
+      const result = await unifont.resolveFont('NewFont')
+
+      // Ensure the font is now available
+      expect(result).toBeDefined()
+      expect(result.fonts).toBeDefined()
+      expect(result.fonts.length).toBeGreaterThan(0)
+    }
+    finally {
+      restoreFetch()
+    }
+  })
 })
