|
| 1 | +import React from 'react'; |
| 2 | +import { renderWithContext, mockDispatch, defaultMockState } from '../../test/test.utils'; |
| 3 | +import { FeatureCard, TextFieldCard } from './Cards'; |
| 4 | +import { screen, fireEvent } from '@testing-library/react'; |
| 5 | +import { SidebarOptions } from '../SidebarView/SidebarView'; |
| 6 | +import { TextField } from '@fluentui/react/lib/TextField'; |
| 7 | + |
| 8 | +// Mock icon for testing |
| 9 | +const MockIcon = () => <div>Mock Icon</div>; |
| 10 | + |
| 11 | +describe('FeatureCard', () => { |
| 12 | + const mockProps = { |
| 13 | + title: 'Test Feature', |
| 14 | + description: 'This is a test feature description', |
| 15 | + icon: <MockIcon />, |
| 16 | + featureSelection: SidebarOptions.Article, |
| 17 | + }; |
| 18 | + |
| 19 | + it('renders FeatureCard correctly', () => { |
| 20 | + renderWithContext(<FeatureCard {...mockProps} />); |
| 21 | + expect(screen.getByText('Test Feature')).toBeInTheDocument(); |
| 22 | + expect(screen.getByText('This is a test feature description')).toBeInTheDocument(); |
| 23 | + expect(screen.getByText('Mock Icon')).toBeInTheDocument(); |
| 24 | + }); |
| 25 | + |
| 26 | + it('calls dispatch with correct payload when clicked', () => { |
| 27 | + renderWithContext(<FeatureCard {...mockProps} />); |
| 28 | + const cardElement = screen.getByText('Test Feature').closest('div'); |
| 29 | + fireEvent.click(cardElement!); |
| 30 | + expect(mockDispatch).toHaveBeenCalledWith({ |
| 31 | + type: 'UPDATE_SIDEBAR_SELECTION', |
| 32 | + payload: SidebarOptions.Article, |
| 33 | + }); |
| 34 | + }); |
| 35 | +}); |
| 36 | + |
| 37 | +describe('TextFieldCard', () => { |
| 38 | + it('renders TextFieldCard with initial state', () => { |
| 39 | + renderWithContext(<TextFieldCard />); |
| 40 | + expect(screen.getByText('Topic')).toBeInTheDocument(); |
| 41 | + expect(screen.getByText('Enter an initial prompt that will exist across all three modes, Articles, Grants, and Drafts.')).toBeInTheDocument(); |
| 42 | + expect(screen.getByPlaceholderText('Research Topic')).toHaveValue(defaultMockState.researchTopic); |
| 43 | + }); |
| 44 | + |
| 45 | + it('updates research topic on text input', () => { |
| 46 | + const updatedTopic = 'New Research Topic'; |
| 47 | + renderWithContext(<TextFieldCard />); |
| 48 | + const input = screen.getByPlaceholderText('Research Topic'); |
| 49 | + |
| 50 | + fireEvent.change(input, { target: { value: updatedTopic } }); |
| 51 | + |
| 52 | + expect(mockDispatch).toHaveBeenCalledWith({ |
| 53 | + type: 'UPDATE_RESEARCH_TOPIC', |
| 54 | + payload: updatedTopic, |
| 55 | + }); |
| 56 | + }); |
| 57 | +}); |
0 commit comments