You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

42 lines
2.1 KiB
TypeScript

// frontend/tests/connectors/ConnectStateBadge.test.tsx — 5개 상태별 라벨+클래스
import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { ConnectStateBadge } from "@/components/connectors/ConnectStateBadge";
describe("ConnectStateBadge", () => {
it("connected 는 last prop 텍스트를 라벨로 사용 + 녹색 점", () => {
const { container } = render(<ConnectStateBadge state="connected" last="오늘 09:12" />);
expect(screen.getByText("오늘 09:12")).toBeInTheDocument();
expect(container.querySelector(".cs-badge.cs-connected")).toBeTruthy();
expect(container.querySelector(".dot-green")).toBeTruthy();
});
it("syncing → '동기화 중…' + 파란 점", () => {
const { container } = render(<ConnectStateBadge state="syncing" />);
expect(screen.getByText("동기화 중…")).toBeInTheDocument();
expect(container.querySelector(".cs-badge.cs-syncing")).toBeTruthy();
expect(container.querySelector(".dot-blue")).toBeTruthy();
});
it("disconnected → '연결 안 됨' + faint 점", () => {
const { container } = render(<ConnectStateBadge state="disconnected" />);
expect(screen.getByText("연결 안 됨")).toBeInTheDocument();
expect(container.querySelector(".cs-badge.cs-disconnected")).toBeTruthy();
expect(container.querySelector(".dot-faint")).toBeTruthy();
});
it("error → '동기화 실패 · 다시 시도' + coral 점", () => {
const { container } = render(<ConnectStateBadge state="error" />);
expect(screen.getByText("동기화 실패 · 다시 시도")).toBeInTheDocument();
expect(container.querySelector(".cs-badge.cs-error")).toBeTruthy();
expect(container.querySelector(".dot-coral")).toBeTruthy();
});
it("token_expired → '권한 만료 · 다시 연결' + amber 점", () => {
const { container } = render(<ConnectStateBadge state="token_expired" />);
expect(screen.getByText("권한 만료 · 다시 연결")).toBeInTheDocument();
expect(container.querySelector(".cs-badge.cs-token_expired")).toBeTruthy();
expect(container.querySelector(".dot-amber")).toBeTruthy();
});
});