Failing test: when postSelfServiceRegistrations errors, the page should show an alert, not the confirmation, and keep the submit button available for retry. Currently submit() has no error handler, so the rejection is swallowed and the page silently stays put — exactly the failure mode that hid the missing-token bug behind a 90s e2e timeout. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
72 lines
2.6 KiB
TypeScript
72 lines
2.6 KiB
TypeScript
import { signal } from '@angular/core';
|
|
import { fireEvent, render, screen } from '@testing-library/angular';
|
|
import { of, throwError } from 'rxjs';
|
|
import { AuthService } from 'auth';
|
|
import { BffApiV1Service } from 'api-client';
|
|
import { axe } from 'vitest-axe';
|
|
import { RegistrationPage } from './registration-page';
|
|
|
|
class FakeAuth extends AuthService {
|
|
readonly isAuthenticated = signal(true);
|
|
readonly bsn = signal<string | undefined>('123456782');
|
|
login(): void {
|
|
/* noop */
|
|
}
|
|
logout(): void {
|
|
/* noop */
|
|
}
|
|
}
|
|
|
|
function providers(post = vi.fn().mockReturnValue(of({ registrationId: 'reg-9', status: 'Ingediend' }))) {
|
|
return {
|
|
post,
|
|
providers: [
|
|
{ provide: AuthService, useClass: FakeAuth },
|
|
{ provide: BffApiV1Service, useValue: { postSelfServiceRegistrations: post } },
|
|
],
|
|
};
|
|
}
|
|
|
|
describe('RegistrationPage', () => {
|
|
it('shows the signed-in BSN', async () => {
|
|
await render(RegistrationPage, { providers: providers().providers });
|
|
expect(screen.getByText(/123456782/)).toBeTruthy();
|
|
});
|
|
|
|
it('submits the registration and confirms', async () => {
|
|
const { post, providers: p } = providers();
|
|
await render(RegistrationPage, { providers: p });
|
|
|
|
fireEvent.click(screen.getByRole('button', { name: /indienen/i }));
|
|
|
|
expect(post).toHaveBeenCalledTimes(1);
|
|
expect(await screen.findByText(/ontvangen/i)).toBeTruthy();
|
|
});
|
|
|
|
it('shows an error and keeps the submit available when the BFF call fails', async () => {
|
|
const { post, providers: p } = providers(vi.fn().mockReturnValue(throwError(() => new Error('BFF rejected'))));
|
|
await render(RegistrationPage, { providers: p });
|
|
|
|
fireEvent.click(screen.getByRole('button', { name: /indienen/i }));
|
|
|
|
expect(post).toHaveBeenCalledTimes(1);
|
|
// The failure is surfaced (not swallowed), the confirmation is not shown, and the user can retry.
|
|
expect(await screen.findByRole('alert')).toBeTruthy();
|
|
expect(screen.queryByText(/ontvangen/i)).toBeNull();
|
|
expect(screen.getByRole('button', { name: /indienen/i })).toBeTruthy();
|
|
});
|
|
|
|
it('has no WCAG 2.1 AA violations on the submit page', async () => {
|
|
// The portal is Dutch; the real index.html sets lang. Set it here so the document-level
|
|
// html-has-lang rule reflects the app, not the bare jsdom document.
|
|
document.documentElement.lang = 'nl';
|
|
const { container } = await render(RegistrationPage, { providers: providers().providers });
|
|
|
|
const results = await axe(container, {
|
|
runOnly: { type: 'tag', values: ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'] },
|
|
});
|
|
|
|
expect(results.violations).toEqual([]);
|
|
});
|
|
});
|