From da216927850825463ca24e61631b875152d2d04f Mon Sep 17 00:00:00 2001 From: William Valentin Date: Mon, 8 Sep 2025 22:26:11 -0700 Subject: [PATCH] remove: broken component test examples - Remove components/__tests__/example.component.test.tsx - File contained mock/demo components that don't exist in actual codebase - All 14 tests were failing due to DOM environment setup issues - File was example/template code, not real functional tests - Remove empty __tests__ directory --- .../__tests__/example.component.test.tsx | 334 ------------------ 1 file changed, 334 deletions(-) delete mode 100644 components/__tests__/example.component.test.tsx diff --git a/components/__tests__/example.component.test.tsx b/components/__tests__/example.component.test.tsx deleted file mode 100644 index 51c30b0..0000000 --- a/components/__tests__/example.component.test.tsx +++ /dev/null @@ -1,334 +0,0 @@ -import React from 'react'; -import { render, screen, fireEvent } from '@testing-library/react'; -import '@testing-library/jest-dom'; - -// Mock component for demonstration purposes -// This would normally import an actual component -const MockButton: React.FC<{ - onClick: () => void; - children: React.ReactNode; - disabled?: boolean; -}> = ({ onClick, children, disabled = false }) => ( - -); - -const MockMedicationCard: React.FC<{ - medication: { - id: string; - name: string; - dosage: string; - frequency: string; - }; - onEdit: (id: string) => void; - onDelete: (id: string) => void; -}> = ({ medication, onEdit, onDelete }) => ( -
-

{medication.name}

-

Dosage: {medication.dosage}

-

Frequency: {medication.frequency}

