add fallback font to the uploaded one

packages/fonts/src/__snapshots__/get-font-faces.test.ts.snap

@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`getFontFaces() same family, but different formats 1`] = `
+Array [
+  Object {
+    "fontDisplay": "swap",
+    "fontFamily": "Roboto, sans-serif",
+    "fontStyle": "normal",
+    "fontWeight": 400,
+    "src": "url('/fonts/roboto.woff') format('woff'), url('/fonts/roboto.ttf') format('truetype')",
+  },
+]
+`;

packages/fonts/src/get-font-faces.test.ts

@@ -22,16 +22,6 @@ describe("getFontFaces()", () => {
         path: "/fonts/roboto.ttf",
       },
     ];
-    expect(getFontFaces(assets)).toMatchInlineSnapshot(`
-[
-  {
-    "fontDisplay": "swap",
-    "fontFamily": "Roboto",
-    "fontStyle": "normal",
-    "fontWeight": 400,
-    "src": "url('/fonts/roboto.woff') format('woff'), url('/fonts/roboto.ttf') format('truetype')",
-  },
-]
-`);
+    expect(getFontFaces(assets)).toMatchSnapshot();
   });
 });

packages/fonts/src/get-font-faces.ts

@@ -1,4 +1,4 @@
-import { FONT_FORMATS } from "./constants";
+import { FONT_FORMATS, DEFAULT_FONT_FALLBACK } from "./constants";
 import type { FontMeta } from "./schema";
 import type { FontFormat } from "./types";
 
@@ -16,7 +16,7 @@ export const getFontFaces = (assets: Array<PartialFontAsset>) => {
 
     if (face === undefined) {
       faces.set(asset.meta.family, {
-        fontFamily: asset.meta.family,
+        fontFamily: `${asset.meta.family}, ${DEFAULT_FONT_FALLBACK}`,
         fontStyle: asset.meta.style,
         fontWeight: asset.meta.weight,
         fontDisplay: "swap" as const,