metis-desk/packages/rdx-ui/src/time-line.test.tsx
David 68980d9131 feat: enhance user management and resource catalog UI with icons, improve localization, and add new components
- Added UsersIcon to UserManagement for better visual representation.
- Updated Spanish localization for "noValue" to use a dash instead of "Sin datos".
- Introduced LayoutTemplateIcon in ResourceCatalogPage for improved UI.
- Integrated LayersIcon in ResourcesPage to enhance user experience.
- Updated package.json test scripts to include new test files.
- Enhanced DetailSection component to support accordion functionality.
- Modified EntityListHeader to accept an icon prop for better UI consistency.
- Added new CountBadge and TimeLine components for better data representation.
- Implemented asset workstation action logic and UI components for asset management.
- Created tests for CountBadge and TimeLine components to ensure functionality.
2026-10-16 20:09:02 +02:00

52 lines
1.6 KiB
TypeScript

import assert from "node:assert/strict";
import { test } from "node:test";
import { renderToStaticMarkup } from "react-dom/server";
import { TimeLine } from "./components/time-line";
test("línea temporal: conserva el orden aportado, fechas semánticas, autor y contenido", () => {
const items = [
{
id: "latest",
title: "Cambio reciente",
dateTime: "2026-10-16T10:00:00.000Z",
dateLabel: "16 oct 2026",
meta: "Ana",
content: <p>Estado actualizado</p>,
},
{
id: "first",
title: "Alta original",
dateTime: "2026-10-10T10:00:00.000Z",
dateLabel: "10 oct 2026",
},
];
const html = renderToStaticMarkup(
<TimeLine emptyMessage="Sin eventos" items={items} label="Historial" />
);
assert.ok(html.includes('<ol aria-label="Historial"'));
assert.equal((html.match(/<li\b/g) ?? []).length, 2);
assert.ok(html.indexOf("Cambio reciente") < html.indexOf("Alta original"));
assert.ok(html.includes('dateTime="2026-10-16T10:00:00.000Z"'));
assert.ok(html.includes("16 oct 2026"));
assert.ok(html.includes("Ana"));
assert.ok(html.includes("Estado actualizado"));
assert.equal(html.includes("Sin eventos"), false);
assert.deepEqual(
items.map((item) => item.id),
["latest", "first"]
);
});
test("línea temporal vacía: muestra el mensaje del consumidor como estado", () => {
const html = renderToStaticMarkup(
<TimeLine emptyMessage="No events yet" items={[]} label="History" />
);
assert.ok(html.includes('role="status"'));
assert.ok(html.includes("No events yet"));
assert.equal(html.includes("<ol"), false);
});