fix(test): update ExpertiseCard tests for delayed expand

Tests weren't accounting for the 1 second EXPAND_DELAY before onExpand
is called. Fixed by using fake timers and advancing time. Also added
missing onCollapse prop.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

Author: Dbochman

src/components/ExpertiseCard.test.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen, fireEvent, act } from '@testing-library/react';
 import { ExpertiseCard } from './ExpertiseCard';
 import type { ExpertiseItem } from '@/data/expertise';
 
@@ -10,24 +10,39 @@ const mockItem: ExpertiseItem = {
   skills: ['PagerDuty', 'Runbooks', 'Blameless Culture'],
 };
 
+const noop = () => {};
+
 describe('ExpertiseCard', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
   it('renders the title', () => {
-    render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={() => {}} />);
+    render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={noop} onCollapse={noop} />);
     expect(screen.getByText('Incident Management')).toBeInTheDocument();
   });
 
   it('shows description when expanded', () => {
-    render(<ExpertiseCard item={mockItem} isExpanded={true} onExpand={() => {}} />);
+    render(<ExpertiseCard item={mockItem} isExpanded={true} onExpand={noop} onCollapse={noop} />);
     expect(screen.getByText(mockItem.description)).toBeInTheDocument();
   });
 
-  it('calls onExpand on mouse enter', () => {
+  it('calls onExpand after delay on mouse enter', () => {
     const onExpand = vi.fn();
-    render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} />);
+    render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} onCollapse={noop} />);
 
     const card = screen.getByText('Incident Management').closest('div[tabindex]');
     if (card) {
       fireEvent.mouseEnter(card);
+      expect(onExpand).not.toHaveBeenCalled(); // Not called immediately
+
+      act(() => {
+        vi.advanceTimersByTime(1000); // EXPAND_DELAY
+      });
       expect(onExpand).toHaveBeenCalled();
     }
   });
@@ -41,13 +56,18 @@ describe('ExpertiseCard', () => {
       delete (window as unknown as { gtag?: unknown }).gtag;
     });
 
-    it('fires expertise_card_expand event on first hover when not expanded', () => {
+    it('fires expertise_card_expand event after hover delay when not expanded', () => {
       const onExpand = vi.fn();
-      render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} />);
+      render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} onCollapse={noop} />);
 
       const card = screen.getByText('Incident Management').closest('div[tabindex]');
       if (card) {
         fireEvent.mouseEnter(card);
+        expect(window.gtag).not.toHaveBeenCalled(); // Not immediate
+
+        act(() => {
+          vi.advanceTimersByTime(1000); // EXPAND_DELAY
+        });
 
         expect(window.gtag).toHaveBeenCalledWith('event', 'expertise_card_expand', {
           event_category: 'engagement',
@@ -58,24 +78,29 @@ describe('ExpertiseCard', () => {
 
     it('does not fire event when already expanded', () => {
       const onExpand = vi.fn();
-      render(<ExpertiseCard item={mockItem} isExpanded={true} onExpand={onExpand} />);
+      render(<ExpertiseCard item={mockItem} isExpanded={true} onExpand={onExpand} onCollapse={noop} />);
 
       const card = screen.getByText('Incident Management').closest('div[tabindex]');
       if (card) {
         fireEvent.mouseEnter(card);
 
+        act(() => {
+          vi.advanceTimersByTime(1000);
+        });
+
         expect(window.gtag).not.toHaveBeenCalled();
       }
     });
 
-    it('fires expertise_card_expand event on focus', () => {
+    it('fires expertise_card_expand event on click', () => {
       const onExpand = vi.fn();
-      render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} />);
+      render(<ExpertiseCard item={mockItem} isExpanded={false} onExpand={onExpand} onCollapse={noop} />);
 
       const card = screen.getByText('Incident Management').closest('div[tabindex]');
       if (card) {
-        fireEvent.focus(card);
+        fireEvent.click(card);
 
+        // Click fires immediately (no delay)
         expect(window.gtag).toHaveBeenCalledWith('event', 'expertise_card_expand', {
           event_category: 'engagement',
           event_label: 'Incident Management'