diff --git a/components/email/__tests__/more-actions-menu.test.tsx b/components/email/__tests__/more-actions-menu.test.tsx index 33bb3d859..598438a8f 100644 --- a/components/email/__tests__/more-actions-menu.test.tsx +++ b/components/email/__tests__/more-actions-menu.test.tsx @@ -207,7 +207,21 @@ describe('phone touch targets (MAIL-18)', () => { expect(close.className).toContain('h-11'); expect(close.className).toContain('w-11'); const star = screen.getByTestId('subject-star'); - expect(star).toHaveAccessibleName('tooltips.star'); + expect(star).toHaveAccessibleName('star'); expect(star.className).toContain('pointer-coarse:after:min-h-11'); }); }); + +// R8: a key hint means nothing on a touch screen, and a screen reader read +// "Reply (r)". The names are the plain ones; a hint stays in the tooltip. +describe('phone reader names (MAIL-20)', () => { + it('names the bottom bar and the star without key hints', () => { + renderViewer({ onToggleStar: vi.fn(), onReply: vi.fn(), onReplyAll: vi.fn(), onForward: vi.fn() }); + expect(screen.getByTestId('subject-star')).toHaveAccessibleName('star'); + for (const name of ['reply', 'reply_all', 'forward']) { + expect(screen.getAllByRole('button', { name }).length).toBeGreaterThan(0); + } + const hinted = screen.queryAllByRole('button').filter((b) => /^tooltips\.(reply|reply_all|forward|star|unstar)$/.test(b.getAttribute('aria-label') ?? '')); + expect(hinted).toEqual([]); + }); +}); diff --git a/components/email/email-viewer.tsx b/components/email/email-viewer.tsx index d57e8aa9e..cc87d485b 100644 --- a/components/email/email-viewer.tsx +++ b/components/email/email-viewer.tsx @@ -905,7 +905,7 @@ export function MvExpandedConversationCard({ onClick={() => onReply(email)} className="grid place-items-center w-10 h-10 -my-2 -me-2 rounded-full text-muted-foreground hover:bg-muted hover:text-foreground transition-colors flex-shrink-0" title={t('tooltips.reply')} - aria-label={t('tooltips.reply')} + aria-label={t('reply')} > @@ -4624,7 +4624,8 @@ export function EmailViewer({ {toolbarPosition === 'top' && !mvViewer && ( @@ -4825,7 +4826,7 @@ export function EmailViewer({ onClick={() => onReply?.()} className="grid place-items-center w-10 h-10 rounded-full text-muted-foreground hover:bg-muted hover:text-foreground transition-colors" title={t('tooltips.reply')} - aria-label={t('tooltips.reply')} + aria-label={t('reply')} > @@ -6303,7 +6304,6 @@ export function EmailViewer({