// @vitest-environment jsdom

import { beforeEach, describe, expect, it } from "vitest";
import "./_setup";
import { resetChromeMock } from "./_setup";
import { createSmartGenerator } from "./inject";

describe("inline password and passphrase generator", () => {
  beforeEach(() => {
    resetChromeMock();
    document.body.innerHTML = "";
  });

  it("uses a 256-character password range and a five-word passphrase default", () => {
    const generator = createSmartGenerator({ policy: {} });
    document.body.appendChild(generator.root);

    const slider = generator.root.querySelector<HTMLInputElement>('input[type="range"]')!;
    expect(slider.max).toBe("256");

    const passphrase = Array.from(generator.root.querySelectorAll("button"))
      .find((button) => button.textContent === "passphrase")!;
    passphrase.click();

    expect(slider.min).toBe("4");
    expect(slider.max).toBe("12");
    expect(slider.value).toBe("5");
    expect(slider.getAttribute("aria-label")).toBe("Word count");
    expect(generator.getPassword().split("-")).toHaveLength(5);
  });

  it("generates twelve words with the selected separator", () => {
    const generator = createSmartGenerator({ policy: {} });
    document.body.appendChild(generator.root);
    const buttons = Array.from(generator.root.querySelectorAll("button"));
    buttons.find((button) => button.textContent === "passphrase")!.click();
    buttons.find((button) => button.textContent === ".")!.click();

    const slider = generator.root.querySelector<HTMLInputElement>('input[type="range"]')!;
    slider.value = "12";
    slider.dispatchEvent(new Event("input"));

    expect(generator.getPassword().split(".")).toHaveLength(12);
  });
});