fix(logos): Fokus auf die Überschrift ohne Scrollen
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
6e5fe3e199
commit
13b46da2e0
2 files changed
+10
-2
No files matched your search
@@ -534,7 +534,7 @@ describe('Mehr laden', () => {
|
|||||||
expect(document.activeElement).toBe(retryButton());
|
expect(document.activeElement).toBe(retryButton());
|
||||||
});
|
});
|
||||||
|
|
||||||
it('„Nochmal versuchen“ verschwindet beim Klick: der Fokus geht sofort auf die Überschrift, nicht ins Leere', async () => {
|
it('„Nochmal versuchen” verschwindet beim Klick: der Fokus geht sofort auf die Überschrift, nicht ins Leere', async () => {
|
||||||
fx.listLogos.mockRejectedValueOnce(new Error('offline'));
|
fx.listLogos.mockRejectedValueOnce(new Error('offline'));
|
||||||
await mount();
|
await mount();
|
||||||
expect(retryButton().hidden).toBe(false);
|
expect(retryButton().hidden).toBe(false);
|
||||||
@@ -542,9 +542,11 @@ describe('Mehr laden', () => {
|
|||||||
expect(document.activeElement).toBe(retryButton());
|
expect(document.activeElement).toBe(retryButton());
|
||||||
const slow = deferred<{ logos: CommunityLogo[]; nextCursor: string | null }>();
|
const slow = deferred<{ logos: CommunityLogo[]; nextCursor: string | null }>();
|
||||||
fx.listLogos.mockReturnValue(slow.promise);
|
fx.listLogos.mockReturnValue(slow.promise);
|
||||||
|
const focusSpy = vi.spyOn(heading(), 'focus');
|
||||||
retryButton().click();
|
retryButton().click();
|
||||||
expect(retryButton().hidden).toBe(true);
|
expect(retryButton().hidden).toBe(true);
|
||||||
expect(document.activeElement).toBe(heading());
|
expect(document.activeElement).toBe(heading());
|
||||||
|
expect(focusSpy).toHaveBeenCalledWith({ preventScroll: true });
|
||||||
slow.resolve({ logos: [logo('a')], nextCursor: null });
|
slow.resolve({ logos: [logo('a')], nextCursor: null });
|
||||||
await flush();
|
await flush();
|
||||||
expect(names()).toEqual(['Kein Logo', 'Logo A']);
|
expect(names()).toEqual(['Kein Logo', 'Logo A']);
|
||||||
|
|||||||
@@ -351,7 +351,13 @@ export function createLogoPicker(handlers: LogoPickerHandlers, deps: LogoPickerD
|
|||||||
// Platz einnimmt („Nochmal versuchen“ nach einem Fehler), sonst an die erste neue Kachel, sonst an die Überschrift.
|
// Platz einnimmt („Nochmal versuchen“ nach einem Fehler), sonst an die erste neue Kachel, sonst an die Überschrift.
|
||||||
if ((focused === moreButton && moreButton.hidden) || (focused === retryButton && retryButton.hidden)) {
|
if ((focused === moreButton && moreButton.hidden) || (focused === retryButton && retryButton.hidden)) {
|
||||||
const successor = [moreButton, retryButton].find((button) => !button.hidden && !button.disabled);
|
const successor = [moreButton, retryButton].find((button) => !button.hidden && !button.disabled);
|
||||||
(successor ?? (firstNew?.isConnected ? firstNew : heading)).focus();
|
if (successor) {
|
||||||
|
successor.focus();
|
||||||
|
} else if (firstNew?.isConnected) {
|
||||||
|
firstNew.focus();
|
||||||
|
} else {
|
||||||
|
heading.focus({ preventScroll: true });
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in new issue
Block a user