fix(tests): resolve some broken frontend unit tests for multiple ocr languages

This commit is contained in:
perf3ct 2025-07-14 04:01:15 +00:00
parent ba246c825b
commit c984544106
2 changed files with 79 additions and 40 deletions

View File

@ -40,6 +40,56 @@ const OcrRetryDialog: React.FC<OcrRetryDialogProps> = ({
const [selectedLanguage, setSelectedLanguage] = useState<string>('');
const [retrying, setRetrying] = useState<boolean>(false);
// Simple language code to name mapping for display
const getLanguageDisplayName = (langCode: string): string => {
const languageNames: Record<string, string> = {
'eng': 'English',
'spa': 'Spanish',
'fra': 'French',
'deu': 'German',
'ita': 'Italian',
'por': 'Portuguese',
'rus': 'Russian',
'jpn': 'Japanese',
'chi_sim': 'Chinese (Simplified)',
'chi_tra': 'Chinese (Traditional)',
'kor': 'Korean',
'ara': 'Arabic',
'hin': 'Hindi',
'tha': 'Thai',
'vie': 'Vietnamese',
'pol': 'Polish',
'nld': 'Dutch',
'dan': 'Danish',
'nor': 'Norwegian',
'swe': 'Swedish',
'fin': 'Finnish',
'ces': 'Czech',
'hun': 'Hungarian',
'tur': 'Turkish',
'heb': 'Hebrew',
'ukr': 'Ukrainian',
'bul': 'Bulgarian',
'ron': 'Romanian',
'hrv': 'Croatian',
'slk': 'Slovak',
'slv': 'Slovenian',
'est': 'Estonian',
'lav': 'Latvian',
'lit': 'Lithuanian',
'ell': 'Greek',
'cat': 'Catalan',
'eus': 'Basque',
'gla': 'Scottish Gaelic',
'gle': 'Irish',
'cym': 'Welsh',
'isl': 'Icelandic',
'mlt': 'Maltese',
'afr': 'Afrikaans',
};
return languageNames[langCode] || langCode;
};
const handleRetry = async () => {
if (!document) return;
@ -52,13 +102,14 @@ const OcrRetryDialog: React.FC<OcrRetryDialogProps> = ({
if (response.data.success) {
const waitTime = response.data.estimated_wait_minutes || 'Unknown';
const languageInfo = selectedLanguage ? ` with language "${selectedLanguage}"` : '';
const languageInfo = selectedLanguage ?
` with language "${getLanguageDisplayName(selectedLanguage)}"` : '';
onRetrySuccess(
`OCR retry queued for "${document.filename}"${languageInfo}. Estimated wait time: ${waitTime} minutes.`
);
onClose();
} else {
onRetryError(response.data.message || 'Failed to retry OCR');
onRetryError(response.data.message || 'Failed to retry OCR processing');
}
} catch (error: any) {
console.error('Failed to retry OCR:', error);

View File

@ -3,9 +3,8 @@ import { render, screen, fireEvent, waitFor } from '@testing-library/react';
import { vi, describe, it, expect, beforeEach, afterEach } from 'vitest';
import { ThemeProvider, createTheme } from '@mui/material/styles';
import OcrRetryDialog from '../OcrRetryDialog';
import { ocrService } from '../../../services/api';
// Mock only the API service - let real components render
// Mock the API service completely
const mockOcrService = {
getAvailableLanguages: vi.fn(),
getHealthStatus: vi.fn(),
@ -16,6 +15,26 @@ vi.mock('../../../services/api', () => ({
ocrService: mockOcrService,
}));
// Mock the OcrLanguageSelector to prevent API calls
vi.mock('../OcrLanguageSelector', () => ({
default: ({ value, onChange, label }: any) => (
<div>
<label htmlFor="ocr-language">{label}</label>
<select
id="ocr-language"
value={value}
onChange={(e) => onChange(e.target.value)}
aria-label={label}
>
<option value="">Default</option>
<option value="eng">English</option>
<option value="spa">Spanish</option>
<option value="fra">French</option>
</select>
</div>
),
}));
const theme = createTheme();
const renderWithTheme = (component: React.ReactElement) => {
@ -55,16 +74,6 @@ describe('OcrRetryDialog', () => {
beforeEach(() => {
vi.clearAllMocks();
mockOcrService.retryWithLanguage.mockResolvedValue(mockRetryResponse);
mockOcrService.getAvailableLanguages.mockResolvedValue({
data: {
available_languages: [
{ code: 'eng', name: 'English', installed: true },
{ code: 'spa', name: 'Spanish', installed: true },
{ code: 'fra', name: 'French', installed: true },
],
current_user_language: 'eng',
},
});
});
afterEach(() => {
@ -103,29 +112,16 @@ describe('OcrRetryDialog', () => {
it('renders language selector', async () => {
renderWithTheme(<OcrRetryDialog {...defaultProps} />);
// Wait for the language selector to load
await waitFor(() => {
expect(screen.getByLabelText(/OCR Language/i)).toBeInTheDocument();
});
expect(screen.getByLabelText(/OCR Language/i)).toBeInTheDocument();
});
it('handles language selection', async () => {
renderWithTheme(<OcrRetryDialog {...defaultProps} />);
// Wait for the language selector to load
await waitFor(() => {
expect(screen.getByLabelText(/OCR Language/i)).toBeInTheDocument();
});
const languageSelect = screen.getByLabelText(/OCR Language/i);
fireEvent.mouseDown(languageSelect);
fireEvent.change(languageSelect, { target: { value: 'spa' } });
// Select Spanish from dropdown
await waitFor(() => {
fireEvent.click(screen.getByText('Spanish'));
});
expect(languageSelect).toHaveDisplayValue('Spanish');
expect(languageSelect).toHaveValue('spa');
});
it('calls onRetrySuccess when retry succeeds', async () => {
@ -137,17 +133,9 @@ describe('OcrRetryDialog', () => {
/>
);
// Wait for component to load and select a language
await waitFor(() => {
expect(screen.getByLabelText(/OCR Language/i)).toBeInTheDocument();
});
// Select a language
const languageSelect = screen.getByLabelText(/OCR Language/i);
fireEvent.mouseDown(languageSelect);
await waitFor(() => {
fireEvent.click(screen.getByText('Spanish'));
});
fireEvent.change(languageSelect, { target: { value: 'spa' } });
// Click retry button
fireEvent.click(screen.getByText('Retry OCR'));