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 compact structured-data roles throughout the Grid view', () => {
    expect(legacyViews).toMatch(/\.view-table table\s*\{[^}]*font-size:\s*var\(--type-table-body-size\);/s);
    expect(legacyViews).toMatch(/\.view-table th\s*\{[^}]*font-size:\s*var\(--type-table-head-size\);/s);
    expect(legacyViews).toMatch(/\.view-table td\s*\{[^}]*font-size:\s*var\(--type-table-body-size\);/s);
  });

  it('uses the compact structured-data role in Raw Data regardless of stylesheet order', () => {
    expect(legacyViews).toMatch(/\.raw-view\s*\{[^}]*font-size:\s*var\(--type-table-body-size\);/s);
    expect(layout).toMatch(/\.raw-view\s*\{[^}]*font:\s*var\(--type-table-body-size\)\/1\.55 var\(--font-mono\);/s);
  });
});