siesa-agents 2.1.72-qa.21 → 2.1.72-qa.22

package/siesa-agents/resources/playwright-kit/helpers/react-e2e-helpers.ts

@@ -1,297 +1,297 @@
-/**
- * React E2E Helpers — Módulo reutilizable para specs del stack corporativo SIESA
- * SIESA React (Vite + TanStack Router/Query + Zustand + siesa-ui-kit + Radix/shadcn)
- *
- * Equivalente React de `blazor-e2e-helpers.ts`. A diferencia de Blazor:
- *   - NO hay SignalR ni pre-carga; se espera a que TanStack Query resuelva.
- *   - Selectores SEMÁNTICOS (getByRole / getByLabel / getByTestId), NO CSS frágil.
- *   - Validación con React Hook Form + Zod (errores como texto cerca del campo).
- *
- * ⚠️ SCAFFOLD: los selectores concretos de siesa-ui-kit NO están documentados en el repo.
- * Cada helper acepta overrides y/o `data-testid` para ajustarse a lo que confirme el
- * `architecture-brief-siesa-react.md` del módulo. Donde un selector sea una suposición
- * razonable, está marcado con `TODO[brief]`. Ajusta antes de promover specs a `tests/`.
- *
- * Uso:
- *   import { createObsCollector, login, fillField, selectLookup, submitForm } from './react-e2e-helpers';
- */
-
-import { expect, type Page, type Locator } from '@playwright/test';
-import * as fs from 'fs';
-import * as path from 'path';
-
-// ─── Observability Collector (idéntico a Blazor — framework-agnóstico) ─────────
-
-export interface ObsEntry {
-  timestamp: string;
-  type: 'console-error' | 'console-warn' | 'js-exception' | 'http-error' | 'app-alert';
-  message: string;
-  url?: string;
-}
-
-export function createObsCollector() {
-  const entries: ObsEntry[] = [];
-  const now = () => new Date().toISOString().slice(11, 23);
-
-  function attach(page: Page) {
-    page.on('console', msg => {
-      if (msg.type() === 'error') {
-        entries.push({ timestamp: now(), type: 'console-error', message: msg.text().slice(0, 300) });
-      } else if (msg.type() === 'warning') {
-        entries.push({ timestamp: now(), type: 'console-warn', message: msg.text().slice(0, 300) });
-      }
-    });
-
-    page.on('pageerror', err => {
-      entries.push({ timestamp: now(), type: 'js-exception', message: String(err).slice(0, 300) });
-    });
-
-    page.on('response', resp => {
-      if (resp.status() >= 400) {
-        entries.push({
-          timestamp: now(),
-          type: 'http-error',
-          message: `${resp.status()} ${resp.statusText()}`,
-          url: resp.url().slice(0, 200),
-        });
-      }
-    });
-
-    page.on('dialog', async dialog => {
-      entries.push({
-        timestamp: now(),
-        type: 'app-alert',
-        message: `[${dialog.type()}] ${dialog.message().slice(0, 300)}`,
-      });
-      await dialog.accept().catch(() => {});
-    });
-  }
-
-  function report(suiteName: string) {
-    console.log(`\n╔══ OBSERVABILITY REPORT — ${suiteName} ══╗`);
-    console.log(`║ Total entries: ${entries.length}`);
-    const byType = entries.reduce((acc, e) => { acc[e.type] = (acc[e.type] || 0) + 1; return acc; }, {} as Record<string, number>);
-    for (const [type, count] of Object.entries(byType)) {
-      console.log(`║  ${type}: ${count}`);
-    }
-    if (entries.length > 0) {
-      console.log('║ ─── Detalle (max 20) ───');
-      for (const e of entries.slice(0, 20)) {
-        console.log(`║ [${e.timestamp}] ${e.type}: ${e.message}${e.url ? ` (${e.url})` : ''}`);
-      }
-      if (entries.length > 20) console.log(`║ ... y ${entries.length - 20} mas`);
-    }
-    console.log(`╚${'═'.repeat(40)}╝\n`);
-
-    const reportData = {
-      suite: suiteName,
-      timestamp: new Date().toISOString(),
-      total: entries.length,
-      byType,
-      entries,
-    };
-    const outDir = path.join(process.cwd(), 'test-results');
-    fs.mkdirSync(outDir, { recursive: true });
-    const jsonPath = path.join(outDir, 'observability-report.json');
-    fs.writeFileSync(jsonPath, JSON.stringify(reportData, null, 2));
-    console.log(`Observability JSON → ${jsonPath}`);
-
-    return reportData;
-  }
-
-  return { entries, attach, report };
-}
-
-// ─── Espera de carga (TanStack Query) ────────────────────────────────────────
-
-/**
- * Espera a que terminen los estados de carga de TanStack Query: spinners/skeletons ocultos
- * y la red en reposo. Sustituye al `.sdk-loader` de Blazor. Usar tras navegar o tras una
- * mutación (guardar) antes de aseverar.
- */
-export async function waitForQuery(page: Page, opts?: { loaderTestId?: string }) {
-  await page.waitForLoadState('networkidle').catch(() => {});
-  // Spinner accesible (role="progressbar") o el loader del kit por data-testid.
-  const loader = opts?.loaderTestId
-    ? page.getByTestId(opts.loaderTestId)
-    : page.getByRole('progressbar'); // TODO[brief]: confirmar rol/testid del loader de siesa-ui-kit
-  await loader.first().waitFor({ state: 'hidden', timeout: 15_000 }).catch(() => {});
-}
-
-// ─── Login ───────────────────────────────────────────────────────────────────
-
-/**
- * Login del stack React. Por defecto usa form con labels "Usuario"/"Contraseña"; si la app
- * usa SSO corporativo, sobreescribir vía `opts` o adaptar al brief del módulo.
- */
-export async function login(page: Page, user?: string, pass?: string, opts?: { loginPath?: string }) {
-  const cred = {
-    user: user || process.env.TEST_USER || '',
-    password: pass || process.env.TEST_PASS || '',
-  };
-  if (!cred.user || !cred.password) {
-    throw new Error(
-      'react-e2e-helpers.login: faltan credenciales. Define TEST_USER y TEST_PASS en tu .env ' +
-      '(ver .env.example) o pásalas como argumentos a login(page, user, pass).'
-    );
-  }
-  await page.goto(opts?.loginPath ?? '/login'); // TODO[brief]: ruta de login real (SSO vs form)
-
-  // TODO[brief]: ajustar labels/roles a los del form real (i18n ES/EN).
-  const userInput = page.getByLabel(/usuario|email|correo/i).first();
-  await userInput.waitFor({ state: 'visible', timeout: 30_000 });
-  await userInput.fill(cred.user);
-
-  await page.getByLabel(/contrase|password/i).first().fill(cred.password);
-
-  await page.getByRole('button', { name: /iniciar|ingresar|entrar|sign in/i }).click();
-  await page.waitForURL(/.*(?!.*login).*/, { timeout: 30_000 });
-  await waitForQuery(page);
-}
-
-// ─── Form Helpers ──────────────────────────────────────────────────────────────
-
-/**
- * Llena un campo de texto/número buscado por label accesible (React Hook Form).
- * Pasa `byTestId` si el campo no expone label asociable.
- */
-export async function fillField(
-  page: Page,
-  label: string | RegExp,
-  value: string,
-  opts?: { byTestId?: string }
-) {
-  const field = fieldLocator(page, label, opts?.byTestId, 'textbox');
-  await field.click();
-  await field.fill('');
-  await field.fill(value);
-}
-
-/**
- * Selecciona una opción en un dropdown/Select (siesa-ui-kit / Radix Select).
- */
-export async function selectOption(
-  page: Page,
-  label: string | RegExp,
-  optionName: string | RegExp,
-  opts?: { byTestId?: string }
-) {
-  const trigger = opts?.byTestId
-    ? page.getByTestId(opts.byTestId)
-    : page.getByRole('combobox', { name: label });
-  await trigger.click();
-  await page.getByRole('option', { name: optionName }).click();
-}
-
-/**
- * Selecciona un registro maestro vía LookupField (patrón R-LF-001).
- * Escribe el término, espera la lista (TanStack Query) y elige la opción.
- */
-export async function selectLookup(
-  page: Page,
-  label: string | RegExp,
-  searchText: string,
-  opts?: { byTestId?: string; optionIndex?: number }
-) {
-  const input = opts?.byTestId
-    ? page.getByTestId(opts.byTestId)
-    : page.getByRole('combobox', { name: label }); // TODO[brief]: confirmar rol del LookupField
-  await input.click();
-  await input.fill(searchText);
-  await waitForQuery(page); // espera el fetch de búsqueda
-  const option = page.getByRole('option').nth(opts?.optionIndex ?? 0);
-  await option.waitFor({ state: 'visible', timeout: 10_000 });
-  await option.click();
-}
-
-/**
- * Marca/desmarca un checkbox o switch por label (ej: "Activo").
- */
-export async function setToggle(page: Page, label: string | RegExp, checked = true) {
-  const toggle = page.getByRole('checkbox', { name: label })
-    .or(page.getByRole('switch', { name: label }))
-    .first();
-  if ((await toggle.isChecked().catch(() => false)) !== checked) {
-    await toggle.click();
-  }
-}
-
-// ─── Acciones (submit, toolbar) ────────────────────────────────────────────────
-
-/**
- * Envía el formulario (botón Guardar/Submit) y espera que la mutación + invalidación
- * de query terminen. No asume toast; usar `expectToast` aparte si aplica.
- */
-export async function submitForm(page: Page, buttonName: string | RegExp = /guardar|save|submit/i) {
-  await page.getByRole('button', { name: buttonName }).click();
-  await waitForQuery(page);
-}
-
-/** Click en un botón de acción por nombre accesible (Nuevo, Editar, Eliminar, Cancelar). */
-export async function clickAction(page: Page, name: string | RegExp) {
-  await page.getByRole('button', { name }).click();
-  await waitForQuery(page);
-}
-
-// ─── Aserciones de feedback ────────────────────────────────────────────────────
-
-/**
- * Verifica un toast/notificación (role="status" o "alert"). El toast suele auto-ocultarse,
- * por eso se asevera apenas aparece.
- */
-export async function expectToast(page: Page, text: string | RegExp) {
-  const toast = page.getByRole('status').or(page.getByRole('alert')).filter({ hasText: text }).first();
-  await expect(toast).toBeVisible({ timeout: 10_000 });
-}
-
-/** Verifica el mensaje de error de validación Zod cercano a un campo. */
-export async function expectFieldError(page: Page, message: string | RegExp) {
-  await expect(page.getByText(message).first()).toBeVisible({ timeout: 5_000 });
-}
-
-// ─── Navigation ────────────────────────────────────────────────────────────────
-
-/**
- * Navega a una ruta de la SPA y espera que la app React (Single-SPA) y sus queries monten.
- */
-export async function navigateTo(page: Page, url: string) {
-  await page.goto(url);
-  await waitForQuery(page);
-  // La app vive bajo #single-spa-application; si no es MFE, basta con el <main>.
-  const root = page.locator('#single-spa-application').or(page.getByRole('main')).first();
-  await expect(root).toBeVisible({ timeout: 15_000 });
-}
-
-/** Espera a que una tabla/grid de datos sea visible (grid de siesa-ui-kit / role="grid"/"table"). */
-export async function waitForGrid(page: Page) {
-  await page.getByRole('grid').or(page.getByRole('table')).first()
-    .waitFor({ state: 'visible', timeout: 15_000 }).catch(() => {});
-}
-
-// ─── Utilidades (compartidas con el helper Blazor) ──────────────────────────────
-
-/** Resuelve un campo por testid (si se da) o por label accesible con rol esperado. */
-function fieldLocator(page: Page, label: string | RegExp, byTestId?: string, role: 'textbox' | 'spinbutton' = 'textbox'): Locator {
-  if (byTestId) return page.getByTestId(byTestId);
-  // getByLabel cubre la mayoría; fallback a role+name para inputs sin <label> asociado.
-  return page.getByLabel(label).or(page.getByRole(role, { name: label })).first();
-}
-
-export function getFechas(diasAdelante = 30): { inicio: string; fin: string } {
-  const hoy = new Date();
-  const fin = new Date(hoy);
-  fin.setDate(fin.getDate() + diasAdelante);
-
-  const fmt = (d: Date) =>
-    `${String(d.getMonth() + 1).padStart(2, '0')}/${String(d.getDate()).padStart(2, '0')}/${d.getFullYear()}`;
-
-  return { inicio: fmt(hoy), fin: fmt(fin) };
-}
-
-export function step(n: number, desc: string) {
-  console.log(`  [#${n}] ${desc}`);
-}
-
-export function generateRunId() {
-  return Date.now().toString().slice(-4);
-}
+/**
+ * React E2E Helpers — Módulo reutilizable para specs del stack corporativo SIESA
+ * SIESA React (Vite + TanStack Router/Query + Zustand + siesa-ui-kit + Radix/shadcn)
+ *
+ * Equivalente React de `blazor-e2e-helpers.ts`. A diferencia de Blazor:
+ *   - NO hay SignalR ni pre-carga; se espera a que TanStack Query resuelva.
+ *   - Selectores SEMÁNTICOS (getByRole / getByLabel / getByTestId), NO CSS frágil.
+ *   - Validación con React Hook Form + Zod (errores como texto cerca del campo).
+ *
+ * ⚠️ SCAFFOLD: los selectores concretos de siesa-ui-kit NO están documentados en el repo.
+ * Cada helper acepta overrides y/o `data-testid` para ajustarse a lo que confirme el
+ * `architecture-brief-siesa-react.md` del módulo. Donde un selector sea una suposición
+ * razonable, está marcado con `TODO[brief]`. Ajusta antes de promover specs a `tests/`.
+ *
+ * Uso:
+ *   import { createObsCollector, login, fillField, selectLookup, submitForm } from './react-e2e-helpers';
+ */
+
+import { expect, type Page, type Locator } from '@playwright/test';
+import * as fs from 'fs';
+import * as path from 'path';
+
+// ─── Observability Collector (idéntico a Blazor — framework-agnóstico) ─────────
+
+export interface ObsEntry {
+  timestamp: string;
+  type: 'console-error' | 'console-warn' | 'js-exception' | 'http-error' | 'app-alert';
+  message: string;
+  url?: string;
+}
+
+export function createObsCollector() {
+  const entries: ObsEntry[] = [];
+  const now = () => new Date().toISOString().slice(11, 23);
+
+  function attach(page: Page) {
+    page.on('console', msg => {
+      if (msg.type() === 'error') {
+        entries.push({ timestamp: now(), type: 'console-error', message: msg.text().slice(0, 300) });
+      } else if (msg.type() === 'warning') {
+        entries.push({ timestamp: now(), type: 'console-warn', message: msg.text().slice(0, 300) });
+      }
+    });
+
+    page.on('pageerror', err => {
+      entries.push({ timestamp: now(), type: 'js-exception', message: String(err).slice(0, 300) });
+    });
+
+    page.on('response', resp => {
+      if (resp.status() >= 400) {
+        entries.push({
+          timestamp: now(),
+          type: 'http-error',
+          message: `${resp.status()} ${resp.statusText()}`,
+          url: resp.url().slice(0, 200),
+        });
+      }
+    });
+
+    page.on('dialog', async dialog => {
+      entries.push({
+        timestamp: now(),
+        type: 'app-alert',
+        message: `[${dialog.type()}] ${dialog.message().slice(0, 300)}`,
+      });
+      await dialog.accept().catch(() => {});
+    });
+  }
+
+  function report(suiteName: string) {
+    console.log(`\n╔══ OBSERVABILITY REPORT — ${suiteName} ══╗`);
+    console.log(`║ Total entries: ${entries.length}`);
+    const byType = entries.reduce((acc, e) => { acc[e.type] = (acc[e.type] || 0) + 1; return acc; }, {} as Record<string, number>);
+    for (const [type, count] of Object.entries(byType)) {
+      console.log(`║  ${type}: ${count}`);
+    }
+    if (entries.length > 0) {
+      console.log('║ ─── Detalle (max 20) ───');
+      for (const e of entries.slice(0, 20)) {
+        console.log(`║ [${e.timestamp}] ${e.type}: ${e.message}${e.url ? ` (${e.url})` : ''}`);
+      }
+      if (entries.length > 20) console.log(`║ ... y ${entries.length - 20} mas`);
+    }
+    console.log(`╚${'═'.repeat(40)}╝\n`);
+
+    const reportData = {
+      suite: suiteName,
+      timestamp: new Date().toISOString(),
+      total: entries.length,
+      byType,
+      entries,
+    };
+    const outDir = path.join(process.cwd(), 'test-results');
+    fs.mkdirSync(outDir, { recursive: true });
+    const jsonPath = path.join(outDir, 'observability-report.json');
+    fs.writeFileSync(jsonPath, JSON.stringify(reportData, null, 2));
+    console.log(`Observability JSON → ${jsonPath}`);
+
+    return reportData;
+  }
+
+  return { entries, attach, report };
+}
+
+// ─── Espera de carga (TanStack Query) ────────────────────────────────────────
+
+/**
+ * Espera a que terminen los estados de carga de TanStack Query: spinners/skeletons ocultos
+ * y la red en reposo. Sustituye al `.sdk-loader` de Blazor. Usar tras navegar o tras una
+ * mutación (guardar) antes de aseverar.
+ */
+export async function waitForQuery(page: Page, opts?: { loaderTestId?: string }) {
+  await page.waitForLoadState('networkidle').catch(() => {});
+  // Spinner accesible (role="progressbar") o el loader del kit por data-testid.
+  const loader = opts?.loaderTestId
+    ? page.getByTestId(opts.loaderTestId)
+    : page.getByRole('progressbar'); // TODO[brief]: confirmar rol/testid del loader de siesa-ui-kit
+  await loader.first().waitFor({ state: 'hidden', timeout: 15_000 }).catch(() => {});
+}
+
+// ─── Login ───────────────────────────────────────────────────────────────────
+
+/**
+ * Login del stack React. Por defecto usa form con labels "Usuario"/"Contraseña"; si la app
+ * usa SSO corporativo, sobreescribir vía `opts` o adaptar al brief del módulo.
+ */
+export async function login(page: Page, user?: string, pass?: string, opts?: { loginPath?: string }) {
+  const cred = {
+    user: user || process.env.TEST_USER || '',
+    password: pass || process.env.TEST_PASS || '',
+  };
+  if (!cred.user || !cred.password) {
+    throw new Error(
+      'react-e2e-helpers.login: faltan credenciales. Define TEST_USER y TEST_PASS en tu .env ' +
+      '(ver .env.example) o pásalas como argumentos a login(page, user, pass).'
+    );
+  }
+  await page.goto(opts?.loginPath ?? '/login'); // TODO[brief]: ruta de login real (SSO vs form)
+
+  // TODO[brief]: ajustar labels/roles a los del form real (i18n ES/EN).
+  const userInput = page.getByLabel(/usuario|email|correo/i).first();
+  await userInput.waitFor({ state: 'visible', timeout: 30_000 });
+  await userInput.fill(cred.user);
+
+  await page.getByLabel(/contrase|password/i).first().fill(cred.password);
+
+  await page.getByRole('button', { name: /iniciar|ingresar|entrar|sign in/i }).click();
+  await page.waitForURL(/.*(?!.*login).*/, { timeout: 30_000 });
+  await waitForQuery(page);
+}
+
+// ─── Form Helpers ──────────────────────────────────────────────────────────────
+
+/**
+ * Llena un campo de texto/número buscado por label accesible (React Hook Form).
+ * Pasa `byTestId` si el campo no expone label asociable.
+ */
+export async function fillField(
+  page: Page,
+  label: string | RegExp,
+  value: string,
+  opts?: { byTestId?: string }
+) {
+  const field = fieldLocator(page, label, opts?.byTestId, 'textbox');
+  await field.click();
+  await field.fill('');
+  await field.fill(value);
+}
+
+/**
+ * Selecciona una opción en un dropdown/Select (siesa-ui-kit / Radix Select).
+ */
+export async function selectOption(
+  page: Page,
+  label: string | RegExp,
+  optionName: string | RegExp,
+  opts?: { byTestId?: string }
+) {
+  const trigger = opts?.byTestId
+    ? page.getByTestId(opts.byTestId)
+    : page.getByRole('combobox', { name: label });
+  await trigger.click();
+  await page.getByRole('option', { name: optionName }).click();
+}
+
+/**
+ * Selecciona un registro maestro vía LookupField (patrón R-LF-001).
+ * Escribe el término, espera la lista (TanStack Query) y elige la opción.
+ */
+export async function selectLookup(
+  page: Page,
+  label: string | RegExp,
+  searchText: string,
+  opts?: { byTestId?: string; optionIndex?: number }
+) {
+  const input = opts?.byTestId
+    ? page.getByTestId(opts.byTestId)
+    : page.getByRole('combobox', { name: label }); // TODO[brief]: confirmar rol del LookupField
+  await input.click();
+  await input.fill(searchText);
+  await waitForQuery(page); // espera el fetch de búsqueda
+  const option = page.getByRole('option').nth(opts?.optionIndex ?? 0);
+  await option.waitFor({ state: 'visible', timeout: 10_000 });
+  await option.click();
+}
+
+/**
+ * Marca/desmarca un checkbox o switch por label (ej: "Activo").
+ */
+export async function setToggle(page: Page, label: string | RegExp, checked = true) {
+  const toggle = page.getByRole('checkbox', { name: label })
+    .or(page.getByRole('switch', { name: label }))
+    .first();
+  if ((await toggle.isChecked().catch(() => false)) !== checked) {
+    await toggle.click();
+  }
+}
+
+// ─── Acciones (submit, toolbar) ────────────────────────────────────────────────
+
+/**
+ * Envía el formulario (botón Guardar/Submit) y espera que la mutación + invalidación
+ * de query terminen. No asume toast; usar `expectToast` aparte si aplica.
+ */
+export async function submitForm(page: Page, buttonName: string | RegExp = /guardar|save|submit/i) {
+  await page.getByRole('button', { name: buttonName }).click();
+  await waitForQuery(page);
+}
+
+/** Click en un botón de acción por nombre accesible (Nuevo, Editar, Eliminar, Cancelar). */
+export async function clickAction(page: Page, name: string | RegExp) {
+  await page.getByRole('button', { name }).click();
+  await waitForQuery(page);
+}
+
+// ─── Aserciones de feedback ────────────────────────────────────────────────────
+
+/**
+ * Verifica un toast/notificación (role="status" o "alert"). El toast suele auto-ocultarse,
+ * por eso se asevera apenas aparece.
+ */
+export async function expectToast(page: Page, text: string | RegExp) {
+  const toast = page.getByRole('status').or(page.getByRole('alert')).filter({ hasText: text }).first();
+  await expect(toast).toBeVisible({ timeout: 10_000 });
+}
+
+/** Verifica el mensaje de error de validación Zod cercano a un campo. */
+export async function expectFieldError(page: Page, message: string | RegExp) {
+  await expect(page.getByText(message).first()).toBeVisible({ timeout: 5_000 });
+}
+
+// ─── Navigation ────────────────────────────────────────────────────────────────
+
+/**
+ * Navega a una ruta de la SPA y espera que la app React (Single-SPA) y sus queries monten.
+ */
+export async function navigateTo(page: Page, url: string) {
+  await page.goto(url);
+  await waitForQuery(page);
+  // La app vive bajo #single-spa-application; si no es MFE, basta con el <main>.
+  const root = page.locator('#single-spa-application').or(page.getByRole('main')).first();
+  await expect(root).toBeVisible({ timeout: 15_000 });
+}
+
+/** Espera a que una tabla/grid de datos sea visible (grid de siesa-ui-kit / role="grid"/"table"). */
+export async function waitForGrid(page: Page) {
+  await page.getByRole('grid').or(page.getByRole('table')).first()
+    .waitFor({ state: 'visible', timeout: 15_000 }).catch(() => {});
+}
+
+// ─── Utilidades (compartidas con el helper Blazor) ──────────────────────────────
+
+/** Resuelve un campo por testid (si se da) o por label accesible con rol esperado. */
+function fieldLocator(page: Page, label: string | RegExp, byTestId?: string, role: 'textbox' | 'spinbutton' = 'textbox'): Locator {
+  if (byTestId) return page.getByTestId(byTestId);
+  // getByLabel cubre la mayoría; fallback a role+name para inputs sin <label> asociado.
+  return page.getByLabel(label).or(page.getByRole(role, { name: label })).first();
+}
+
+export function getFechas(diasAdelante = 30): { inicio: string; fin: string } {
+  const hoy = new Date();
+  const fin = new Date(hoy);
+  fin.setDate(fin.getDate() + diasAdelante);
+
+  const fmt = (d: Date) =>
+    `${String(d.getMonth() + 1).padStart(2, '0')}/${String(d.getDate()).padStart(2, '0')}/${d.getFullYear()}`;
+
+  return { inicio: fmt(hoy), fin: fmt(fin) };
+}
+
+export function step(n: number, desc: string) {
+  console.log(`  [#${n}] ${desc}`);
+}
+
+export function generateRunId() {
+  return Date.now().toString().slice(-4);
+}