fix: open a recipient's menu when its chip is clicked

components/email/__tests__/composer-a11y.test.tsx

@@ -394,6 +394,21 @@ describe('moving a recipient by keyboard (MO-07)', () => {
     expect(liveRegion()).toHaveTextContent('recipient_moved:Anna Berg|cc');
   });
 
+  // compose-p2-16: a click did nothing visible, and Escape then closed the composer.
+  it('opens the chip menu on a click, and Escape closes only the menu', async () => {
+    const onClose = vi.fn();
+    render(<EmailComposer initialData={{ ...DRAFT, to: 'anna@example.com' }} onClose={onClose} />);
+    const chip = within(screen.getByRole('list', { name: 'to:' })).getByRole('listitem');
+    fireEvent.click(chip.querySelector('.truncate')!);
+
+    const move = await screen.findByTestId('recipient-move-bcc');
+    fireEvent.keyDown(move, { key: 'Escape' });
+
+    await waitFor(() => expect(screen.queryByTestId('recipient-move-bcc')).toBeNull());
+    expect(onClose).not.toHaveBeenCalled();
+    expect(screen.getAllByRole('listitem')).toHaveLength(1);
+  });
+
   it('opens the chip menu with Shift+F10 too', async () => {
     render(<EmailComposer initialData={{ ...DRAFT, to: 'anna@example.com' }} />);
     const chip = within(screen.getByRole('list', { name: 'to:' })).getByRole('listitem');

components/email/email-composer.tsx

@@ -6860,6 +6860,14 @@ export function RecipientChipInput({
                 !isEditing && "focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary"
               )}
               onContextMenu={isEditing ? undefined : (e) => handleContextMenu(e, i, chip)}
+              // A click opens the chip's menu too (address, Edit, Move to,
+              // Remove), as Gmail and Outlook do; it did nothing visible.
+              onClick={isEditing ? undefined : (e) => {
+                if (e.target instanceof Element && e.target.closest('button')) return;
+                // Not on to the field, whose click puts the caret in the input.
+                e.stopPropagation();
+                openChipMenu(i);
+              }}
               data-invalid={isInvalid || undefined}
               title={isInvalid ? t('invalid_recipient') : undefined}
               role="listitem"