import '@testing-library/jest-dom'; /** * Unit tests for ActivityFeed NaN handling * * This test suite validates that the ActivityFeed component correctly handles * NaN and numeric values in gaming and custom activity data to prevent * "Received NaN for the children attribute" React errors. */ describe('ActivityFeed NaN Handling', () => { describe('Gaming activity rendering logic', () => { // Helper function to simulate getSafeGamingText behavior const getSafeGamingText = (details: string | number | undefined, state: string | number | undefined, fallback: string): string => { if (typeof details === 'string' && details.trim().length > 0) return details; if (typeof state === 'string' && state.trim().length > 0) return state; if (typeof details === 'number' && !isNaN(details)) return String(details); if (typeof state === 'number' && !isNaN(state)) return String(state); return fallback; }; it('should safely handle NaN in gaming.details', () => { const result = getSafeGamingText(NaN, 'Playing', 'Playing...'); expect(result).toBe('Playing'); // Should fall through NaN to state expect(result).not.toBe(NaN); expect(typeof result).toBe('string'); }); it('should safely handle NaN in both gaming.details and gaming.state', () => { const result = getSafeGamingText(NaN, NaN, 'Playing...'); expect(result).toBe('Playing...'); // Should use fallback expect(typeof result).toBe('string'); }); it('should prioritize string details over numeric state', () => { const result = getSafeGamingText('Details text', 42, 'Playing...'); expect(result).toBe('Details text'); // String details takes precedence expect(typeof result).toBe('string'); }); it('should prioritize string state over numeric details', () => { const result = getSafeGamingText(42, 'State text', 'Playing...'); expect(result).toBe('State text'); // String state takes precedence over numeric details expect(typeof result).toBe('string'); }); it('should convert valid numeric details to string', () => { const result = getSafeGamingText(42, undefined, 'Playing...'); expect(result).toBe('42'); expect(typeof result).toBe('string'); }); it('should handle empty strings correctly', () => { const result1 = getSafeGamingText('', 'Playing', 'Playing...'); expect(result1).toBe('Playing'); // Empty string should fall through to state const result2 = getSafeGamingText(' ', 'Playing', 'Playing...'); expect(result2).toBe('Playing'); // Whitespace-only should fall through to state }); it('should convert gaming.name to string safely', () => { const validName = String('Test Game' || ''); expect(validName).toBe('Test Game'); expect(typeof validName).toBe('string'); // In the actual code, we use String(data.gaming.name || '') // If data.gaming.name is NaN, (NaN || '') evaluates to '' because NaN is falsy const nanValue = NaN; const nanName = String(nanValue || ''); expect(nanName).toBe(''); // NaN is falsy, so it falls back to '' expect(typeof nanName).toBe('string'); }); }); describe('Custom activities progress handling', () => { it('should only render progress bar when progress is a valid number', () => { const validProgress = 75; const shouldRender = validProgress !== undefined && typeof validProgress === 'number' && !isNaN(validProgress); expect(shouldRender).toBe(true); }); it('should not render progress bar when progress is NaN', () => { const invalidProgress = NaN; const shouldRender = invalidProgress !== undefined && typeof invalidProgress === 'number' && !isNaN(invalidProgress); expect(shouldRender).toBe(false); }); it('should not render progress bar when progress is undefined', () => { const undefinedProgress = undefined; const shouldRender = undefinedProgress !== undefined && typeof undefinedProgress === 'number' && !isNaN(undefinedProgress); expect(shouldRender).toBe(false); }); }); describe('Custom activities dynamic field rendering', () => { it('should safely convert valid numeric values to string', () => { const value = 42; const shouldRender = typeof value === 'string' || (typeof value === 'number' && !isNaN(value)); expect(shouldRender).toBe(true); if (shouldRender) { const stringValue = String(value); expect(stringValue).toBe('42'); expect(typeof stringValue).toBe('string'); } }); it('should not render NaN values', () => { const value = NaN; const shouldRender = typeof value === 'string' || (typeof value === 'number' && !isNaN(value)); expect(shouldRender).toBe(false); }); it('should render valid string values', () => { const value = 'Test String'; const shouldRender = typeof value === 'string' || (typeof value === 'number' && !isNaN(value)); expect(shouldRender).toBe(true); if (shouldRender) { const stringValue = String(value); expect(stringValue).toBe('Test String'); expect(typeof stringValue).toBe('string'); } }); it('should render zero as a valid numeric value', () => { const value = 0; const shouldRender = typeof value === 'string' || (typeof value === 'number' && !isNaN(value)); expect(shouldRender).toBe(true); if (shouldRender) { const stringValue = String(value); expect(stringValue).toBe('0'); expect(typeof stringValue).toBe('string'); } }); }); });