pleno-vue/tests/unit/get-order-invoice-pdf-button.spec.js

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

const mocks = vi.hoisted(() => ({
  authenticatedRequest: vi.fn(),
  handleEconomicError: vi.fn(),
}));

vi.mock("@/components/session/authenticatedRequest.vue", () => ({
  authenticatedRequest: mocks.authenticatedRequest,
}));

vi.mock("@/components/request/HandleEconomicError.vue", () => ({
  handleEconomicError: mocks.handleEconomicError,
}));

import GetOrderInvoicePDFButton from "@/components/search/economic/getOrderInvoicePDFButton.vue";

const LoadButtonWhileAwaitStub = {
  props: ["disabled", "loadFunction", "actionKey"],
  template: `
    <button
      type="button"
      :disabled="disabled"
      :data-action-key="actionKey"
      @click="loadFunction"
    >
      <slot />
    </button>
  `,
};

describe("GetOrderInvoicePDFButton", () => {
  beforeEach(() => {
    mocks.authenticatedRequest.mockReset();
    mocks.handleEconomicError.mockReset();
    vi.stubGlobal("open", vi.fn());
  });

  it.each([null, undefined, ""])("disables the PDF download when invoice id is %s", async (invoiceId) => {
    const wrapper = mount(GetOrderInvoicePDFButton, {
      props: {
        invoice_id: invoiceId,
      },
      global: {
        stubs: {
          LoadButtonWhileAwait: LoadButtonWhileAwaitStub,
        },
      },
    });

    const button = wrapper.get('[data-action-key="economic-invoice-pdf-download"]');
    expect(button.attributes("disabled")).toBeDefined();

    await button.trigger("click");
    await flushPromises();

    expect(mocks.authenticatedRequest).not.toHaveBeenCalled();
    expect(window.open).not.toHaveBeenCalled();
  });

  it("requests and opens the invoice PDF when invoice id exists", async () => {
    mocks.authenticatedRequest.mockResolvedValue({
      data: {
        data: {
          url: "https://pdf.example.test/invoices/99101.pdf",
        },
      },
    });

    const wrapper = mount(GetOrderInvoicePDFButton, {
      props: {
        invoice_id: 99101,
      },
      global: {
        stubs: {
          LoadButtonWhileAwait: LoadButtonWhileAwaitStub,
        },
      },
    });

    const button = wrapper.get('[data-action-key="economic-invoice-pdf-download"]');
    expect(button.attributes("disabled")).toBeUndefined();

    await button.trigger("click");
    await flushPromises();

    expect(mocks.authenticatedRequest).toHaveBeenCalledWith("/invoices/pdf", "GET", {
      id: 99101,
    });
    expect(window.open).toHaveBeenCalledWith("https://pdf.example.test/invoices/99101.pdf", "_blank");
  });
});