@allurereport/web-awesome 3.0.0-beta.9 → 3.0.1

package/test/components/Header/CiInfo.test.tsx

@@ -0,0 +1,177 @@
+import { CiType } from "@allurereport/core-api";
+import { getReportOptions } from "@allurereport/web-commons";
+import { cleanup, render, screen } from "@testing-library/preact";
+import { h } from "preact";
+import { type Mock, beforeEach, describe, expect, it, vi } from "vitest";
+import { CiInfo } from "@/components/Header/CiInfo";
+
+const fixtures = {
+  pullRequestUrl: "https://github.com/repo/pull/123",
+  jobUrl: "https://github.com/repo/actions/runs/123",
+  jobRunUrl: "https://github.com/repo/actions/runs/123/jobs/456",
+  pullRequestName: "PR #123",
+  jobName: "Build Job",
+  jobRunName: "Run #456",
+};
+
+vi.mock("@allurereport/web-components", async () => {
+  const { CiType } = await import("@allurereport/core-api");
+
+  return {
+    Text: (props: { children: string }) => <span>{props.children}</span>,
+    SvgIcon: (props: { id: string; size?: string }) => <span data-testid="icon">{props.id}</span>,
+    allureIcons: {
+      amazon: "amazon",
+      azure: "azure",
+      bitbucket: "bitbucket",
+      circleci: "circle",
+      drone: "drone",
+      github: "github",
+      gitlab: "gitlab",
+      jenkins: "jenkins",
+    },
+  };
+});
+vi.mock("@allurereport/web-commons", async (importOriginal) => {
+  return {
+    ...(await importOriginal()),
+    getReportOptions: vi.fn(),
+  };
+});
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  cleanup();
+});
+
+describe("components > Header > CiInfo", () => {
+  it("should render well-known CI icon", () => {
+    const ciTypes: CiType[] = [
+      CiType.Amazon,
+      CiType.Azure,
+      CiType.Bitbucket,
+      CiType.Circle,
+      CiType.Drone,
+      CiType.Github,
+      CiType.Gitlab,
+      CiType.Jenkins,
+    ];
+
+    for (const type of ciTypes) {
+      (getReportOptions as Mock).mockReturnValueOnce({
+        ci: {
+          pullRequestUrl: fixtures.pullRequestUrl,
+          type,
+        },
+      });
+
+      cleanup();
+      render(<CiInfo />);
+
+      expect(screen.getByTestId("icon")).toHaveTextContent(type);
+    }
+  });
+
+  it("shouldn't render icon for unknown CI", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        type: undefined,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.queryByTestId("icon")).not.toBeInTheDocument();
+  });
+
+  it("should render there is no link to use", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {},
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.queryByRole("link")).not.toBeInTheDocument();
+  });
+
+  it("should presence pull request url as href when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        pullRequestUrl: fixtures.pullRequestUrl,
+        jobUrl: fixtures.jobUrl,
+        jobRunUrl: fixtures.jobRunUrl,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveAttribute("href", fixtures.pullRequestUrl);
+  });
+
+  it("should presence use job run url as href when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        jobUrl: fixtures.jobUrl,
+        jobRunUrl: fixtures.jobRunUrl,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveAttribute("href", fixtures.jobRunUrl);
+  });
+
+  it("should use job url as href when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        jobRunUrl: fixtures.jobRunUrl,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveAttribute("href", fixtures.jobRunUrl);
+  });
+
+  it("should presence pull request name as text when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        pullRequestUrl: fixtures.pullRequestUrl,
+        pullRequestName: fixtures.pullRequestName,
+        jobName: fixtures.jobName,
+        jobRunName: fixtures.jobRunName,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveTextContent(fixtures.pullRequestName);
+  });
+
+  it("should presence job run name as text when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        jobUrl: fixtures.jobUrl,
+        jobName: fixtures.jobName,
+        jobRunName: fixtures.jobRunName,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveTextContent(fixtures.jobRunName);
+  });
+
+  it("should presence job name as text when provided", () => {
+    (getReportOptions as Mock).mockReturnValueOnce({
+      ci: {
+        jobRunUrl: fixtures.jobRunUrl,
+        jobRunName: fixtures.jobRunName,
+      },
+    });
+
+    render(<CiInfo />);
+
+    expect(screen.getByRole("link")).toHaveTextContent(fixtures.jobRunName);
+  });
+});