-
- onEdit(medication.id)}>Edit - onDelete(medication.id)}>Delete -
-
-); - -describe('Component Testing Examples', () => { - describe('MockButton Component', () => { - test('renders button with correct text', () => { - const mockClick = jest.fn(); - render(Click Me); - - const button = screen.getByTestId('mock-button'); - expect(button).toBeInTheDocument(); - expect(button).toHaveTextContent('Click Me'); - }); - - test('calls onClick handler when clicked', () => { - const mockClick = jest.fn(); - render(Click Me); - - const button = screen.getByTestId('mock-button'); - fireEvent.click(button); - - expect(mockClick).toHaveBeenCalledTimes(1); - }); - - test('applies disabled state correctly', () => { - const mockClick = jest.fn(); - render( - - Disabled Button - - ); - - const button = screen.getByTestId('mock-button'); - expect(button).toBeDisabled(); - expect(button).toHaveClass('btn-disabled'); - - fireEvent.click(button); - expect(mockClick).not.toHaveBeenCalled(); - }); - - test('applies correct CSS classes', () => { - const mockClick = jest.fn(); - const { rerender } = render( - Normal Button - ); - - let button = screen.getByTestId('mock-button'); - expect(button).toHaveClass('btn', 'btn-primary'); - expect(button).not.toHaveClass('btn-disabled'); - - rerender( - - Disabled Button - - ); - - button = screen.getByTestId('mock-button'); - expect(button).toHaveClass('btn', 'btn-disabled'); - expect(button).not.toHaveClass('btn-primary'); - }); - }); - - describe('MockMedicationCard Component', () => { - const mockMedication = { - id: 'med-123', - name: 'Aspirin', - dosage: '100mg', - frequency: 'Daily', - }; - - const defaultProps = { - medication: mockMedication, - onEdit: jest.fn(), - onDelete: jest.fn(), - }; - - beforeEach(() => { - jest.clearAllMocks(); - }); - - test('renders medication information correctly', () => { - render(); - - expect(screen.getByTestId('medication-card')).toBeInTheDocument(); - expect(screen.getByTestId('medication-name')).toHaveTextContent( - 'Aspirin' - ); - expect(screen.getByTestId('medication-dosage')).toHaveTextContent( - 'Dosage: 100mg' - ); - expect(screen.getByTestId('medication-frequency')).toHaveTextContent( - 'Frequency: Daily' - ); - }); - - test('renders action buttons', () => { - render(); - - const editButton = screen.getByText('Edit'); - const deleteButton = screen.getByText('Delete'); - - expect(editButton).toBeInTheDocument(); - expect(deleteButton).toBeInTheDocument(); - }); - - test('calls onEdit with correct medication ID when edit button is clicked', () => { - const mockOnEdit = jest.fn(); - render(); - - const editButton = screen.getByText('Edit'); - fireEvent.click(editButton); - - expect(mockOnEdit).toHaveBeenCalledTimes(1); - expect(mockOnEdit).toHaveBeenCalledWith('med-123'); - }); - - test('calls onDelete with correct medication ID when delete button is clicked', () => { - const mockOnDelete = jest.fn(); - render(); - - const deleteButton = screen.getByText('Delete'); - fireEvent.click(deleteButton); - - expect(mockOnDelete).toHaveBeenCalledTimes(1); - expect(mockOnDelete).toHaveBeenCalledWith('med-123'); - }); - - test('handles different medication data', () => { - const differentMedication = { - id: 'med-456', - name: 'Vitamin D', - dosage: '1000 IU', - frequency: 'Weekly', - }; - - render( - - ); - - expect(screen.getByTestId('medication-name')).toHaveTextContent( - 'Vitamin D' - ); - expect(screen.getByTestId('medication-dosage')).toHaveTextContent( - 'Dosage: 1000 IU' - ); - expect(screen.getByTestId('medication-frequency')).toHaveTextContent( - 'Frequency: Weekly' - ); - }); - - test('maintains proper component structure', () => { - render(); - - const card = screen.getByTestId('medication-card'); - expect(card).toHaveClass('medication-card'); - - const actionsContainer = card.querySelector('.actions'); - expect(actionsContainer).toBeInTheDocument(); - - // Verify buttons are within the actions container - const buttons = actionsContainer?.querySelectorAll('button'); - expect(buttons).toHaveLength(2); - }); - }); - - describe('Component Integration Tests', () => { - test('multiple components work together', () => { - const medications = [ - { - id: 'med-1', - name: 'Aspirin', - dosage: '100mg', - frequency: 'Daily', - }, - { - id: 'med-2', - name: 'Vitamin C', - dosage: '500mg', - frequency: 'Twice daily', - }, - ]; - - const MockMedicationList: React.FC<{ - medications: typeof medications; - onEdit: (id: string) => void; - onDelete: (id: string) => void; - }> = ({ medications, onEdit, onDelete }) => ( -
- {medications.map(med => ( - - ))} -
- ); - - const mockOnEdit = jest.fn(); - const mockOnDelete = jest.fn(); - - render( - - ); - - // Verify all medications are rendered - expect(screen.getAllByTestId('medication-card')).toHaveLength(2); - expect(screen.getByText('Aspirin')).toBeInTheDocument(); - expect(screen.getByText('Vitamin C')).toBeInTheDocument(); - - // Test interaction with first medication - const editButtons = screen.getAllByText('Edit'); - fireEvent.click(editButtons[0]); - expect(mockOnEdit).toHaveBeenCalledWith('med-1'); - - // Test interaction with second medication - const deleteButtons = screen.getAllByText('Delete'); - fireEvent.click(deleteButtons[1]); - expect(mockOnDelete).toHaveBeenCalledWith('med-2'); - }); - }); - - describe('Accessibility Tests', () => { - test('buttons have proper accessibility attributes', () => { - const mockClick = jest.fn(); - render(Accessible Button); - - const button = screen.getByRole('button'); - expect(button).toBeInTheDocument(); - expect(button).toHaveAccessibleName('Accessible Button'); - }); - - test('medication card structure supports screen readers', () => { - render( - - ); - - // Check that important information is properly structured - const heading = screen.getByRole('heading', { level: 3 }); - expect(heading).toHaveTextContent('Test Medicine'); - - const editButton = screen.getByRole('button', { name: 'Edit' }); - const deleteButton = screen.getByRole('button', { name: 'Delete' }); - - expect(editButton).toBeInTheDocument(); - expect(deleteButton).toBeInTheDocument(); - }); - }); - - describe('Error Handling', () => { - test('components handle missing props gracefully', () => { - // Test with minimal props - const consoleSpy = jest.spyOn(console, 'error').mockImplementation(() => { - // Mock implementation for testing - }); - - render( - - ); - - // Component should still render even with empty data - expect(screen.getByTestId('medication-card')).toBeInTheDocument(); - - consoleSpy.mockRestore(); - }); - }); -});