test: import testing lib functions from utils

src/components/ExternalLink/__tests__/ExternalLink.spec.tsx

@@ -1,25 +1,23 @@
-import { render, screen } from '@testing-library/react';
+import { render, screen } from '@/utils/testUtils';
 import { ExternalLink } from '..';
 
-describe('ExternalLink component', () => {
-  it('renders children correctly', () => {
-    const testText = 'Test Link';
-    render(<ExternalLink href="http://test.com">{testText}</ExternalLink>);
-    const linkElement = screen.getByText(testText);
-    expect(linkElement).toBeInTheDocument();
-  });
+test('renders children correctly', () => {
+  const testText = 'Test Link';
+  render(<ExternalLink href="http://test.com">{testText}</ExternalLink>);
+  const linkElement = screen.getByText(testText);
+  expect(linkElement).toBeInTheDocument();
+});
 
-  it('has correct href attribute', () => {
-    const testHref = 'http://test.com';
-    render(<ExternalLink href={testHref}>Test Link</ExternalLink>);
-    const linkElement = screen.getByRole('link');
-    expect(linkElement).toHaveAttribute('href', testHref);
-  });
+test('has correct href attribute', () => {
+  const testHref = 'http://test.com';
+  render(<ExternalLink href={testHref}>Test Link</ExternalLink>);
+  const linkElement = screen.getByRole('link');
+  expect(linkElement).toHaveAttribute('href', testHref);
+});
 
-  it('opens in new tab', () => {
-    render(<ExternalLink href="http://test.com">Test Link</ExternalLink>);
-    const linkElement = screen.getByRole('link');
-    expect(linkElement).toHaveAttribute('target', '_blank');
-    expect(linkElement).toHaveAttribute('rel', 'noopener noreferrer');
-  });
+test('opens in new tab', () => {
+  render(<ExternalLink href="http://test.com">Test Link</ExternalLink>);
+  const linkElement = screen.getByRole('link');
+  expect(linkElement).toHaveAttribute('target', '_blank');
+  expect(linkElement).toHaveAttribute('rel', 'noopener noreferrer');
 });

src/components/Footer/__tests__/Footer.spec.tsx

@@ -1,40 +1,38 @@
-import { render, screen } from '@testing-library/react';
+import { render, screen } from '@/utils/testUtils';
 import { Footer } from '..';
 
-describe('Footer component', () => {
-  test('renders correctly', () => {
-    render(<Footer />);
-    expect(screen.getByTestId('footer')).toBeInTheDocument();
-  });
+test('renders correctly', () => {
+  render(<Footer />);
+  expect(screen.getByTestId('footer')).toBeInTheDocument();
+});
 
-  describe('author rights', () => {
-    const currentYear = new Date().getFullYear();
-    const domain = 'albertosantos.dev';
+describe('Author rights', () => {
+  const currentYear = new Date().getFullYear();
+  const domain = 'albertosantos.dev';
 
-    test('renders the domain', () => {
-      render(<Footer />);
-      expect(screen.getByText(domain)).toBeInTheDocument();
-    });
-    test('renders the current year', () => {
-      render(<Footer />);
-      expect(screen.getByTestId('author-rights')).toHaveTextContent(
-        `©${currentYear} - Todos os direitos reservados.`
-      );
-    });
+  test('renders the domain', () => {
+    render(<Footer />);
+    expect(screen.getByText(domain)).toBeInTheDocument();
+  });
+  test('renders the current year', () => {
+    render(<Footer />);
+    expect(screen.getByTestId('author-rights')).toHaveTextContent(
+      `©${currentYear} - Todos os direitos reservados.`
+    );
   });
+});
 
-  describe('powered by', () => {
-    test('renders the text', () => {
-      render(<Footer />);
-      expect(screen.getByText('Powered')).toBeInTheDocument();
-    });
+describe('Powered by', () => {
+  test('renders the text', () => {
+    render(<Footer />);
+    expect(screen.getByText('Powered')).toBeInTheDocument();
+  });
 
-    test('renders the logo', () => {
-      render(<Footer />);
-      const logoImage = screen.getByTestId('logo-image');
-      expect(logoImage).toBeInTheDocument();
-      expect(logoImage.tagName).toBe('IMG');
-      expect(logoImage).toHaveAttribute('alt', 'Logotipo vermelha');
-    });
+  test('renders the logo', () => {
+    render(<Footer />);
+    const logoImage = screen.getByTestId('logo-image');
+    expect(logoImage).toBeInTheDocument();
+    expect(logoImage.tagName).toBe('IMG');
+    expect(logoImage).toHaveAttribute('alt', 'Logotipo vermelha');
   });
 });

src/components/Header/__tests__/Header.spec.tsx

@@ -1,28 +1,26 @@
-import { render, screen } from '@testing-library/react';
+import { render, screen } from '@/utils/testUtils';
 import { Header } from '..';
 
-describe('Header component', () => {
-  test('renders correctly', () => {
-    render(<Header />);
-    expect(screen.getByTestId('header')).toBeInTheDocument();
-  });
+test('renders correctly', () => {
+  render(<Header />);
+  expect(screen.getByTestId('header')).toBeInTheDocument();
+});
 
-  test('renders logo image', () => {
-    render(<Header />);
-    const logoImage = screen.getByTestId('logo-image');
-    expect(logoImage).toBeInTheDocument();
-    expect(logoImage.tagName).toBe('IMG');
-    expect(logoImage).toHaveAttribute('alt', 'Logotipo vermelha');
-  });
+test('renders logo image', () => {
+  render(<Header />);
+  const logoImage = screen.getByTestId('logo-image');
+  expect(logoImage).toBeInTheDocument();
+  expect(logoImage.tagName).toBe('IMG');
+  expect(logoImage).toHaveAttribute('alt', 'Logotipo vermelha');
+});
 
-  test('renders navigation links', () => {
-    render(<Header />);
-    const aboutMeLink = screen.getByText('Sobre mim');
-    expect(aboutMeLink).toBeInTheDocument();
-    expect(aboutMeLink).toHaveAttribute('href', '#about-me');
+test('renders navigation links', () => {
+  render(<Header />);
+  const aboutMeLink = screen.getByText('Sobre mim');
+  expect(aboutMeLink).toBeInTheDocument();
+  expect(aboutMeLink).toHaveAttribute('href', '#about-me');
 
-    const projectsLink = screen.getByText('Projetos');
-    expect(projectsLink).toBeInTheDocument();
-    expect(projectsLink).toHaveAttribute('href', '#projects');
-  });
+  const projectsLink = screen.getByText('Projetos');
+  expect(projectsLink).toBeInTheDocument();
+  expect(projectsLink).toHaveAttribute('href', '#projects');
 });

src/components/MySocials/__tests__/MySocials.spec.tsx

@@ -1,30 +1,27 @@
 import aboutMe from '@/data/aboutMe.json';
-import { render, screen } from '@testing-library/react';
+import { render, screen } from '@/utils/testUtils';
 import { MySocials } from '..';
 
-describe('MySocials component', () => {
-  beforeEach(() => {
-    render(<MySocials />);
-  });
-
-  test('renders LinkedIn link with correct href and title', () => {
-    const link = screen.getByRole('link', { name: /LinkedIn/i });
-    expect(link).toBeInTheDocument();
-    expect(link).toHaveAttribute('href', aboutMe.links.linkedin.url);
-    expect(link).toHaveAttribute('title', 'LinkedIn');
-  });
+test('renders LinkedIn link with correct href and title', () => {
+  render(<MySocials />);
+  const link = screen.getByRole('link', { name: /linkedIn/i });
+  expect(link).toBeInTheDocument();
+  expect(link).toHaveAttribute('href', aboutMe.links.linkedin.url);
+  expect(link).toHaveAttribute('title', 'LinkedIn');
+});
 
-  test('renders GitHub link with correct href and title', () => {
-    const link = screen.getByRole('link', { name: /GitHub/i });
-    expect(link).toBeInTheDocument();
-    expect(link).toHaveAttribute('href', aboutMe.links.github.url);
-    expect(link).toHaveAttribute('title', 'GitHub');
-  });
+test('renders GitHub link with correct href and title', () => {
+  render(<MySocials />);
+  const link = screen.getByRole('link', { name: /gitHub/i });
+  expect(link).toBeInTheDocument();
+  expect(link).toHaveAttribute('href', aboutMe.links.github.url);
+  expect(link).toHaveAttribute('title', 'GitHub');
+});
 
-  test('renders Currículo link with correct href and title', () => {
-    const link = screen.getByRole('link', { name: /Currículo/i });
-    expect(link).toBeInTheDocument();
-    expect(link).toHaveAttribute('href', aboutMe.links.cv.url);
-    expect(link).toHaveAttribute('title', 'Currículo');
-  });
+test('renders Currículo link with correct href and title', () => {
+  render(<MySocials />);
+  const link = screen.getByRole('link', { name: /currículo/i });
+  expect(link).toBeInTheDocument();
+  expect(link).toHaveAttribute('href', aboutMe.links.cv.url);
+  expect(link).toHaveAttribute('title', 'Currículo');
 });

src/components/ProjectCard/__tests__/ProjectCard.spec.tsx

@@ -1,43 +1,41 @@
-import { render, screen } from '@testing-library/react';
+import { render, screen } from '@/utils/testUtils';
 import { ProjectCard } from '..';
 
-describe('ProjectCard component', () => {
-  const mockProps = {
-    name: 'Test Project',
-    segment: 'Test Segment',
-    about: 'This is a test project.',
-    githubLink: 'https://github.com/test',
-    liveUrl: 'https://test.com',
-  };
+const mockProps = {
+  name: 'Test Project',
+  segment: 'Test Segment',
+  about: 'This is a test project.',
+  githubLink: 'https://github.com/test',
+  liveUrl: 'https://test.com',
+};
 
-  beforeEach(() => {
-    render(<ProjectCard {...mockProps} />);
-  });
+beforeEach(() => {
+  render(<ProjectCard {...mockProps} />);
+});
 
-  test('renders project name', () => {
-    const projectName = screen.getByText(mockProps.name);
-    expect(projectName).toBeInTheDocument();
-  });
+test('renders project name', () => {
+  const projectName = screen.getByText(mockProps.name);
+  expect(projectName).toBeInTheDocument();
+});
 
-  test('renders project segment', () => {
-    const projectSegment = screen.getByText(mockProps.segment);
-    expect(projectSegment).toBeInTheDocument();
-  });
+test('renders project segment', () => {
+  const projectSegment = screen.getByText(mockProps.segment);
+  expect(projectSegment).toBeInTheDocument();
+});
 
-  test('renders project about', () => {
-    const projectAbout = screen.getByText(mockProps.about);
-    expect(projectAbout).toBeInTheDocument();
-  });
+test('renders project about', () => {
+  const projectAbout = screen.getByText(mockProps.about);
+  expect(projectAbout).toBeInTheDocument();
+});
 
-  test('renders GitHub link with correct href', () => {
-    const githubLink = screen.getByRole('link', { name: /GitHub/i });
-    expect(githubLink).toBeInTheDocument();
-    expect(githubLink).toHaveAttribute('href', mockProps.githubLink);
-  });
+test('renders GitHub link with correct href', () => {
+  const githubLink = screen.getByRole('link', { name: /GitHub/i });
+  expect(githubLink).toBeInTheDocument();
+  expect(githubLink).toHaveAttribute('href', mockProps.githubLink);
+});
 
-  test('renders Live link with correct href', () => {
-    const liveLink = screen.getByRole('link', { name: /Live/i });
-    expect(liveLink).toBeInTheDocument();
-    expect(liveLink).toHaveAttribute('href', mockProps.liveUrl);
-  });
+test('renders Live link with correct href', () => {
+  const liveLink = screen.getByRole('link', { name: /Live/i });
+  expect(liveLink).toBeInTheDocument();
+  expect(liveLink).toHaveAttribute('href', mockProps.liveUrl);
 });

src/components/SendMeAnEmail/__tests__/SendMeAnEmail.spec.tsx

@@ -1,23 +1,21 @@
 import { sendEmail } from '@/utils';
-import { fireEvent, render } from '@testing-library/react';
+import { fireEvent, render } from '@/utils/testUtils';
 import { vi } from 'vitest';
 import { SendMeAnEmail, draftEmail } from '..';
 
 vi.mock('@/utils', () => ({
   sendEmail: vi.fn(),
 }));
 
-describe('SendMeAnEmail component', () => {
-  test('renders button with correct text', () => {
-    const { getByText } = render(<SendMeAnEmail />);
-    expect(getByText('Me mande um e-mail')).toBeInTheDocument();
-  });
+test('renders button with correct text', () => {
+  const { getByText } = render(<SendMeAnEmail />);
+  expect(getByText('Me mande um e-mail')).toBeInTheDocument();
+});
 
-  test('call sendEmail function when button is clicked', () => {
-    const { getByText } = render(<SendMeAnEmail />);
+test('call sendEmail function when button is clicked', () => {
+  const { getByText } = render(<SendMeAnEmail />);
 
-    fireEvent.click(getByText('Me mande um e-mail'));
-    expect(sendEmail).toHaveBeenCalledTimes(1);
-    expect(sendEmail).toHaveBeenCalledWith(draftEmail);
-  });
+  fireEvent.click(getByText('Me mande um e-mail'));
+  expect(sendEmail).toHaveBeenCalledTimes(1);
+  expect(sendEmail).toHaveBeenCalledWith(draftEmail);
 });

src/components/ToTop/__tests__/ToTop.spec.tsx

@@ -1,5 +1,5 @@
 import { scrollWindowToTop } from '@/utils';
-import { fireEvent, render } from '@testing-library/react';
+import { fireEvent, render } from '@/utils/testUtils';
 import { vi } from 'vitest';
 import { ToTop } from '..';
 
@@ -8,28 +8,26 @@ vi.mock('@/utils', () => ({
   classNames: vi.fn(),
 }));
 
-describe('ToTop component', () => {
-  test.skip('renders button with correct initial visibility', () => {
-    const { getByRole } = render(<ToTop />);
-    // TODO: assert is not working out correctly,
-    // 'cause the element is for sure invisible to the user
-    expect(getByRole('button')).not.toBeVisible();
-  });
+test.skip('renders button with correct initial visibility', () => {
+  const { getByRole } = render(<ToTop />);
+  // TODO: assert is not working out correctly,
+  // 'cause the element is for sure invisible to the user
+  expect(getByRole('button')).not.toBeVisible();
+});
 
-  test('call scrollWindowToTop function when button is clicked', () => {
-    const { getByRole } = render(<ToTop />);
+test('call scrollWindowToTop function when button is clicked', () => {
+  const { getByRole } = render(<ToTop />);
 
-    fireEvent.click(getByRole('button'));
-    expect(scrollWindowToTop).toHaveBeenCalledTimes(1);
-  });
+  fireEvent.click(getByRole('button'));
+  expect(scrollWindowToTop).toHaveBeenCalledTimes(1);
+});
 
-  test('button becomes visible after scroll', () => {
-    const { getByRole } = render(<ToTop />);
+test('button becomes visible after scroll', () => {
+  const { getByRole } = render(<ToTop />);
 
-    // Simulate a scroll event
-    window.scrollY = 250;
-    fireEvent.scroll(window);
+  // Simulate a scroll event
+  window.scrollY = 250;
+  fireEvent.scroll(window);
 
-    expect(getByRole('button')).toBeVisible();
-  });
+  expect(getByRole('button')).toBeVisible();
 });