import { describe, it, expect } from 'vitest';
import { readFileSync } from 'node:fs';
import { resolve } from 'node:path';

// Guards against components referencing design tokens that were never
// declared. `var(--x)` with no declaration silently falls through to the
// inherited/initial value, so a typo'd or missing token degrades quietly
// rather than failing loudly. These two were referenced by components
// (RecommendationShelf, the manga detail page) but absent from tokens.css.

const TOKENS = readFileSync(resolve(process.cwd(), 'src/lib/styles/tokens.css'), 'utf8');

// Every design token must be declared at least once (in :root and/or a theme
// override). We only assert declaration, not value.
function declares(name: string): boolean {
    return new RegExp(`${name}\\s*:`).test(TOKENS);
}

describe('design tokens', () => {
    it('declares --font-md (referenced by RecommendationShelf)', () => {
        expect(declares('--font-md')).toBe(true);
    });

    it('declares --success-soft-bg (referenced by the manga detail page)', () => {
        expect(declares('--success-soft-bg')).toBe(true);
    });

    it('declares --success-soft-bg in the dark theme override too', () => {
        const darkBlock = TOKENS.slice(TOKENS.indexOf("[data-theme='dark']"));
        expect(/--success-soft-bg\s*:/.test(darkBlock)).toBe(true);
    });
});
