import { expect, test } from "@playwright/test";

function parseRgb(value: string) {
  const match = value.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
  expect(match).not.toBeNull();

  return {
    red: Number(match?.[1] ?? 0),
    green: Number(match?.[2] ?? 0),
    blue: Number(match?.[3] ?? 0),
  };
}

function relativeLuminance({ red, green, blue }: ReturnType<typeof parseRgb>) {
  const [r, g, b] = [red, green, blue].map((channel) => {
    const value = channel / 255;
    return value <= 0.03928 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4;
  });

  return 0.2126 * r + 0.7152 * g + 0.0722 * b;
}

test("uses the light theme as the default UI foundation", async ({ page }) => {
  await page.goto("/login");

  const colors = await page.evaluate(() => {
    const styles = window.getComputedStyle(document.body);
    return {
      backgroundColor: styles.backgroundColor,
      color: styles.color,
    };
  });

  expect(relativeLuminance(parseRgb(colors.backgroundColor))).toBeGreaterThan(
    0.9,
  );
  expect(relativeLuminance(parseRgb(colors.color))).toBeLessThan(0.1);
});
