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 } });
+
+ });
+});