fix(frontend): increase dismiss button touch target to 44×44px (WCAG 2.5.5)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -82,7 +82,7 @@ async function startTraining() {
|
||||
{successMessage}
|
||||
<button
|
||||
type="button"
|
||||
class="ml-1 inline-flex h-6 w-6 items-center justify-center rounded-sm underline hover:no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
|
||||
class="-my-2 ml-1 inline-flex h-11 w-11 items-center justify-center rounded-sm underline hover:no-underline focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:outline-none"
|
||||
onclick={() => (successMessage = null)}
|
||||
aria-label={m.comp_dismiss()}>×</button
|
||||
>
|
||||
|
||||
@@ -73,6 +73,24 @@ describe('OcrTrainingCard — enabled state', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('OcrTrainingCard — success dismiss button', () => {
|
||||
it('dismiss button has 44×44px touch target (h-11 w-11)', async () => {
|
||||
vi.stubGlobal('fetch', vi.fn().mockResolvedValue({ ok: true }));
|
||||
|
||||
render(OcrTrainingCard, { trainingInfo: baseInfo });
|
||||
|
||||
const btn = page.getByRole('button', { name: /Training starten/i });
|
||||
await btn.click();
|
||||
|
||||
const dismissBtn = page.getByRole('button', { name: /Schließen/i });
|
||||
await expect.element(dismissBtn).toBeInTheDocument();
|
||||
|
||||
const el = await dismissBtn.element();
|
||||
expect(el.classList.contains('h-11')).toBe(true);
|
||||
expect(el.classList.contains('w-11')).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('OcrTrainingCard — in-flight state', () => {
|
||||
it('shows "…" while POST is in-flight', async () => {
|
||||
let resolveFetch!: (v: unknown) => void;
|
||||
|
||||
Reference in New Issue
Block a user