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

import { confirmDraftSubmission } from "./feishu-project-full-flow.helpers";

test.use({
  launchOptions: {
    executablePath: "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
  },
});

test("confirm draft submission prefers the visible card button", async ({ page }) => {
  await page.setContent(`
    <main>
      <button id="confirm-button" type="button">确认</button>
      <div
        id="composer"
        contenteditable="true"
        style="margin-top: 24px; min-height: 24px; border: 1px solid #ccc;"
      ></div>
    </main>
    <script>
      window.__confirmClicks = 0;
      window.__sentMessages = [];
      document.getElementById("confirm-button")?.addEventListener("click", () => {
        window.__confirmClicks += 1;
      });
      const composer = document.getElementById("composer");
      composer?.addEventListener("keydown", (event) => {
        if (event.key !== "Enter") {
          return;
        }
        event.preventDefault();
        const text = composer.textContent || "";
        window.__sentMessages.push(text);
        composer.textContent = "";
      });
    </script>
  `);

  const mode = await confirmDraftSubmission(page, {
    sendShortcut: "Enter",
    workItemId: 705,
  });

  expect(mode).toBe("card_button_then_text_message");
  await expect.poll(() => page.evaluate(() => window.__confirmClicks ?? 0)).toBe(1);
  await expect.poll(() => page.evaluate(() => window.__sentMessages ?? [])).toEqual([
    "work_item #705 确认",
  ]);
});

test("confirm draft submission falls back to text when no card button is visible", async ({ page }) => {
  await page.setContent(`
    <main>
      <div
        id="composer"
        contenteditable="true"
        style="margin-top: 24px; min-height: 24px; border: 1px solid #ccc;"
      ></div>
      <pre id="sent-output"></pre>
    </main>
    <script>
      window.__sentMessages = [];
      const composer = document.getElementById("composer");
      const sentOutput = document.getElementById("sent-output");
      composer?.addEventListener("keydown", (event) => {
        if (event.key !== "Enter") {
          return;
        }
        event.preventDefault();
        const text = composer.textContent || "";
        window.__sentMessages.push(text);
        sentOutput.textContent = window.__sentMessages.join("\\n");
        composer.textContent = "";
      });
    </script>
  `);

  const mode = await confirmDraftSubmission(page, {
    sendShortcut: "Enter",
    workItemId: 705,
  });

  expect(mode).toBe("text_message");
  await expect.poll(() => page.evaluate(() => window.__sentMessages ?? [])).toEqual([
    "work_item #705 确认",
  ]);
});