tftsr-devops_investigation/tests/unit/ClusterDetails.test.tsx

134 lines
3.8 KiB
TypeScript
Raw Normal View History

feat(kubernetes): implement Lens Desktop v5 feature-parity UI Complete overhaul of the Kubernetes management page from a basic config panel into a full Lens-style IDE shell with 26 resource types, real-time data, and a comprehensive test suite. Layout & navigation: - Rewrite KubernetesPage as a Lens v5-style shell: collapsible sidebar (Workloads / Services & Networking / Config & Storage / Access Control / Cluster), top hotbar with cluster+namespace selectors, Ctrl+K command palette - All 26 resource types now accessible via sidebar navigation (previously 5) New resource types (Rust + TypeScript + React): - StorageClasses, NetworkPolicies, ResourceQuotas, LimitRanges - 4 new Tauri commands registered in generate_handler![] Component implementations (replacing stubs with real IPC): - Terminal: full xterm.js with multi-tab sessions and exec_pod IPC - YamlEditor: Monaco editor with YAML syntax highlighting - MetricsChart: recharts LineChart/BarChart - ClusterOverview: live node/pod/deployment/namespace counts - ClusterDetails: real kubeconfig + node data - PodDetail, DeploymentDetail, ServiceDetail, ConfigMapDetail, SecretDetail: all connected to real IPC data, zero hardcoded values - CreateResourceModal, EditResourceModal: wired to createResourceCmd / editResourceCmd - RbacViewer: live data from 4 RBAC IPC commands - RbacEditor: create roles/cluster-roles via YAML editor - CommandPalette: 12 real navigation commands, keyboard nav Dependencies added: xterm@5, xterm-addon-fit, xterm-addon-web-links, @monaco-editor/react@4, recharts@2 Tooling: - Replace eslint-plugin-react (incompatible with ESLint 10) with @eslint-react/eslint-plugin; fix eslint.config.js for flat config - Fix pre-existing hoisting lint errors in Security.tsx, PortForwardForm.tsx - Fix eventBus.ts: replace all `any` generics with `unknown` Tests: 251 passing across 35 test files (was 94/19) - 16 new test files covering all new and fixed components (TDD) - npx tsc --noEmit: 0 errors - cargo clippy -- -D warnings: 0 warnings - cargo fmt --check: passes - eslint src/ --max-warnings 0: 0 issues
2026-06-07 21:41:28 +00:00
import { describe, it, expect, vi, beforeEach } from "vitest";
import { render, screen, waitFor } from "@testing-library/react";
import { invoke } from "@tauri-apps/api/core";
import { ClusterDetails } from "@/components/Kubernetes/ClusterDetails";
type MockedInvoke = typeof invoke & {
mockResolvedValue: (v: unknown) => void;
mockRejectedValue: (e: Error) => void;
mockImplementation: (fn: (cmd: string) => Promise<unknown>) => void;
};
const mockInvoke = invoke as MockedInvoke;
const mockKubeconfigs = [
{
id: "cluster-1",
name: "production-k8s",
context: "prod-context",
cluster_url: "https://k8s.example.com:6443",
is_active: true,
},
{
id: "cluster-2",
name: "staging-k8s",
context: "staging-context",
cluster_url: "https://staging.example.com:6443",
is_active: false,
},
];
const mockNodes = [
{
name: "node-1",
status: "Ready",
roles: "control-plane",
version: "v1.28.4",
internal_ip: "10.0.0.1",
os_image: "Ubuntu 22.04",
kernel_version: "5.15.0",
kubelet_version: "v1.28.4",
age: "30d",
},
{
name: "node-2",
status: "Ready",
roles: "worker",
version: "v1.28.4",
internal_ip: "10.0.0.2",
os_image: "Ubuntu 22.04",
kernel_version: "5.15.0",
kubelet_version: "v1.28.4",
age: "30d",
},
];
describe("ClusterDetails", () => {
beforeEach(() => {
vi.clearAllMocks();
});
it("renders cluster name from kubeconfig", async () => {
mockInvoke.mockImplementation((cmd: string) => {
if (cmd === "list_kubeconfigs") return Promise.resolve(mockKubeconfigs);
if (cmd === "list_nodes") return Promise.resolve(mockNodes);
return Promise.resolve([]);
});
render(<ClusterDetails clusterId="cluster-1" />);
await waitFor(() => {
expect(screen.getByTestId("cluster-name")).toHaveTextContent("production-k8s");
});
});
it("renders API server URL from kubeconfig", async () => {
mockInvoke.mockImplementation((cmd: string) => {
if (cmd === "list_kubeconfigs") return Promise.resolve(mockKubeconfigs);
if (cmd === "list_nodes") return Promise.resolve(mockNodes);
return Promise.resolve([]);
});
render(<ClusterDetails clusterId="cluster-1" />);
await waitFor(() => {
expect(screen.getByTestId("cluster-api-server")).toHaveTextContent(
"https://k8s.example.com:6443"
);
});
});
it("renders context name", async () => {
mockInvoke.mockImplementation((cmd: string) => {
if (cmd === "list_kubeconfigs") return Promise.resolve(mockKubeconfigs);
if (cmd === "list_nodes") return Promise.resolve(mockNodes);
return Promise.resolve([]);
});
render(<ClusterDetails clusterId="cluster-1" />);
await waitFor(() => {
expect(screen.getByTestId("cluster-context")).toHaveTextContent("prod-context");
});
});
it("shows node information from listNodesCmd", async () => {
mockInvoke.mockImplementation((cmd: string) => {
if (cmd === "list_kubeconfigs") return Promise.resolve(mockKubeconfigs);
if (cmd === "list_nodes") return Promise.resolve(mockNodes);
return Promise.resolve([]);
});
render(<ClusterDetails clusterId="cluster-1" />);
await waitFor(() => {
expect(screen.getByText("node-1")).toBeInTheDocument();
expect(screen.getByText("node-2")).toBeInTheDocument();
});
});
it("shows 'No data' message when cluster info unavailable", async () => {
mockInvoke.mockImplementation((cmd: string) => {
if (cmd === "list_kubeconfigs") return Promise.resolve([]);
if (cmd === "list_nodes") return Promise.resolve([]);
return Promise.resolve([]);
});
render(<ClusterDetails clusterId="cluster-unknown" />);
await waitFor(() => {
expect(screen.getByTestId("cluster-no-data")).toBeInTheDocument();
});
});
});