banner_studio/packages/layout-engine/test/dropflow-wrapper.test.ts

import { beforeAll, describe, expect, it } from 'vitest';
import { measureText } from '../src/index.js';
import { ensureEngineReady } from './_setup.js';
import type { TypographySpec } from '@banner-studio/types';

const typography: TypographySpec = {
  font_family: 'Inter',
  font_size: 16,
  font_weight: 400,
  line_height: 1.3,
  color: '#000000',
  text_align: 'left'
};

describe('dropflow-wrapper / measureText', () => {
  beforeAll(async () => {
    await ensureEngineReady();
  });

  it('returns positive width and height for a short single-line string', () => {
    const m = measureText({ text: 'Hello world', typography, max_width: 300 });
    expect(m.width).toBeGreaterThan(0);
    expect(m.height).toBeGreaterThan(0);
    expect(m.line_count).toBeGreaterThanOrEqual(1);
  });

  it('wraps text to multiple lines when max_width is small', () => {
    const long =
      'The quick brown fox jumps over the lazy dog and keeps on running into the distance.';
    const wide = measureText({ text: long, typography, max_width: 500 });
    const narrow = measureText({ text: long, typography, max_width: 100 });
    expect(narrow.line_count).toBeGreaterThan(wide.line_count);
    expect(narrow.height).toBeGreaterThan(wide.height);
  });

  it('measures larger text as taller', () => {
    const small = measureText({ text: 'Test', typography, max_width: 300 });
    const big = measureText({
      text: 'Test',
      typography: { ...typography, font_size: 32 },
      max_width: 300
    });
    expect(big.height).toBeGreaterThan(small.height);
  });
});