// @vitest-environment jsdom
// SPEC: PJ2026-010405 云端控制台.
// Implementation reference: draft-2026-07-13-p0-cloud-console.
// Responsibility: 验证 bounded split workspace separator 的 ARIA 合同与键盘宽度调整。

import { mount } from "@vue/test-utils";
import { describe, expect, test, vi } from "vitest";
import SplitWorkspaceLayout from "./SplitWorkspaceLayout.vue";

describe("SplitWorkspaceLayout", () => {
  test("exposes bounded vertical separator values", () => {
    const wrapper = mount(SplitWorkspaceLayout, {
      props: {
        rightOpen: true,
        leftWidth: 28,
        rightWidth: 52,
        minLeftWidth: 18,
        maxLeftWidth: 36,
        minRightWidth: 30,
        maxRightWidth: 70
      }
    });
    const separators = wrapper.findAll("[role='separator']");

    expect(separators).toHaveLength(2);
    expect(separators[0]!.attributes()).toMatchObject({
      tabindex: "0",
      "aria-orientation": "vertical",
      "aria-valuemin": "18",
      "aria-valuemax": "36",
      "aria-valuenow": "28"
    });
    expect(separators[1]!.attributes()).toMatchObject({
      tabindex: "0",
      "aria-orientation": "vertical",
      "aria-valuemin": "30",
      "aria-valuemax": "70",
      "aria-valuenow": "52"
    });
  });

  test("moves each separator by two percentage points with arrow keys", async () => {
    const onLeftWidth = vi.fn();
    const onRightWidth = vi.fn();
    const wrapper = mount(SplitWorkspaceLayout, { props: { rightOpen: true, leftWidth: 30, rightWidth: 50, "onUpdate:leftWidth": onLeftWidth, "onUpdate:rightWidth": onRightWidth } });
    const separators = wrapper.findAll("[role='separator']");

    await separators[0]!.trigger("keydown", { key: "ArrowRight" });
    await separators[1]!.trigger("keydown", { key: "ArrowLeft" });

    expect(onLeftWidth).toHaveBeenCalledWith(32);
    expect(onRightWidth).toHaveBeenCalledWith(52);
  });

  test("clamps keyboard changes and removes collapsed separators from tab order", async () => {
    const onLeftWidth = vi.fn();
    const onRightWidth = vi.fn();
    const wrapper = mount(SplitWorkspaceLayout, {
      props: { rightOpen: true, leftWidth: 18, rightWidth: 70, leftCollapsed: true, rightCollapsed: true, "onUpdate:leftWidth": onLeftWidth, "onUpdate:rightWidth": onRightWidth }
    });
    const separators = wrapper.findAll("[role='separator']");

    expect(separators[0]!.attributes("tabindex")).toBe("-1");
    expect(separators[1]!.attributes("tabindex")).toBe("-1");

    await wrapper.setProps({ leftCollapsed: false, rightCollapsed: false });
    await separators[0]!.trigger("keydown", { key: "ArrowLeft" });
    await separators[1]!.trigger("keydown", { key: "ArrowLeft" });
    expect(onLeftWidth).toHaveBeenCalledWith(18);
    expect(onRightWidth).toHaveBeenCalledWith(70);
  });
});
