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

77 lines
2.0 KiB
TypeScript
Raw Permalink 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 React from "react";
import { describe, it, expect, vi, beforeEach } from "vitest";
import { render, screen, fireEvent } from "@testing-library/react";
import { ConfigMapDetail } from "@/components/Kubernetes/ConfigMapDetail";
import type { ConfigMapInfo } from "@/lib/tauriCommands";
vi.mock("@tauri-apps/api/core");
const mockConfigMap: ConfigMapInfo = {
name: "app-config",
namespace: "default",
data_keys: 4,
age: "1d",
};
describe("ConfigMapDetail", () => {
beforeEach(() => {
vi.clearAllMocks();
});
it("renders configmap name", () => {
render(
<ConfigMapDetail
clusterId="cluster-1"
namespace="default"
configMap={mockConfigMap}
onClose={() => {}}
/>
);
expect(screen.getByRole("heading", { name: /configmap: app-config/i })).toBeDefined();
});
it("shows data key count", () => {
render(
<ConfigMapDetail
clusterId="cluster-1"
namespace="default"
configMap={mockConfigMap}
onClose={() => {}}
/>
);
// Badge with count "4" on data tab
const badges = screen.getAllByText("4");
expect(badges.length).toBeGreaterThan(0);
});
it("shows namespace in metadata tab", () => {
render(
<ConfigMapDetail
clusterId="cluster-1"
namespace="default"
configMap={mockConfigMap}
onClose={() => {}}
/>
);
const metadataTab = screen.getByRole("button", { name: /^metadata$/i });
fireEvent.click(metadataTab);
const cells = screen.getAllByText("default");
expect(cells.length).toBeGreaterThan(0);
});
it("shows YAML tab heading when switched to", () => {
render(
<ConfigMapDetail
clusterId="cluster-1"
namespace="default"
configMap={mockConfigMap}
onClose={() => {}}
/>
);
const yamlTab = screen.getByRole("button", { name: /^yaml$/i });
fireEvent.click(yamlTab);
// YamlEditor tab is visible - the tab button itself has the text
expect(yamlTab).toBeDefined();
});
});