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

const legacyViews = readFileSync(new URL('../../src/styles/legacy-views.css', import.meta.url), 'utf8');
const layout = readFileSync(new URL('../../src/styles/layout.css', import.meta.url), 'utf8');

describe('Grid and Raw Data typography', () => {
  it('uses the larger readable text size throughout the Grid view', () => {
    expect(legacyViews).toMatch(/\.view-table table\s*\{[^}]*font-size:\s*var\(--fs-lg\);/s);
    expect(legacyViews).toMatch(/\.view-table th\s*\{[^}]*font-size:\s*var\(--fs-lg\);/s);
    expect(legacyViews).toMatch(/\.view-table td\s*\{[^}]*font-size:\s*var\(--fs-lg\);/s);
  });

  it('uses the larger readable text size in Raw Data regardless of stylesheet order', () => {
    expect(legacyViews).toMatch(/\.raw-view\s*\{[^}]*font-size:\s*var\(--fs-lg\);/s);
    expect(layout).toMatch(/\.raw-view\s*\{[^}]*font:\s*var\(--fs-lg\)\/1\.55 var\(--font-mono\);/s);
  });
});