import { chromium } from "playwright";
const b = await chromium.launch({
  headless: true,
  args: ["--host-resolver-rules=MAP canvas.flow-master.ai 65.21.71.186", "--ignore-certificate-errors"],
});
const ctx = await b.newContext({ viewport: { width: 1440, height: 900 } });
const p = await ctx.newPage();
await p.goto("https://canvas.flow-master.ai/", { waitUntil: "networkidle" });
await p.waitForTimeout(1500);
// Get the computed --bp-paper at root
console.log("html dataset.theme:", await p.evaluate(() => document.documentElement.dataset.theme));
console.log("--bp-paper (root):", await p.evaluate(() => getComputedStyle(document.documentElement).getPropertyValue("--bp-paper")));
console.log("body background:", await p.evaluate(() => getComputedStyle(document.body).backgroundColor));

// Force toggle data-theme via JS
await p.evaluate(() => document.documentElement.dataset.theme = "dark");
await p.waitForTimeout(200);
console.log("after force dark:");
console.log("  --bp-paper:", await p.evaluate(() => getComputedStyle(document.documentElement).getPropertyValue("--bp-paper")));
console.log("  body bg:", await p.evaluate(() => getComputedStyle(document.body).backgroundColor));

await p.evaluate(() => document.documentElement.dataset.theme = "light");
await p.waitForTimeout(200);
console.log("after force light:");
console.log("  --bp-paper:", await p.evaluate(() => getComputedStyle(document.documentElement).getPropertyValue("--bp-paper")));
console.log("  body bg:", await p.evaluate(() => getComputedStyle(document.body).backgroundColor));

await b.close();