diff --git a/client/src/components/Studio/SpreadView.tsx b/client/src/components/Studio/SpreadView.tsx index 182e8957f..25f1c1daa 100644 --- a/client/src/components/Studio/SpreadView.tsx +++ b/client/src/components/Studio/SpreadView.tsx @@ -2,7 +2,8 @@ import type { CSSProperties } from 'react' import type { BookElement, BookIconElement, BookPageSetup, BookPhotoElement, BookShapeElement, BookSpread, } from '@trek/shared' -import { FONT_STACKS, photoSrc } from './bookRender' +import { photoSrc } from './bookRender' +import { fontStack } from './bookFonts' import { iconComponent } from './iconLibrary' import { HOLED_SHAPES, SHAPE_PATHS, scalePath, unitPath } from './shapes' import { TravelElementView } from './TravelElements' @@ -223,7 +224,7 @@ function PhotoView({ el, big, print, dropLabel }: { {roomy && dropLabel && ( = { - sans: '"Poppins", system-ui, sans-serif', - serif: 'Georgia, "Times New Roman", serif', - display: '"MuseoModerno", "Poppins", system-ui, sans-serif', -} +// The typefaces live in bookFonts.ts (fontStack et al.) — a second stack map +// here is exactly how #2183 happened: the renderer kept a three-font copy +// while the picker grew to seven, and everything else fell back to Poppins. export function photoSrc(photoId: number, big: boolean): string { return `/api/photos/${photoId}/${big ? 'original' : 'thumbnail'}` diff --git a/client/tests/unit/studio/SpreadView.test.tsx b/client/tests/unit/studio/SpreadView.test.tsx index 78787c49a..1264332de 100644 --- a/client/tests/unit/studio/SpreadView.test.tsx +++ b/client/tests/unit/studio/SpreadView.test.tsx @@ -388,3 +388,28 @@ describe('travel elements', () => { expect(el.style.width).toBe('80mm') }) }) + +describe('text typefaces (#2183)', () => { + const text = (font: string): BookElement => ({ + ...common, id: 't1', kind: 'text', text: 'A heading', font, + size: 11, weight: 400, italic: false, align: 'left', + leading: 1.45, tracking: 0, color: '#1a1a1a', + } as unknown as BookElement) + + it('sets every picker font on the element, not just the three the old map knew', () => { + // The regression: a second stack map in bookRender.ts covered sans/serif/ + // display only, so playfair and friends silently inherited Poppins. + expect(firstElement(draw([text('playfair')]).container)!.style.fontFamily).toContain('Playfair Display') + expect(firstElement(draw([text('inter')]).container)!.style.fontFamily).toContain('Inter') + expect(firstElement(draw([text('garamond')]).container)!.style.fontFamily).toContain('EB Garamond') + expect(firstElement(draw([text('bebas')]).container)!.style.fontFamily).toContain('Bebas Neue') + }) + + it('serif means Lora, matching the picker, not the bare system Georgia', () => { + expect(firstElement(draw([text('serif')]).container)!.style.fontFamily).toContain('Lora') + }) + + it('an unknown family still falls back to Poppins instead of the machine default', () => { + expect(firstElement(draw([text('comic-sans')]).container)!.style.fontFamily).toContain('Poppins') + }) +})