init

Bin

2025-12-16 9e0b2ba2c317b1a86212f24cbae3195ad1f3dbfa

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
import { render, screen } from "@testing-library/react";
import "@testing-library/jest-dom";
import { EmptyState } from "../EmptyState";
 
describe("EmptyState", () => {
  beforeEach(() => {
    // Clean up window.APP_SETTINGS before each test
    // @ts-ignore
    delete window.APP_SETTINGS;
  });
 
  const testData = {
    icon: <svg data-testid="icon" />,
    header: "Test Header",
    description: <>Test description</>,
    learnMore: { href: "https://docs.example.com", text: "Learn more", testId: "test-learn-more-link" },
  };
 
  it("renders icon, header, description, and learn more link", () => {
    render(
      <EmptyState
        icon={testData.icon}
        header={testData.header}
        description={testData.description}
        learnMore={testData.learnMore}
      />,
    );
 
    // Test that the main component renders
    expect(screen.getByTestId("empty-state")).toBeInTheDocument();
 
    // Test icon rendering
    expect(screen.getByTestId("icon")).toBeInTheDocument();
 
    // Test header rendering
    expect(screen.getByTestId("empty-state-header")).toBeInTheDocument();
    expect(screen.getByText(testData.header)).toBeInTheDocument();
 
    // Test description rendering
    expect(screen.getByTestId("empty-state-description")).toBeInTheDocument();
    expect(screen.getByText("Test description")).toBeInTheDocument();
 
    // Test learn more link
    const link = screen.getByRole("link", { name: /learn more/i });
    expect(link).toBeInTheDocument();
    expect(link).toHaveAttribute("href", testData.learnMore.href);
    expect(link).toHaveAttribute("data-testid", testData.learnMore.testId);
    expect(link).toHaveAttribute("target", "_blank");
    expect(link).toHaveAttribute("rel", expect.stringContaining("noopener"));
  });
 
  it("does not render learn more link if not provided", () => {
    render(<EmptyState icon={testData.icon} header={testData.header} description={testData.description} />);
 
    expect(screen.getByTestId("empty-state")).toBeInTheDocument();
    expect(screen.getByTestId("icon")).toBeInTheDocument();
    expect(screen.getByText(testData.header)).toBeInTheDocument();
    expect(screen.getByText("Test description")).toBeInTheDocument();
    expect(screen.queryByRole("link", { name: /learn more/i })).not.toBeInTheDocument();
  });
 
  it("does not render data-testid if not provided", () => {
    render(
      <EmptyState
        icon={testData.icon}
        header={testData.header}
        description={testData.description}
        learnMore={{ href: testData.learnMore.href, text: testData.learnMore.text }}
      />,
    );
 
    const link = screen.getByRole("link", { name: /learn more/i });
    expect(link).toBeInTheDocument();
    expect(link).not.toHaveAttribute("data-testid");
  });
 
  it("hides learn more link in whitelabel mode", () => {
    // @ts-ignore
    window.APP_SETTINGS = { whitelabel_is_active: true };
 
    render(
      <EmptyState
        icon={testData.icon}
        header={testData.header}
        description={testData.description}
        learnMore={testData.learnMore}
      />,
    );
 
    expect(screen.getByTestId("empty-state")).toBeInTheDocument();
    expect(screen.getByTestId("icon")).toBeInTheDocument();
    expect(screen.getByText(testData.header)).toBeInTheDocument();
    expect(screen.getByText("Test description")).toBeInTheDocument();
    expect(screen.queryByRole("link", { name: /learn more/i })).not.toBeInTheDocument();
  });
 
  it("renders with complex description content", () => {
    const complexDescription = (
      <div>
        <span>First part</span>
        <strong>Bold part</strong>
      </div>
    );
 
    render(<EmptyState icon={testData.icon} header={testData.header} description={complexDescription} />);
 
    expect(screen.getByTestId("empty-state-description")).toBeInTheDocument();
    expect(screen.getByText("First part")).toBeInTheDocument();
    expect(screen.getByText("Bold part")).toBeInTheDocument();
  });
});