The name waits for its font instead of swapping

astro.config.ts

@@ -16,6 +16,10 @@ export default defineConfig({
       name: 'Cinzel Decorative',
       cssVariable: '--font-name',
       fallbacks: ['serif'],
+      // The name is a logotype: drawn in a substitute font it reads as another
+      // word (Cinzel has only capitals). It waits for its font, preloaded and
+      // a few kilobytes, instead of swapping; the body text still swaps.
+      display: 'block',
       options: {
         variants: [
           {

tests/site.spec.ts

@@ -35,6 +35,17 @@ test('renders every section without errors', async ({ page }) => {
   expect(errors).toEqual([]);
 });
 
+test('never draws the name in a substitute font', async ({ page }) => {
+  await page.goto('/');
+  // block: the name waits for Cinzel, preloaded, rather than showing in Times.
+  const display = await page.evaluate(() =>
+    [...document.fonts]
+      .filter(({ family }) => family.includes('Cinzel') && !family.includes('fallback'))
+      .map((font) => font.display),
+  );
+  expect(display).toEqual(['block']);
+});
+
 test('loads every image', async ({ page }) => {
   await page.goto('/');
   await scrollThrough(page);