diff --git a/app/components/SuccessGuide.massive-scaling.test.tsx b/app/components/SuccessGuide.massive-scaling.test.tsx new file mode 100644 index 000000000..e6bf30b1a --- /dev/null +++ b/app/components/SuccessGuide.massive-scaling.test.tsx @@ -0,0 +1,93 @@ +import { describe, it, expect, vi } from 'vitest'; +import { render, screen, fireEvent } from '@testing-library/react'; +import type { ReactNode } from 'react'; +import { SuccessGuide } from './SuccessGuide'; + +vi.mock('framer-motion', () => ({ + motion: { + div: ({ children, ...props }: { children?: ReactNode }) =>
{children}
, + }, +})); + +vi.mock('./Icons', () => ({ + CloseIcon: () => CloseIcon, +})); + +vi.mock('@/context/TranslationContext', () => ({ + useTranslation: () => ({ + t: (key: string) => key, + }), +})); + +describe('SuccessGuide massive scaling', () => { + const createLargeMarkdown = () => + Array.from( + { length: 5000 }, + (_, i) => `![badge-${i}](https://commitpulse.vercel.app/api/streak?user=user${i})` + ).join('\n'); + + it('renders extremely large markdown payloads without truncation', () => { + const markdown = createLargeMarkdown(); + + render(); + + const codeElement = screen.getByLabelText('Your badge markdown snippet'); + + expect(codeElement.textContent).toBe(markdown); + }); + + it('preserves all guide steps when rendering large markdown content', () => { + const markdown = createLargeMarkdown(); + + render(); + + expect(screen.getByText('01')).toBeInTheDocument(); + expect(screen.getByText('02')).toBeInTheDocument(); + expect(screen.getByText('03')).toBeInTheDocument(); + expect(screen.getByText('04')).toBeInTheDocument(); + }); + + it('renders repeatedly without layout instability', () => { + const markdown = createLargeMarkdown(); + + for (let i = 0; i < 100; i++) { + const { unmount } = render(); + + expect(screen.getByRole('region')).toBeInTheDocument(); + + unmount(); + } + }); + + it('maintains acceptable render performance under repeated mounts', () => { + const markdown = createLargeMarkdown(); + + const start = performance.now(); + + for (let i = 0; i < 50; i++) { + const { unmount } = render(); + + unmount(); + } + + const duration = performance.now() - start; + + expect(duration).toBeLessThan(5000); + }); + + it('keeps dismiss functionality stable under heavy rendering conditions', () => { + const onDismiss = vi.fn(); + + render(); + + const dismissButton = screen.getByRole('button', { + name: /dismiss guide/i, + }); + + for (let i = 0; i < 25; i++) { + fireEvent.click(dismissButton); + } + + expect(onDismiss).toHaveBeenCalledTimes(25); + }); +});