ITWorx Pulse release export
bd774932d5
Public source validation / validate (push) Failing after 3m8s
82 lines
3.7 KiB
TypeScript
82 lines
3.7 KiB
TypeScript
import { cleanup, render, screen, waitFor, within } from '@testing-library/react';
|
|
import userEvent from '@testing-library/user-event';
|
|
import { afterEach, describe, expect, it, vi } from 'vitest';
|
|
|
|
import { EventsPage } from '../../src/EventsPage';
|
|
|
|
const items = Array.from({ length: 100 }, (_, index) => ({
|
|
id: `event-${String(index + 1).padStart(3, '0')}`,
|
|
type: index % 2 === 0 ? 'service.down' : 'container.restart',
|
|
severity: index % 10 === 0 ? 'critical' : index % 3 === 0 ? 'warning' : 'info',
|
|
entityId: `entity-${String(index % 5).padStart(2, '0')}`,
|
|
sourceId: 'source-unraid',
|
|
occurredAt: new Date(Date.UTC(2026, 7, 21, 12, 0, 0) - index * 60_000).toISOString(),
|
|
receivedAt: new Date(Date.UTC(2026, 7, 21, 12, 0, 5) - index * 60_000).toISOString(),
|
|
summary: `Gebeurtenis ${String(index + 1).padStart(3, '0')}`,
|
|
}));
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
vi.unstubAllGlobals();
|
|
window.history.replaceState({}, '', '/events');
|
|
});
|
|
|
|
function mockEvents(payload = items) {
|
|
const fetch = vi.fn(async () => new Response(JSON.stringify({ items: payload }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
|
|
vi.stubGlobal('fetch', fetch);
|
|
return fetch;
|
|
}
|
|
|
|
describe('compacte eventtijdlijn', () => {
|
|
it('houdt honderd events begrensd en pagineert deterministisch met focus', async () => {
|
|
const fetch = mockEvents();
|
|
const user = userEvent.setup();
|
|
render(<EventsPage />);
|
|
|
|
const list = await screen.findByRole('list', { name: 'Resultaten' });
|
|
expect(within(list).getAllByRole('listitem')).toHaveLength(20);
|
|
expect(within(list).getByText('event-001')).toBeInTheDocument();
|
|
expect(within(list).queryByText('event-021')).not.toBeInTheDocument();
|
|
|
|
const next = screen.getByRole('button', { name: 'Volgende pagina' });
|
|
await user.click(next);
|
|
await waitFor(() => expect(screen.getByText(/Pagina 2 van 5/)).toHaveFocus());
|
|
expect(within(list).getByText('event-021')).toBeInTheDocument();
|
|
expect(window.location.search).toContain('page=2');
|
|
expect(fetch).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
it('filtert ernst, soort, onderdeel en vrije tekst zonder nieuwe request', async () => {
|
|
const fetch = mockEvents();
|
|
const user = userEvent.setup();
|
|
render(<EventsPage />);
|
|
const list = await screen.findByRole('list', { name: 'Resultaten' });
|
|
|
|
await user.selectOptions(screen.getByLabelText('Ernst'), 'critical');
|
|
expect(within(list).getAllByRole('listitem')).toHaveLength(10);
|
|
await user.selectOptions(screen.getByLabelText('Soort'), 'service.down');
|
|
expect(within(list).getAllByRole('listitem')).toHaveLength(10);
|
|
await user.selectOptions(screen.getByLabelText('Onderdeel'), 'entity-00');
|
|
expect(within(list).getAllByRole('listitem')).toHaveLength(10);
|
|
await user.clear(screen.getByLabelText('Zoeken'));
|
|
await user.type(screen.getByLabelText('Zoeken'), 'Gebeurtenis 091');
|
|
expect(within(list).getAllByRole('listitem')).toHaveLength(1);
|
|
expect(within(list).getByText('event-091')).toBeInTheDocument();
|
|
expect(fetch).toHaveBeenCalledTimes(1);
|
|
});
|
|
|
|
it('houdt het kritieke totaal zichtbaar en biedt een herstelbare lege state', async () => {
|
|
mockEvents();
|
|
const user = userEvent.setup();
|
|
render(<EventsPage />);
|
|
|
|
const critical = await screen.findByRole('button', { name: /Kritieke gebeurtenissen/i });
|
|
expect(critical).toHaveTextContent('10');
|
|
await user.type(screen.getByLabelText('Zoeken'), 'bestaat-niet');
|
|
expect(screen.getByText('Geen gebeurtenissen binnen de huidige filters.')).toBeVisible();
|
|
expect(critical).toBeVisible();
|
|
await user.click(screen.getByRole('button', { name: 'Alle filters wissen' }));
|
|
expect(await screen.findByRole('list', { name: 'Resultaten' })).toBeVisible();
|
|
});
|
|
});
|