package/test/components/Header.test.tsx

@@ -0,0 +1,122 @@
+import { getReportOptions } from "@allurereport/web-commons";
+import { cleanup, render, screen } from "@testing-library/preact";
+import { Mock, beforeEach, describe, expect, it, vi } from "vitest";
+import { Header } from "@/components/Header";
+import { CiInfo } from "@/components/Header/CiInfo";
+import { route } from "@/stores/router";
+import { availableSections } from "@/stores/sections";
+
+const fixtures = {
+  ci: {
+    type: "github",
+  },
+};
+
+vi.mock("@allurereport/web-commons", () => ({
+  getReportOptions: vi.fn().mockReturnValue({}),
+}));
+vi.mock("@/stores/router", async () => {
+  const { signal } = await import("@preact/signals");
+
+  return {
+    route: signal({}),
+  };
+});
+vi.mock("@/stores/sections", async () => {
+  const { signal } = await import("@preact/signals");
+
+  return {
+    availableSections: signal([]),
+  };
+});
+vi.mock("@/components/HeaderControls", () => ({
+  HeaderControls: () => <div data-testid="header-controls"></div>,
+}));
+vi.mock("@/components/SectionPicker", () => ({
+  SectionPicker: () => <div data-testid="section-picker"></div>,
+}));
+vi.mock("@/components/TestResult/TrHeader/TrBreadcrumbs", () => ({
+  TrBreadcrumbs: () => <div data-testid="breadcrumbs"></div>,
+}));
+vi.mock("@/components/Header/CiInfo", () => ({
+  // CiInfo: vi.fn().mockReturnValue(<div data-testid="ci-info"></div>),
+  CiInfo: vi.fn().mockImplementation(() => <div data-testid="ci-info"></div>),
+}));
+
+beforeEach(() => {
+  vi.clearAllMocks();
+  cleanup();
+  route.value = {};
+  availableSections.value = [];
+});
+
+describe("components > Header", () => {
+  it("should render sections picker when there are sections available", () => {
+    availableSections.value = ["section1", "section2"];
+
+    render(<Header />);
+
+    expect(screen.getByTestId("section-picker")).toBeInTheDocument();
+  });
+
+  it("shouldn't render sections picker when there are no sections available", () => {
+    render(<Header />);
+
+    expect(screen.queryByTestId("section-picker")).not.toBeInTheDocument();
+  });
+
+  it("should render ci info only when testResultId route parameter doesn't exists and ci report option is available", () => {
+    route.value = {
+      params: {},
+    };
+    (getReportOptions as Mock).mockReturnValue({
+      ci: fixtures.ci,
+    });
+
+    render(<Header />);
+
+    expect(CiInfo).toHaveBeenCalled();
+    expect(screen.getByTestId("ci-info")).toBeInTheDocument();
+  });
+
+  it("shouldn't render ci info when testResultId route parameter exists", () => {
+    route.value = {
+      params: {
+        testResultId: "1",
+      },
+    };
+    (getReportOptions as Mock).mockReturnValue({
+      ci: fixtures.ci,
+    });
+
+    render(<Header />);
+
+    expect(CiInfo).not.toHaveBeenCalled();
+    expect(screen.queryByTestId("ci-info")).not.toBeInTheDocument();
+  });
+
+  it("should render breadcrumbs when testResultId route parameter exists", () => {
+    route.value = {
+      params: {
+        testResultId: "1",
+      },
+    };
+    (getReportOptions as Mock).mockReturnValue({
+      ci: fixtures.ci,
+    });
+
+    render(<Header />);
+
+    expect(screen.getByTestId("breadcrumbs")).toBeInTheDocument();
+  });
+
+  it("shouldn't render breadcrumbs when testResultId route parameter doesn't exists", () => {
+    route.value = {
+      params: {},
+    };
+
+    render(<Header />);
+
+    expect(screen.queryByTestId("breadcrumbs")).not.toBeInTheDocument();
+  });
+});

package/test/stores/treeFilters.test.ts

