feat: added test on components

src/components/selectFileCard/selectFileCard.tsx

@@ -12,7 +12,7 @@ interface props {
  setHeader: (header: string[]) => void;
 }
 
-export function SelectFileCard({
+export default function SelectFileCard({
  selectedFile,
  setSelectedFile,
  setData,

src/tests/App.spec.tsx

@@ -0,0 +1,9 @@
+import { render } from "@testing-library/react";
+import App from "../App";
+
+test("✅ renderiza o componente App sem erros", () => {
+ const { getByText } = render(<App />);
+
+ const linkElement = getByText(/App/i);
+ expect(linkElement).toBeInTheDocument();
+});

src/tests/csvTable.spec.tsx

@@ -0,0 +1,24 @@
+import { render } from "@testing-library/react";
+import CsvTable from "../components/csvTable/csvTable";
+
+describe("CsvTable", () => {
+ it("✅ should render the table headers and data correctly", () => {
+
+ const head = ["Header 1", "Header 2", "Header 3"];
+ const data = [
+ ["Row 1, Cell 1", "Row 1, Cell 2", "Row 1, Cell 3"],
+ ["Row 2, Cell 1", "Row 2, Cell 2", "Row 2, Cell 3"],
+ ["Row 3, Cell 1", "Row 3, Cell 2", "Row 3, Cell 3"],
+ ];
+
+ const { getByText } = render(<CsvTable data={data} head={head} />);
+
+ head.forEach((headerText) => {
+ expect(getByText(headerText)).toBeInTheDocument();
+ });
+
+ data.flat().forEach((cellText) => {
+ expect(getByText(cellText)).toBeInTheDocument();
+ });
+ });
+});

src/tests/resultTable.spec.tsx

@@ -0,0 +1,47 @@
+import { render } from "@testing-library/react";
+import ResultTable from "../components/resultTable/resultTable";
+
+describe("ResultTable", () => {
+ it("✅ deve renderizar a tabela corretamente", () => {
+ const data: { [key: string]: any } = {
+ item1: "output1",
+ item2: "output2",
+ item3: "output3",
+ };
+ const classifierName = "Classifier 1";
+
+ const { getByText } = render(
+ <ResultTable data={data} classifierName={classifierName} />
+ );
+
+ expect(getByText(classifierName)).toBeInTheDocument();
+
+ Object.keys(data).forEach((item) => {
+ expect(getByText(item)).toBeInTheDocument();
+ expect(getByText(data[item])).toBeInTheDocument();
+ });
+ });
+
+ it("✅ deve aplicar cores alternadas nas linhas da tabela", () => {
+ const data: { [key: string]: any } = {
+ item1: "output1",
+ item2: "output2",
+ item3: "output3",
+ };
+ const classifierName = "Classifier 1";
+
+ const { container } = render(
+ <ResultTable data={data} classifierName={classifierName} />
+ );
+
+ const tableRows = container.querySelectorAll("tbody tr");
+
+ tableRows.forEach((row, index) => {
+ if (index % 2 === 0) {
+ expect(row).toHaveClass("bg-main-medium");
+ } else {
+ expect(row).toHaveClass("bg-main-bold");
+ }
+ });
+ });
+ });

src/tests/selectFileCard.spec.tsx

@@ -0,0 +1,55 @@
+import { render, fireEvent, screen } from "@testing-library/react";
+import SelectFileCard from "../components/selectFileCard/selectFileCard"; // Certifique-se de ajustar o caminho conforme necessário
+
+describe("SelectFileCard", () => {
+ it("✅ deve renderizar corretamente", () => {
+ const selectedFile = null;
+ const setSelectedFile = jest.fn();
+ const setData = jest.fn();
+ const setHeader = jest.fn();
+ const data: any[][] = [];
+ const header: string[] = [];
+
+ render(
+ <SelectFileCard
+ selectedFile={selectedFile}
+ setSelectedFile={setSelectedFile}
+ setData={setData}
+ data={data}
+ header={header}
+ setHeader={setHeader}
+ />
+ );
+
+ expect(screen.getByText("Arrastar e soltar")).toBeInTheDocument();
+ });
+
+ it("✅ deve chamar a função setSelectedFile ao selecionar um arquivo", () => {
+ const selectedFile = null;
+ const setSelectedFile = jest.fn();
+ const setData = jest.fn();
+ const setHeader = jest.fn();
+ const data: any[][] = [];
+ const header: string[] = [];
+
+ render(
+ <SelectFileCard
+ selectedFile={selectedFile}
+ setSelectedFile={setSelectedFile}
+ setData={setData}
+ data={data}
+ header={header}
+ setHeader={setHeader}
+ />
+ );
+
+ const fileInput = screen.getByTestId("fileInput");
+ fireEvent.change(fileInput, {
+ target: {
+ files: [new File([], "test.csv")],
+ },
+ });
+
+ expect(setSelectedFile).toHaveBeenCalledWith(expect.any(File));
+ });
+});