diff --git a/components/ShareButtons.test.tsx b/components/ShareButtons.test.tsx new file mode 100644 index 00000000..40cd8ba0 --- /dev/null +++ b/components/ShareButtons.test.tsx @@ -0,0 +1,57 @@ +import { render, screen } from '@testing-library/react'; +import '@testing-library/jest-dom/vitest'; +import { describe, it, expect } from 'vitest'; +import ShareButtons from './ShareButtons'; + +const TEST_URL = 'https://commitpulse.vercel.app/dashboard/testuser'; +const TEST_TITLE = 'Check out my CommitPulse streak!'; + +describe('ShareButtons', () => { + it('renders LinkedIn and Twitter share buttons', () => { + render(); + + expect(screen.getByRole('link', { name: /linkedin/i })).toBeInTheDocument(); + expect(screen.getByRole('link', { name: /twitter/i })).toBeInTheDocument(); + }); + + it('LinkedIn share link contains correctly encoded URL', () => { + render(); + + const linkedin = screen.getByRole('link', { name: /linkedin/i }); + expect(linkedin).toHaveAttribute( + 'href', + `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(TEST_URL)}` + ); + }); + + it('Twitter share link contains correctly encoded URL and title', () => { + render(); + + const twitter = screen.getByRole('link', { name: /twitter/i }); + const expected = + `https://x.com/intent/tweet?url=${encodeURIComponent(TEST_URL)}` + + `&text=${encodeURIComponent(TEST_TITLE)}`; + expect(twitter).toHaveAttribute('href', expected); + }); + + it('Twitter share link omits text parameter when title is not provided', () => { + render(); + + const twitter = screen.getByRole('link', { name: /twitter/i }); + expect(twitter).toHaveAttribute( + 'href', + `https://x.com/intent/tweet?url=${encodeURIComponent(TEST_URL)}` + ); + expect(twitter.getAttribute('href')).not.toContain('&text='); + }); + + it('sets target="_blank" and rel="noopener noreferrer" on all share links', () => { + render(); + + const links = screen.getAllByRole('link'); + links.forEach((link) => { + expect(link).toHaveAttribute('target', '_blank'); + expect(link).toHaveAttribute('rel', 'noopener noreferrer'); + }); + }); +});