import { render } from "@testing-library/react";
import { axe } from "vitest-axe";
import { Image } from "../../Image";
import { CarouselPromotions, CarouselPromotionsItem } from "..";

const example = (
  <>
    <CarouselPromotions>
      <CarouselPromotionsItem
        image={
          <Image src={`https://placehold.co/800x150/?text=slide`} alt="Image" />
        }
        title="Akcia za vernosť."
        subtitle="Predĺž si svoj paušál a vyhraj telefón v súťaži."
      />
    </CarouselPromotions>
  </>
);

it("is valid html", () => {
  const { container } = render(example);
  expect(container).toHTMLValidate({
    rules: {
      "no-inline-style": "off",
      "aria-label-misuse": "off",
    },
  });
});

it("is accessible", async () => {
  const { container } = render(example);
  expect(
    await axe(container, {
      rules: { "aria-required-children": { enabled: false } },
    }),
  ).toHaveNoViolations();
});