@@ -0,0 +1,302 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import {
+  clearTreeFilters,
+  setTestTypeFilter,
+  setTransitionFilter,
+  setTreeDirection,
+  setTreeQuery,
+  setTreeSortBy,
+  setTreeStatus,
+  treeDirection,
+  treeFilter,
+  treeQuery,
+  treeSortBy,
+  treeStatus,
+} from "@/stores/treeFilters";
+
+const defaultFilter = {
+  flaky: false,
+  retry: false,
+  new: false,
+  fixed: false,
+  regressed: false,
+  malfunctioned: false,
+};
+
+describe("stores > treeFilters", () => {
+  beforeEach(() => {
+    // Reset all signals to default state before each test
+    treeQuery.value = "";
+    treeStatus.value = "total";
+    treeSortBy.value = "order";
+    treeDirection.value = "asc";
+    treeFilter.value = { ...defaultFilter };
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+  });
+
+  describe("clearTreeFilters", () => {
+    it("should reset query, status and filters to default state", () => {
+      // Set some non-default values
+      treeQuery.value = "test query";
+      treeStatus.value = "passed";
+      treeFilter.value = {
+        flaky: true,
+        retry: true,
+        new: true,
+        fixed: true,
+        regressed: true,
+        malfunctioned: true,
+      };
+
+      clearTreeFilters();
+
+      expect(treeQuery.value).toBe("");
+      expect(treeStatus.value).toBe("total");
+      expect(treeFilter.value).toEqual(defaultFilter);
+    });
+
+    it("should not reset sortBy and direction", () => {
+      treeSortBy.value = "duration";
+      treeDirection.value = "desc";
+
+      clearTreeFilters();
+
+      expect(treeSortBy.value).toBe("duration");
+      expect(treeDirection.value).toBe("desc");
+    });
+  });
+
+  describe("setTreeQuery", () => {
+    it("should update query", () => {
+      setTreeQuery("search term");
+
+      expect(treeQuery.value).toBe("search term");
+    });
+
+    it("should update query to empty string", () => {
+      treeQuery.value = "some query";
+
+      setTreeQuery("");
+
+      expect(treeQuery.value).toBe("");
+    });
+  });
+
+  describe("setTreeStatus", () => {
+    it("should update status to passed", () => {
+      setTreeStatus("passed");
+
+      expect(treeStatus.value).toBe("passed");
+    });
+
+    it("should update status to failed", () => {
+      setTreeStatus("failed");
+
+      expect(treeStatus.value).toBe("failed");
+    });
+
+    it("should update status to broken", () => {
+      setTreeStatus("broken");
+
+      expect(treeStatus.value).toBe("broken");
+    });
+
+    it("should update status to skipped", () => {
+      setTreeStatus("skipped");
+
+      expect(treeStatus.value).toBe("skipped");
+    });
+
+    it("should update status to total", () => {
+      treeStatus.value = "passed";
+
+      setTreeStatus("total");
+
+      expect(treeStatus.value).toBe("total");
+    });
+  });
+
+  describe("setTreeSortBy", () => {
+    it("should update sortBy to duration", () => {
+      setTreeSortBy("duration");
+
+      expect(treeSortBy.value).toBe("duration");
+    });
+
+    it("should update sortBy to status", () => {
+      setTreeSortBy("status");
+
+      expect(treeSortBy.value).toBe("status");
+    });
+
+    it("should update sortBy to alphabet", () => {
+      setTreeSortBy("alphabet");
+
+      expect(treeSortBy.value).toBe("alphabet");
+    });
+
+    it("should update sortBy to order", () => {
+      treeSortBy.value = "duration";
+
+      setTreeSortBy("order");
+
+      expect(treeSortBy.value).toBe("order");
+    });
+  });
+
+  describe("setTreeDirection", () => {
+    it("should update direction to desc", () => {
+      setTreeDirection("desc");
+
+      expect(treeDirection.value).toBe("desc");
+    });
+
+    it("should update direction to asc", () => {
+      treeDirection.value = "desc";
+
+      setTreeDirection("asc");
+
+      expect(treeDirection.value).toBe("asc");
+    });
+  });
+
+  describe("setTestTypeFilter", () => {
+    it("should enable flaky filter", () => {
+      setTestTypeFilter("flaky", true);
+
+      expect(treeFilter.value.flaky).toBe(true);
+    });
+
+    it("should disable flaky filter", () => {
+      treeFilter.value = { ...defaultFilter, flaky: true };
+
+      setTestTypeFilter("flaky", false);
+
+      expect(treeFilter.value.flaky).toBe(false);
+    });
+
+    it("should enable retry filter", () => {
+      setTestTypeFilter("retry", true);
+
+      expect(treeFilter.value.retry).toBe(true);
+    });
+
+    it("should disable retry filter", () => {
+      treeFilter.value = { ...defaultFilter, retry: true };
+
+      setTestTypeFilter("retry", false);
+
+      expect(treeFilter.value.retry).toBe(false);
+    });
+
+    it("should enable both flaky and retry filters independently", () => {
+      setTestTypeFilter("flaky", true);
+      setTestTypeFilter("retry", true);
+
+      expect(treeFilter.value.flaky).toBe(true);
+      expect(treeFilter.value.retry).toBe(true);
+    });
+
+    it("should not affect transition filters", () => {
+      treeFilter.value = { ...defaultFilter, new: true };
+
+      setTestTypeFilter("flaky", true);
+
+      expect(treeFilter.value.new).toBe(true);
+      expect(treeFilter.value.flaky).toBe(true);
+    });
+  });
+
+  describe("setTransitionFilter", () => {
+    it("should enable new filter", () => {
+      setTransitionFilter("new", true);
+
+      expect(treeFilter.value.new).toBe(true);
+    });
+
+    it("should enable fixed filter", () => {
+      setTransitionFilter("fixed", true);
+
+      expect(treeFilter.value.fixed).toBe(true);
+    });
+
+    it("should enable regressed filter", () => {
+      setTransitionFilter("regressed", true);
+
+      expect(treeFilter.value.regressed).toBe(true);
+    });
+
+    it("should enable malfunctioned filter", () => {
+      setTransitionFilter("malfunctioned", true);
+
+      expect(treeFilter.value.malfunctioned).toBe(true);
+    });
+
+    it("should disable the previous transition when enabling a new one", () => {
+      setTransitionFilter("new", true);
+      expect(treeFilter.value.new).toBe(true);
+
+      setTransitionFilter("fixed", true);
+
+      expect(treeFilter.value.new).toBe(false);
+      expect(treeFilter.value.fixed).toBe(true);
+      expect(treeFilter.value.regressed).toBe(false);
+      expect(treeFilter.value.malfunctioned).toBe(false);
+    });
+
+    it("should disable all other transitions when enabling regressed", () => {
+      treeFilter.value = { ...defaultFilter, new: true, fixed: true };
+
+      setTransitionFilter("regressed", true);
+
+      expect(treeFilter.value.new).toBe(false);
+      expect(treeFilter.value.fixed).toBe(false);
+      expect(treeFilter.value.regressed).toBe(true);
+      expect(treeFilter.value.malfunctioned).toBe(false);
+    });
+
+    it("should allow only one transition to be enabled at a time", () => {
+      setTransitionFilter("new", true);
+      setTransitionFilter("fixed", true);
+      setTransitionFilter("regressed", true);
+      setTransitionFilter("malfunctioned", true);
+
+      expect(treeFilter.value.new).toBe(false);
+      expect(treeFilter.value.fixed).toBe(false);
+      expect(treeFilter.value.regressed).toBe(false);
+      expect(treeFilter.value.malfunctioned).toBe(true);
+    });
+
+    it("should disable the transition when value is false", () => {
+      treeFilter.value = { ...defaultFilter, new: true };
+
+      setTransitionFilter("new", false);
+
+      expect(treeFilter.value.new).toBe(false);
+    });
+
+    it("should disable all transitions when disabling the active one", () => {
+      setTransitionFilter("fixed", true);
+
+      setTransitionFilter("fixed", false);
+
+      expect(treeFilter.value.new).toBe(false);
+      expect(treeFilter.value.fixed).toBe(false);
+      expect(treeFilter.value.regressed).toBe(false);
+      expect(treeFilter.value.malfunctioned).toBe(false);
+    });
+
+    it("should not affect test type filters (flaky, retry)", () => {
+      treeFilter.value = { ...defaultFilter, flaky: true, retry: true };
+
+      setTransitionFilter("new", true);
+
+      expect(treeFilter.value.flaky).toBe(true);
+      expect(treeFilter.value.retry).toBe(true);
+      expect(treeFilter.value.new).toBe(true);
+    });
+  });
+});