diff --git a/components/ui/__tests__/welcome-banner.test.tsx b/components/ui/__tests__/welcome-banner.test.tsx index f91c9b069..2ff6b50fb 100644 --- a/components/ui/__tests__/welcome-banner.test.tsx +++ b/components/ui/__tests__/welcome-banner.test.tsx @@ -1,4 +1,4 @@ -import { render, screen } from '@testing-library/react'; +import { fireEvent, render, screen } from '@testing-library/react'; import { beforeEach, describe, expect, it, vi } from 'vitest'; import React from 'react'; @@ -35,3 +35,18 @@ describe('WelcomeBanner tips', () => { expect(screen.queryByText('tip_shortcuts')).toBeNull(); }); }); + +describe('WelcomeBanner and Escape', () => { + beforeEach(() => { + useSettingsStore.setState({ onboardingCompleted: false }); + }); + + it('stays when Escape is pressed elsewhere, and is not marked as seen', () => { + device.isMobile = false; + render(); + fireEvent.keyDown(window, { key: 'Escape' }); + fireEvent.keyDown(document.body, { key: 'Escape' }); + expect(screen.getByRole('complementary')).toBeInTheDocument(); + expect(useSettingsStore.getState().onboardingCompleted).toBe(false); + }); +}); diff --git a/components/ui/welcome-banner.tsx b/components/ui/welcome-banner.tsx index 736418b37..58678242b 100644 --- a/components/ui/welcome-banner.tsx +++ b/components/ui/welcome-banner.tsx @@ -59,14 +59,9 @@ export function WelcomeBanner() { } catch { /* localStorage unavailable */ } }, [updateSetting]); - useEffect(() => { - if (!visible) return; - const handle = (e: KeyboardEvent) => { - if (e.key === "Escape") dismiss(); - }; - window.addEventListener("keydown", handle); - return () => window.removeEventListener("keydown", handle); - }, [visible, dismiss]); + // No Escape handler: Escape closes whatever has the focus (a message, a + // dialog, a selection) and must not hide these tips for good (R8). The X + // and "Got it" dismiss them. if (!visible) return null;