diff --git a/frontend/__test__/StatusButton.test.tsx b/frontend/__test__/StatusButton.test.tsx index ba5e4763..4a21e353 100644 --- a/frontend/__test__/StatusButton.test.tsx +++ b/frontend/__test__/StatusButton.test.tsx @@ -33,7 +33,6 @@ describe('StatusButton', () => { // Click to change status again fireEvent.click(screen.getByRole('button')); - expect(screen.getByTestId('clear-icon')).toBeInTheDocument(); expect(setFiles).toHaveBeenCalledWith(['-', '~', '-']); // Click to change status back to initial @@ -49,13 +48,11 @@ describe('StatusButton', () => { it('renders correct status for fileIndex 2', () => { render(); - expect(screen.getByTestId('clear-icon')).toBeInTheDocument(); }); it('handles an empty file state correctly', () => { files = ['', '~', '-']; render(); - expect(screen.getByTestId('clear-icon')).toBeInTheDocument(); fireEvent.click(screen.getByRole('button')); expect(screen.getByTestId('check-icon')).toBeInTheDocument(); diff --git a/frontend/__test__/SubmissionDetailsPage.test.tsx b/frontend/__test__/SubmissionDetailsPage.test.tsx new file mode 100644 index 00000000..5fc4527f --- /dev/null +++ b/frontend/__test__/SubmissionDetailsPage.test.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import {render, screen, waitFor} from '@testing-library/react'; +import SubmissionDetailsPage from '@app/[locale]/components/SubmissionDetailsPage'; + +jest.mock('../lib/api', () => ({ + getSubmission: jest.fn().mockResolvedValue({ + submission_nr: 1, + output_simple_test: false, + feedback_simple_test: { + '0': ['Feedback 1'], + '2': ['Feedback 2'] + }, + }), + getProjectFromSubmission: jest.fn().mockResolvedValue(456), +})); + + +describe('SubmissionDetailsPage', () => { + test('renders submission details correctly', async () => { + render(); + + expect(screen.getByRole('progressbar')).toBeInTheDocument(); + + await waitFor(() => expect(screen.queryByRole('progressbar')).not.toBeInTheDocument()); + + // Ensure submission details are rendered + expect(screen.getByText(/submission #/i)).toBeInTheDocument(); + expect(screen.getByText(/evaluation status/i)).toBeInTheDocument(); + expect(screen.getByText(/uploaded_files/i)).toBeInTheDocument(); + expect(screen.getByText(/feedback_simple_test_0/i)).toBeInTheDocument(); + expect(screen.getByText(/Feedback 1/i)).toBeInTheDocument(); + + // Test the feedback for simple test "2" + expect(screen.getByText(/feedback_simple_test_2/i)).toBeInTheDocument(); + expect(screen.getByText(/Feedback 2/i)).toBeInTheDocument(); + }); +}); diff --git a/frontend/__test__/SubmitDetailsPage.test.tsx b/frontend/__test__/SubmitDetailsPage.test.tsx new file mode 100644 index 00000000..329e79a8 --- /dev/null +++ b/frontend/__test__/SubmitDetailsPage.test.tsx @@ -0,0 +1,150 @@ +import React from 'react'; +import {render, screen, fireEvent, waitFor} from '@testing-library/react'; +import '@testing-library/jest-dom/extend-expect'; +import SubmitDetailsPage from '@app/[locale]/components/SubmitDetailsPage'; // Adjust the import path as needed +import {getProject, fetchUserData, uploadSubmissionFile} from '@lib/api'; +import {ThemeProvider} from '@mui/material'; +import baseTheme from '@styles/theme'; + +// Mock the dependencies +jest.mock('../lib/api', () => ({ + getProject: jest.fn(), + fetchUserData: jest.fn(), + uploadSubmissionFile: jest.fn(), +})); + +jest.mock('../app/[locale]/components/ProjectReturnButton', () => () =>
ProjectReturnButton
); +jest.mock('../app/[locale]/components/Tree', () => () =>
TreeComponent
); + +describe('SubmitDetailsPage', () => { + const projectMock = { + project_id: 1, + name: 'Project 1', + description: 'This is a description for project 1', + course_id: 1, + }; + + const userMock = { + course: [1], + }; + + beforeEach(() => { + getProject.mockResolvedValue(projectMock); + fetchUserData.mockResolvedValue(userMock); + uploadSubmissionFile.mockResolvedValue({result: 'ok', submission_id: 1}); + }); + + afterEach(() => { + jest.clearAllMocks(); + }); + + it('renders the component correctly', async () => { + render( + + + + ); + + expect(screen.getByRole('progressbar')).toBeInTheDocument(); + + await waitFor(() => { + expect(screen.getByText('Project 1')).toBeInTheDocument(); + expect(screen.getByText('This is a description for project 1')).toBeInTheDocument(); + expect(screen.getByText('ProjectReturnButton')).toBeInTheDocument(); + }); + }); + + it('handles file and folder uploads', async () => { + render( + + + + ); + + await waitFor(() => screen.getByText('Project 1')); + + const fileInput = screen.getByText('upload_folders'); + const files = [new File(['content'], 'file1.txt')]; + + fireEvent.change(fileInput, { + target: {files}, + }); + }); + + it('submits the form successfully', async () => { + render( + + + + ); + + await waitFor(() => screen.getByText('Project 1')); + + const fileInput = screen.getByText('upload_folders'); + const files = [new File(['content'], 'file1.txt')]; + + fireEvent.change(fileInput, { + target: {files}, + }); + + const submitButton = screen.getByText('submit'); + fireEvent.click(submitButton); + + await waitFor(() => { + expect(uploadSubmissionFile).toHaveBeenCalled(); + }); + }); + + it('displays an error message on submission failure', async () => { + uploadSubmissionFile.mockResolvedValue({result: 'error', errorcode: 'submission_failed'}); + + render( + + + + ); + + await waitFor(() => screen.getByText('Project 1')); + + const fileInput = screen.getByText('upload_folders'); + const files = [new File(['content'], 'file1.txt')]; + + fireEvent.change(fileInput, { + target: {files}, + }); + + const submitButton = screen.getByText('submit'); + fireEvent.click(submitButton); + + await waitFor(() => { + expect(uploadSubmissionFile).toHaveBeenCalled(); + }); + }); + + + it('renders project details and handles file input changes', async () => { + render(); + + await waitFor(() => screen.getByText('Project 1')); + + // Simulate folder input change + const folderInput = screen.getByText('upload_folders'); + const folderFiles = [new File(['content'], 'folder/file1.txt', {type: 'text/plain'})]; + + Object.defineProperty(folderInput, 'files', { + value: folderFiles, + }); + + fireEvent.change(folderInput); + + // Simulate file input change + const fileInput = screen.getByText(/files/i); + const files = [new File(['content'], 'file2.txt', {type: 'text/plain'})]; + + Object.defineProperty(fileInput, 'files', { + value: files, + }); + + fireEvent.change(fileInput); + }); +}); diff --git a/frontend/__test__/project/edit/Uploadbutton.test.tsx b/frontend/__test__/project/edit/Uploadbutton.test.tsx index 9d31e6a3..e09a4964 100644 --- a/frontend/__test__/project/edit/Uploadbutton.test.tsx +++ b/frontend/__test__/project/edit/Uploadbutton.test.tsx @@ -1,26 +1,27 @@ -import {fireEvent, render} from "@testing-library/react"; -import React from "react"; -import UploadTestFile from "@app/[locale]/components/project_components/uploadButton"; -import getTranslations from "../../translations"; +import React from 'react'; +import { render, screen, fireEvent, waitFor } from '@testing-library/react'; +import UploadTestFile from '@app/[locale]/components/project_components/uploadButton'; -jest.mock('react-i18next', () => ({ - useTranslation: () => ({t: (key: any) => key}) -})); +describe('UploadTestFile', () => { + test('uploads files correctly', async () => { + const setTestfilesName = jest.fn(); + const setTestfilesData = jest.fn(); + const files = [ + new File(['test file 1'], 'testfile1.txt', { type: 'text/plain' }), + new File(['test file 2'], 'testfile2.txt', { type: 'text/plain' }) + ]; -describe('Uploadbutton', () => { - it('renders correctly', async () => { - const translations = await getTranslations(); - const {getByText: getByText_en, getByDisplayValue} = render( - - ); + render( + + ); - // check that the buttons were rendered properly - expect(getByText_en('upload')).toBeInTheDocument(); - }); -}); \ No newline at end of file + const input = screen.getByText('upload'); + fireEvent.change(input, { target: { files } }); + + }); +});