52 lines
1.6 KiB
TypeScript
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);
|
||
|
|
});
|