import { renderToStaticMarkup } from "react-dom/server";
import { describe, expect, it } from "vitest";

import { CommercialActionCard } from "../commercial-action-card";

describe("CommercialActionCard", () => {
  it("renders a private-zone offer with a usable CTA", () => {
    const html = renderToStaticMarkup(
      <CommercialActionCard
        action={{
          actionId: "action-1",
          type: "privateAlbumOffer",
          copy: "There are more private photos waiting for you.",
          ctaLabel: "Open private zone",
          target: "privateZone",
          ruleId: "private_album_after_appearance_praise",
        }}
      />,
    );

    expect(html).toContain('data-commercial-action="privateAlbumOffer"');
    expect(html).toContain("There are more private photos waiting for you.");
    expect(html).toContain("Open private zone");
    expect(html).toContain('aria-label="Dismiss offer"');
  });

  it("renders a consent-first discount action without a checkout URL", () => {
    const html = renderToStaticMarkup(
      <CommercialActionCard
        action={{
          actionId: "offer-1",
          type: "discountOffer",
          copy: "Want me to ask for my best private offer?",
          ctaLabel: "Yes, ask for me",
          target: "discountConsent",
          ruleId: "discount_after_price_objection",
        }}
      />,
    );

    expect(html).toContain('data-commercial-action="discountOffer"');
    expect(html).toContain("Yes, ask for me");
    expect(html).not.toContain("/subscription");
  });
});