import type { Locator, TestInfo } from "@playwright/test";

/** Measure the actual reading surface so density changes can be compared with screenshots. */
export async function captureReadingGeometry(workspace: Locator, testInfo: TestInfo) {
  const geometry = await workspace.evaluate((element) => {
    const scroll = element.querySelector("[data-reading-scroll]")!;
    const metrics = element.querySelector(".answer-ui-stack-comparison")!;
    const chart = element.querySelector('.answer-ui-chart [role="img"]')!;
    const bounds = scroll.getBoundingClientRect();
    return {
      viewportWidth: window.innerWidth,
      readingWidth: Math.round(bounds.width),
      metricsHeight: Math.round(metrics.getBoundingClientRect().height),
      chartOffset: Math.round(chart.getBoundingClientRect().top - bounds.top + scroll.scrollTop),
      horizontalOverflow: document.documentElement.scrollWidth > window.innerWidth,
    };
  });
  await testInfo.attach("reading-geometry", { body: JSON.stringify(geometry, null, 2), contentType: "application/json" });
  return geometry;
}