bert.hausmans
41af180168
Per RFC-WS-PRIMEVUE-PLAN-2-5 §4 AD-2.5-T1. Establishes Inter as the canonical Crewli body font via @fontsource/inter (local package, no Google Fonts CDN). Audit findings (pre-change): - No @fontsource/public-sans package was installed. - No <link> tag in index.html loaded Public Sans. - Only one Public Sans reference existed in source: the vendored Vuexy SCSS variable $font-family-custom at src/@core/scss/template/libs/vuetify/_variables.scss, which drives Vuetify's $body-font-family on legacy surfaces during F4. - No src/main.css exists; the Tailwind v4 entry lives at src/assets/styles/tailwind.css with no @theme block yet. Changes: - @fontsource/inter@^5.2.8 added to dependencies; weights 400/500/600/700 imported at main.ts ahead of tailwind.css. - src/assets/styles/tailwind.css: new @theme block declaring --font-sans Inter-first, plus :root --crewli-font-family and html/body font-family applying that variable cascade-wide. - src/@core/scss/template/libs/vuetify/_variables.scss: $font-family-custom switched from the historical body font to Inter (vendored edit, narrowly scoped, F6 removes @core/ entirely). - tests/unit/styles/typography.spec.ts: 3-spec regression lock (Tailwind direct stacks, Vuexy SCSS variable, zero historical references in either file). File-content inspection — jsdom does not cascade from imported stylesheets, so getComputedStyle would always pass. Suite delta: 570 → 573 (+3; the prompt's template was +2 but the audit revealed two distinct font-config files, so each gets its own assertion per the prompt's "cover all sites" rule). vue-tsc clean. Scoped ESLint clean. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
94 lines
3.1 KiB
TypeScript
94 lines
3.1 KiB
TypeScript
/**
|
|
* AD-2.5-T1 — typography regression lock (RFC-WS-PRIMEVUE-PLAN-2-5).
|
|
*
|
|
* Reads the font-config sources directly (file-content inspection) rather
|
|
* than relying on getComputedStyle in jsdom — jsdom does not cascade
|
|
* from imported stylesheets, so a runtime check would always pass.
|
|
*
|
|
* Two files are inspected:
|
|
* 1. apps/app/src/assets/styles/tailwind.css — Tailwind v4 @theme
|
|
* --font-sans token + the cascade-level html/body font-family +
|
|
* --crewli-font-family CSS variable.
|
|
* 2. apps/app/src/@core/scss/template/libs/vuetify/_variables.scss —
|
|
* the vendored Vuexy SCSS variable $font-family-custom that feeds
|
|
* Vuetify's $body-font-family on legacy surfaces.
|
|
*
|
|
* If either file is moved, update the path constants below.
|
|
*/
|
|
|
|
import { readFileSync } from 'node:fs'
|
|
import { resolve } from 'node:path'
|
|
import { describe, expect, it } from 'vitest'
|
|
|
|
const TAILWIND_CSS_PATH = resolve(
|
|
__dirname,
|
|
'../../../src/assets/styles/tailwind.css',
|
|
)
|
|
|
|
const VUEXY_VARIABLES_PATH = resolve(
|
|
__dirname,
|
|
'../../../src/@core/scss/template/libs/vuetify/_variables.scss',
|
|
)
|
|
|
|
const tailwindCss = readFileSync(TAILWIND_CSS_PATH, 'utf-8')
|
|
const vuexyVariables = readFileSync(VUEXY_VARIABLES_PATH, 'utf-8')
|
|
|
|
/**
|
|
* Pulls every `font-family: …;` or `--<name>font<name>: …;` declaration
|
|
* from a CSS source. Skips `var(...)` indirections — those are pointers
|
|
* to other declarations that are themselves asserted directly.
|
|
*/
|
|
function fontDeclarations(css: string): string[] {
|
|
// `[^;]+` already accepts leading whitespace; explicit `\s*` between
|
|
// the colon and the value would overlap with it and trip
|
|
// regexp/no-super-linear-backtracking. We `.trim()` later.
|
|
const matches = css.match(/(?:font-family|--[\w-]*font[\w-]*):([^;]+);/gi)
|
|
|
|
return (matches ?? []).filter(decl => !/\bvar\(/.test(decl))
|
|
}
|
|
|
|
function firstFamily(decl: string): string {
|
|
return decl
|
|
.split(':')[1]
|
|
.split(',')[0]
|
|
.trim()
|
|
.replace(/['"]/g, '')
|
|
}
|
|
|
|
describe('Typography regression lock (AD-2.5-T1)', () => {
|
|
it('tailwind.css declares Inter as the first font in every direct stack', () => {
|
|
const decls = fontDeclarations(tailwindCss)
|
|
|
|
expect(decls.length).toBeGreaterThan(0)
|
|
|
|
for (const decl of decls)
|
|
expect(firstFamily(decl).toLowerCase()).toBe('inter')
|
|
})
|
|
|
|
it('Vuexy $font-family-custom declares Inter as the first family', () => {
|
|
// SCSS variable shape — `$font-family-custom: "Inter", …;` (spans
|
|
// two lines in the source; the regex eats the value up to the `;`).
|
|
const match = vuexyVariables.match(
|
|
|
|
// Same backtracking-avoidance as fontDeclarations above: drop \s*.
|
|
/\$font-family-custom:([^;]+);/i,
|
|
)
|
|
|
|
expect(match).not.toBeNull()
|
|
|
|
const family = match![1]
|
|
.split(',')[0]
|
|
.trim()
|
|
.replace(/['"]/g, '')
|
|
|
|
expect(family.toLowerCase()).toBe('inter')
|
|
})
|
|
|
|
it('no Public Sans reference survives in either font-config file', () => {
|
|
expect(tailwindCss).not.toMatch(/Public Sans/i)
|
|
expect(tailwindCss).not.toMatch(/public-sans/i)
|
|
expect(vuexyVariables).not.toMatch(/Public Sans/i)
|
|
expect(vuexyVariables).not.toMatch(/public-sans/i)
|
|
})
|
|
})
|