pleno-vue/tests/unit/configuration-secret-key.spec.js

// @vitest-environment jsdom

import { flushPromises, mount } from "@vue/test-utils";
import { afterEach, describe, expect, it, vi } from "vitest";

vi.mock("vue-i18n", () => ({
  useI18n: () => ({
    t: (key, fallback) => (typeof fallback === "string" ? fallback : key),
  }),
}));

const parseError = vi.fn();
const getError = vi.fn();
vi.mock("@/components/request/HandleGlobalError.vue", () => ({
  parseError: (...args) => parseError(...args),
  getError: (...args) => getError(...args),
}));

import ConfigurationSecretKey from "@/components/displays/superuser/configuration/ConfigurationSecretKey.vue";

const findSaveButton = (wrapper) => wrapper.findAll("a.button").find((b) => b.find("i.fa-save").exists());
const findEditButton = (wrapper) => wrapper.findAll("a.button").find((b) => b.find("i.fa-edit").exists());

const mountKey = (props = {}) =>
  mount(ConfigurationSecretKey, {
    props: {
      title: "API key",
      description: "desc",
      ...props,
    },
  });

describe("ConfigurationSecretKey", () => {
  afterEach(() => {
    vi.clearAllMocks();
  });

  it("shows the warning when not set, hidden view when set", () => {
    const unset = mountKey({ isSet: false });
    expect(unset.find(".message.is-warning").exists()).toBe(true);
    const setWrapper = mountKey({ isSet: true });
    expect(setWrapper.find(".message.is-warning").exists()).toBe(false);
    expect(setWrapper.find('input[value="Hidden"]').exists()).toBe(true);
  });

  it("emits 'saved' after a successful onSave and exits edit mode", async () => {
    const onSave = vi.fn().mockResolvedValue({ ok: true });
    const wrapper = mountKey({ onSave, isSet: false });
    // The input is disabled until the user enters edit mode — click Edit first,
    // then type, then Save. This matches the production UX for ConfigurationXLVask.
    await findEditButton(wrapper).trigger("click");
    await wrapper.find('input[type="text"]').setValue("super-secret");
    await findSaveButton(wrapper).trigger("click");
    await flushPromises();
    expect(onSave).toHaveBeenCalledWith("super-secret");
    expect(wrapper.emitted("saved")).toBeTruthy();
    expect(wrapper.emitted("saved").length).toBe(1);
    expect(wrapper.emitted("saved")[0][0]).toEqual(expect.objectContaining({ value: "super-secret" }));
    // Edit mode exited — the Save button is gone, the Edit button is back.
    expect(findSaveButton(wrapper)).toBeUndefined();
    expect(findEditButton(wrapper).exists()).toBe(true);
    // Whether the "Hidden" view shows after a save depends on the parent updating
    // isSet; that's the caller's responsibility and is exercised in the
    // ConfigurationXLVask end-to-end coverage.
  });

  it("stays in edit mode and surfaces the error when onSave rejects", async () => {
    const failure = new Error("boom");
    const onSave = vi.fn().mockRejectedValue(failure);
    getError.mockReturnValue("boom");
    const wrapper = mountKey({ onSave, isSet: false });
    await findEditButton(wrapper).trigger("click");
    await wrapper.find('input[type="text"]').setValue("super-secret");
    await findSaveButton(wrapper).trigger("click");
    await flushPromises();
    expect(onSave).toHaveBeenCalledWith("super-secret");
    expect(wrapper.emitted("saved")).toBeFalsy();
    expect(parseError).toHaveBeenCalledWith(failure, expect.any(String));
    // Edit mode preserved so the user can retry.
    expect(findSaveButton(wrapper).exists()).toBe(true);
    expect(wrapper.find(".help.is-danger").exists()).toBe(true);
  });

  it("renders localized warning message instead of hardcoded English", () => {
    // useI18n mock returns the fallback for any unknown key, so the warning body
    // should reflect whatever the caller passed via the i18n key fallback path.
    const wrapper = mountKey({ isSet: false });
    const body = wrapper.find(".message.is-warning .message-body").text();
    expect(body).toContain("The secret key is not set");
  });
});