Feat/frontend tests (#62)

* test(frontend): add vitest test infrastructure - Add vitest, testing-library, jsdom dependencies - Configure vitest with jsdom environment - Add test setup with mocks for fetch, localStorage, matchMedia - Set 75% coverage threshold * Add frontend tests (#61) * Initial plan * Add frontend tests - utilities, hooks, and components (21% coverage) Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add more component tests (Auth, AboutModal, ExportModal) and useRefill hook tests - 30% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add useMedicationForm utility function tests - 30% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add AppHeader tests and more schedule.ts tests - 32% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Changes before error encountered Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Fix page tests and add more tests - 326 tests passing, 34% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add tests for ProfileModal, UserFilterModal, MedDetailModal - 361 tests, 36% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add SharedSchedule tests - 366 tests, 39% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Expand page tests - 383 tests, 39% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Add MobileEditModal tests - 409 tests, 40% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Expand Dashboard and Schedule page tests - 427 tests, 40% coverage Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> * Fix code review issues - remove invalid remindEnabled property Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com> --------- Co-authored-by: Copilot <198982749+Copilot@users.noreply.github.com> Co-authored-by: DanielVolz <3275994+DanielVolz@users.noreply.github.com>
2026-01-22 10:25:11 +01:00
parent 8718311876
commit fd055a3a2a
36 changed files with 7602 additions and 3 deletions
@@ -0,0 +1,100 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { ConfirmModal } from '../../components/ConfirmModal';
+
+describe('ConfirmModal', () => {
+  const defaultProps = {
+    title: 'Confirm Action',
+    message: 'Are you sure you want to proceed?',
+    confirmLabel: 'Yes',
+    cancelLabel: 'No',
+    onConfirm: vi.fn(),
+    onCancel: vi.fn()
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders title', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    expect(screen.getByText('Confirm Action')).toBeInTheDocument();
+  });
+
+  it('renders message as string', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    expect(screen.getByText('Are you sure you want to proceed?')).toBeInTheDocument();
+  });
+
+  it('renders message as ReactNode', () => {
+    render(
+      <ConfirmModal 
+        {...defaultProps} 
+        message={<span data-testid="custom-message">Custom message</span>} 
+      />
+    );
+    expect(screen.getByTestId('custom-message')).toBeInTheDocument();
+  });
+
+  it('renders confirm and cancel buttons', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    expect(screen.getByText('Yes')).toBeInTheDocument();
+    expect(screen.getByText('No')).toBeInTheDocument();
+  });
+
+  it('calls onConfirm when confirm button is clicked', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    fireEvent.click(screen.getByText('Yes'));
+    expect(defaultProps.onConfirm).toHaveBeenCalled();
+  });
+
+  it('calls onCancel when cancel button is clicked', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    fireEvent.click(screen.getByText('No'));
+    expect(defaultProps.onCancel).toHaveBeenCalled();
+  });
+
+  it('calls onCancel when close button is clicked', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    fireEvent.click(screen.getByText('×'));
+    expect(defaultProps.onCancel).toHaveBeenCalled();
+  });
+
+  it('calls onCancel when overlay is clicked', () => {
+    const { container } = render(<ConfirmModal {...defaultProps} />);
+    const overlay = container.querySelector('.modal-overlay');
+    fireEvent.click(overlay!);
+    expect(defaultProps.onCancel).toHaveBeenCalled();
+  });
+
+  it('does not call onCancel when modal content is clicked', () => {
+    const { container } = render(<ConfirmModal {...defaultProps} />);
+    const content = container.querySelector('.modal-content');
+    fireEvent.click(content!);
+    expect(defaultProps.onCancel).not.toHaveBeenCalled();
+  });
+
+  it('disables buttons when loading', () => {
+    render(<ConfirmModal {...defaultProps} isLoading={true} />);
+    expect(screen.getByText('Yes')).toBeDisabled();
+    expect(screen.getByText('No')).toBeDisabled();
+  });
+
+  it('applies primary variant by default', () => {
+    render(<ConfirmModal {...defaultProps} />);
+    const confirmBtn = screen.getByText('Yes');
+    expect(confirmBtn.className).toContain('primary');
+  });
+
+  it('applies danger variant when specified', () => {
+    render(<ConfirmModal {...defaultProps} confirmVariant="danger" />);
+    const confirmBtn = screen.getByText('Yes');
+    expect(confirmBtn.className).toContain('danger');
+  });
+
+  it('applies success variant when specified', () => {
+    render(<ConfirmModal {...defaultProps} confirmVariant="success" />);
+    const confirmBtn = screen.getByText('Yes');
+    expect(confirmBtn.className).toContain('success');
+  });
+});