import { useState } from "react";
import { afterEach, expect, it, vi } from "vitest";
import {
  cleanup,
  fireEvent,
  render,
  screen,
  waitFor,
} from "@testing-library/react";
import { Ui正文编辑器 } from "../../src/界面/编辑器/正文编辑器";
import * as adapter from "../../src/界面/编辑器/文档适配";
afterEach(() => {
  cleanup();
  vi.restoreAllMocks();
});
// @muse-case {"case_id": "O01-editor-document-transaction", "environment": "离线组件测试", "given": "正文编辑器一次输入事务", "when": "组件重绘与光标移动", "then": ["转为正式文档只执行一次", "初始转换不受影响"], "contract": "docs/系统架构/新版设计/工作台设计.md"}
it("O01-editor-document-transaction：一次正文事务只转一次正式文档，组件重绘及光标移动不转正文", async () => {
  const convert = vi.spyOn(adapter, "转为正文快照"),
    initial = vi.spyOn(adapter, "转为编辑文档");
  const changes = vi.fn();
  function Editor() {
    const [draft, setDraft] = useState<adapter.正文草稿>({
      format_version: 1,
      paragraphs: [{ paragraph_id: "p", content: [] }],
    });
    return (
      <Ui正文编辑器
        initial={draft}
        onChange={(value, stats) => {
          changes(value, stats);
          setDraft(value);
        }}
        onComposition={() => {}}
      />
    );
  }
  render(<Editor />);
  const textbox = screen.getByRole("textbox", { name: "章节正文" });
  const paragraph = textbox.querySelector("p")!;
  paragraph.textContent = "新文😀";
  fireEvent.input(textbox, { inputType: "insertText", data: "新文😀" });
  await waitFor(() => expect(changes).toHaveBeenCalledTimes(1));
  expect(convert).toHaveBeenCalledTimes(1);
  expect(initial).toHaveBeenCalledTimes(1);
  expect(changes.mock.calls[0][1]).toEqual({
    visible_text: "新文😀",
    codepoints: 3,
  });
  const selection = window.getSelection()!,
    range = document.createRange();
  range.setStart(paragraph.firstChild!, 1);
  range.collapse(true);
  selection.removeAllRanges();
  selection.addRange(range);
  fireEvent(document, new Event("selectionchange"));
  fireEvent.focus(textbox);
  expect(convert).toHaveBeenCalledTimes(1);
  expect(changes).toHaveBeenCalledTimes(1);
});