mirror of
https://github.com/ets-cfuhrman-pfe/EvalueTonSavoir.git
synced 2025-08-11 21:23:54 -04:00
Fix - tests
This commit is contained in:
parent
c50cd3e6e7
commit
81bedf0672
2 changed files with 37 additions and 130 deletions
|
|
@ -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();
|
||||
});
|
||||
});
|
||||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in a new issue