import { expect } from "e2e";
import { test, WEB } from "./t3.ts";

test("Mod+B respects the remapped sidebar shortcut in the rich text composer", WEB, async ({ t3, app, screen, browser }) => {
  await t3.project("Composer shortcut demo");
  await t3.open();
  await screen.getByTestId("composer-editor").waitFor({ state: "visible" });
  await app.open("/settings/chat");
  await screen.getByRole("switch", "Rich text composer").check();
  await app.open("/settings/keybindings");
  await screen.getByRole("button", { name: /Edit shortcut for Sidebar: Toggle:/i }).tap();
  await browser.keyboard.press("Alt+b");
  await screen.getByRole("button", "Save", { exact: true }).tap();
  await app.screenshot("sidebar-remapped-to-alt-b");
  await app.open("/");
  const editor = browser.locator('[contenteditable="true"][role="textbox"]');
  await editor.tap();
  await browser.keyboard.type("x");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.type("y");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.type("z");
  await app.screenshot("remapped-collapsed-xyz");
  await expect.soft(browser.locator('[data-slot="sidebar-wrapper"]')).toHaveAttribute("data-sidebar-state", "expanded");
  await expect.soft(browser.locator('[contenteditable="true"][role="textbox"] strong')).toHaveText("y");
  await browser.keyboard.press("Control+a");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.press("ArrowRight");
  await app.screenshot("remapped-selection-bold");
  await expect.soft(browser.locator('[contenteditable="true"][role="textbox"] strong')).toHaveText("xyz");
  await browser.keyboard.press("Control+a");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.press("Backspace");
  await app.open("/settings/keybindings");
  await screen.getByRole("button", { name: /Edit shortcut for Sidebar: Toggle:/i }).tap();
  await browser.keyboard.press("Control+b");
  await screen.getByRole("button", "Save", { exact: true }).tap();
  await app.open("/");
  await editor.tap();
  await browser.keyboard.press("Control+a");
  await browser.keyboard.press("Backspace");
  await browser.keyboard.type("x");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.type("y");
  await app.screenshot("default-binding-sidebar-toggled");
  await expect.soft(browser.locator('[data-slot="sidebar-wrapper"]')).toHaveAttribute("data-sidebar-state", "collapsed");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.type("z");
  await app.screenshot("default-binding-xyz-plain");
  await expect.soft(browser.locator('[contenteditable="true"][role="textbox"] strong')).toHaveCount(0);
  await browser.keyboard.press("Control+a");
  await browser.keyboard.press("Control+b");
  await browser.keyboard.press("ArrowRight");
  await app.screenshot("default-selection-bold");
  await expect.soft(browser.locator('[contenteditable="true"][role="textbox"] strong')).toHaveText("xyz");
});
