Fix - tests

This commit is contained in:
Eddi3_As 2025-03-20 23:19:54 -04:00
parent c50cd3e6e7
commit 81bedf0672
2 changed files with 37 additions and 130 deletions

View file

@ -1,12 +1,10 @@
import React from "react";
import React, { act } from "react";
import { render, screen, fireEvent, waitFor } from "@testing-library/react";
import ImageDialog from "../../../components/ImageGallery/ImageGallery";
import ImageGallery from "../../../components/ImageGallery/ImageGallery";
import ApiService from "../../../services/ApiService";
import { Images } from "../../../Types/Images";
import { act } from "react";
import "@testing-library/jest-dom";
// Mock ApiService
jest.mock("../../../services/ApiService");
const mockImages: Images[] = [
@ -15,136 +13,43 @@ const mockImages: Images[] = [
{ id: "3", file_name: "image3.jpg", mime_type: "image/jpeg", file_content: "mockBase64Content3" },
];
describe("ImageDialog Component", () => {
let setDialogOpenMock: jest.Mock;
let setImageLinksMock: jest.Mock;
beforeAll(() => {
Object.assign(navigator, {
clipboard: {
writeText: jest.fn(),
},
});
});
describe("ImageGallery", () => {
beforeEach(() => {
jest.clearAllMocks();
setDialogOpenMock = jest.fn();
setImageLinksMock = jest.fn();
jest.spyOn(ApiService, "getImages").mockResolvedValue({ images: mockImages, total: 6 });
(ApiService.getUserImages as jest.Mock).mockResolvedValue({ images: mockImages, total: 3 });
(ApiService.deleteImage as jest.Mock).mockResolvedValue(true);
(ApiService.uploadImage as jest.Mock).mockResolvedValue('mockImageUrl');
render(<ImageGallery />);
});
test("renders the dialog when open", async () => {
it("should render images correctly", async () => {
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
expect(screen.getByText("Images disponibles")).toBeInTheDocument();
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalledWith(1, 3));
expect(screen.getAllByRole("img")).toHaveLength(mockImages.length);
});
test("closes the dialog when close button is clicked", async () => {
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
fireEvent.click(screen.getByLabelText("close"));
expect(setDialogOpenMock).toHaveBeenCalledWith(false);
});
test("copies the image link when copy button is clicked", async () => {
//const setImageLinksMock = jest.fn();
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
await act(async () => {
await waitFor(() => expect(screen.getAllByRole("img")).toHaveLength(mockImages.length));
await screen.findByText("Gallery");
});
expect(screen.getByAltText("Image image1.jpg")).toBeInTheDocument();
expect(screen.getByAltText("Image image2.jpg")).toBeInTheDocument();
});
it("should handle copy action", async () => {
const handleCopyMock = jest.fn();
// Click the copy button
fireEvent.click(screen.getByTestId("copy-button-1"));
// Check that "Copié!" appears
expect(screen.getByText("Copié!")).toBeInTheDocument();
render(<ImageGallery handleCopy={handleCopyMock} />);
const copyButtons = await waitFor(() => screen.findAllByTestId(/gallery-tab-copy-/));
await act(async () => {
fireEvent.click(copyButtons[0]);
});
expect(navigator.clipboard.writeText).toHaveBeenCalled();
});
test("navigates to next and previous page", async () => {
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalledWith(1, 3));
fireEvent.click(screen.getByText("Suivant"));
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalledWith(2, 3));
fireEvent.click(screen.getByText("Précédent"));
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalledWith(1, 3));
});
test("deletes an image successfully", async () => {
jest.spyOn(ApiService, "deleteImage").mockResolvedValue(true);
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalled());
fireEvent.click(screen.getByTestId("delete-button-1"));
await waitFor(() => expect(ApiService.deleteImage).toHaveBeenCalledWith("1"));
expect(screen.queryByTestId("delete-button-1")).not.toBeInTheDocument();
});
test("handles failed delete when image is linked", async () => {
jest.spyOn(ApiService, "deleteImage").mockResolvedValue(false);
await act(async () => {
render(
<ImageDialog
galleryOpen={true}
setDialogOpen={setDialogOpenMock}
setImageLinks={setImageLinksMock}
/>
);
});
await waitFor(() => expect(ApiService.getImages).toHaveBeenCalled());
fireEvent.click(screen.getByTestId("delete-button-1"));
await waitFor(() => expect(ApiService.deleteImage).toHaveBeenCalledWith("1"));
expect(screen.getByText("Confirmer la suppression")).toBeInTheDocument();
});
});

View file

@ -45,7 +45,7 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy }) => {
const fetchImages = async () => {
setLoading(true);
const data = await ApiService.getImages(imgPage, imgLimit);
const data = await ApiService.getUserImages(imgPage, imgLimit);
setImages(data.images);
setTotalImg(data.total);
setLoading(false);
@ -156,7 +156,8 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy }) => {
e.stopPropagation();
handleCopyFunction(obj.id);
}}
color="primary" >
color="primary"
data-testid={`gallery-tab-copy-${obj.id}`} >
<ContentCopyIcon sx={{ fontSize: 18 }} />
</IconButton>
@ -167,7 +168,8 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy }) => {
setImageToDelete(obj);
setOpenDeleteDialog(true);
}}
color="error" >
color="error"
data-testid={`gallery-tab-delete-${obj.id}`} >
<DeleteIcon sx={{ fontSize: 18 }} />
</IconButton>