feat: adicionar testes para componentes de filtro, cabeçalho e botões…

… de ordenação

test/Loans/FilterSection/filterSection.spec.tsx

@@ -0,0 +1,62 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import FilterSection from '../../../src/pages/Loans/FilterSection/filterSection';
+import '@testing-library/jest-dom';
+
+describe('FilterSection', () => {
+    const setSelectedFilter = jest.fn();
+    const handleDateFilter = jest.fn();
+    const handleStatusFilter = jest.fn();
+    const handleDurationFilter = jest.fn();
+
+    const renderComponent = (selectedFilter: string) => render(
+        <FilterSection
+            selectedFilter={selectedFilter}
+            setSelectedFilter={setSelectedFilter}
+            handleDateFilter={handleDateFilter}
+            handleStatusFilter={handleStatusFilter}
+            handleDurationFilter={handleDurationFilter}
+            handleFilter={function (): void {
+                throw new Error('Function not implemented.');
+            }}
+        />
+    );
+
+    it('should render default filter option', () => {
+        const { getByText } = renderComponent('default');
+        expect(getByText('Filtrar por:')).toBeInTheDocument();
+    });
+
+    it('should render StatusFilter when selectedFilter is status', () => {
+        const { getByText } = renderComponent('status');
+        expect(getByText('Todos')).toBeInTheDocument();
+    });
+
+    it('should render DurationFilter when selectedFilter is duracao', () => {
+        const { getByText } = renderComponent('duracao');
+        expect(getByText('Selecione')).toBeInTheDocument();
+    });
+
+
+    it('should call setSelectedFilter on filter change', () => {
+        const { getByRole } = renderComponent('default');
+        fireEvent.change(getByRole('combobox'), { target: { value: 'status' } });
+        expect(setSelectedFilter).toHaveBeenCalledWith('status');
+    });
+
+    it('should call handleStatusFilter on status filter change', () => {
+        const { getByText } = renderComponent('status');
+        fireEvent.change(getByText('Todos').closest('select')!, { target: { value: 'Em posse' } });
+        expect(handleStatusFilter).toHaveBeenCalledWith('Em posse');
+    });
+
+    it('should call handleDurationFilter on duration filter change', () => {
+        const { getByText } = renderComponent('duracao');
+        fireEvent.change(getByText('Selecione').closest('select')!, { target: { value: 'short' } });
+        expect(handleDurationFilter).toHaveBeenCalledWith('short');
+    });
+
+
+
+
+});

test/Loans/LoansHeader/header.spec.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import Header from '../../../src/pages/Loans/LoansHeader/header';
+import '@testing-library/jest-dom';
+
+describe('Header Component', () => {
+    it('should render without crashing', () => {
+        const { getByAltText } = render(<Header />);
+        expect(getByAltText('Logo')).toBeInTheDocument();
+    });
+
+    it('should have the correct styles', () => {
+        const { getByAltText } = render(<Header />);
+        const logo = getByAltText('Logo');
+        expect(logo).toHaveStyle('height: 7vh');
+    });
+
+    it('should have a div with the correct styles', () => {
+        const { container } = render(<Header />);
+        const div = container.querySelector('#header');
+        expect(div).toHaveStyle('background-color: #D9D9D9');
+        expect(div).toHaveStyle('height: 15vh');
+        expect(div).toHaveStyle('width: 100vw');
+        expect(div).toHaveStyle('display: flex');
+        expect(div).toHaveStyle('justify-content: center');
+        expect(div).toHaveStyle('align-items: center');
+    });
+});

test/Loans/SortButtons/sortButtons.spec.tsx

@@ -0,0 +1,49 @@
+import React from 'react';
+import { render, fireEvent, screen } from '@testing-library/react';
+import SortButtons from '../../../src/pages/Loans/SortButtons/sortButtons';
+
+describe('SortButtons', () => {
+    const handleSort = jest.fn();
+
+    it('should render the sort buttons', () => {
+        const { getByText } = render(<SortButtons handleSort={handleSort} />);
+        expect(getByText('⬆️')).toBeInTheDocument();
+        expect(getByText('⬇️')).toBeInTheDocument();
+    });
+
+    it('should call handleSort with "asc" when the first button is clicked', () => {
+        const { getByText } = render(<SortButtons handleSort={handleSort} />);
+        fireEvent.click(getByText('⬆️'));
+        expect(handleSort).toHaveBeenCalledWith('asc');
+    });
+
+    it('should call handleSort with "desc" when the second button is clicked', () => {
+        const { getByText } = render(<SortButtons handleSort={handleSort} />);
+        fireEvent.click(getByText('⬇️'));
+        expect(handleSort).toHaveBeenCalledWith('desc');
+    });
+
+    it('should change background color on mouse enter and leave for the first button', () => {
+        const { getByText } = render(<SortButtons handleSort={handleSort} />);
+        const button = getByText('⬆️').parentElement;
+        if (button) {
+            fireEvent.mouseEnter(button);
+            expect(button).toHaveStyle('background-color: #D9D9D9');
+            fireEvent.mouseLeave(button);
+            expect(button).toHaveStyle('background-color: transparent');
+        }
+    });
+
+    it('should change background color on mouse enter and leave for the second button', () => {
+        const { getByText } = render(<SortButtons handleSort={handleSort} />);
+        const button = getByText('⬇️').parentElement;
+        if (button) {
+            fireEvent.mouseEnter(button);
+            expect(button).toHaveStyle('background-color: #D9D9D9');
+            fireEvent.mouseLeave(button);
+            expect(button).toHaveStyle('background-color: transparent');
+        }
+    });
+
+
+});