39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
// Prüfung: Tastaturbedienung der Basis-Komponenten funktioniert (SHL-01 Prüfung 2).
|
|
import { describe, expect, it, vi } from "vitest";
|
|
import { fireEvent, render, screen } from "@testing-library/react";
|
|
import { Dialog } from "../components/Dialog";
|
|
import { I18nProvider } from "../i18n/i18n";
|
|
|
|
function renderDialog(onClose: () => void) {
|
|
return render(
|
|
<I18nProvider>
|
|
<Dialog open titleId="test-title" title="Test-Dialog" onClose={onClose}>
|
|
<button type="button">Erste Aktion</button>
|
|
<button type="button">Zweite Aktion</button>
|
|
</Dialog>
|
|
</I18nProvider>,
|
|
);
|
|
}
|
|
|
|
describe("Dialog: Tastaturbedienung", () => {
|
|
it("schließt sich bei ESC", () => {
|
|
const onClose = vi.fn();
|
|
renderDialog(onClose);
|
|
fireEvent.keyDown(document, { key: "Escape" });
|
|
expect(onClose).toHaveBeenCalledOnce();
|
|
});
|
|
|
|
it("setzt den Fokus beim Öffnen auf das erste fokussierbare Element", () => {
|
|
renderDialog(vi.fn());
|
|
const closeButton = screen.getByRole("button", { name: /schließen/i });
|
|
expect(document.activeElement).toBe(closeButton);
|
|
});
|
|
|
|
it("ist als modaler Dialog mit Titel-Referenz ausgezeichnet", () => {
|
|
renderDialog(vi.fn());
|
|
const dialog = screen.getByRole("dialog");
|
|
expect(dialog).toHaveAttribute("aria-modal", "true");
|
|
expect(dialog).toHaveAttribute("aria-labelledby", "test-title");
|
|
});
|
|
});
|