From 70055c306e4eea795db58c06638247cbd296628a Mon Sep 17 00:00:00 2001 From: Mathis De Witte Date: Thu, 23 May 2024 12:43:33 +0200 Subject: [PATCH] linting voor component tests --- .../component/AssignmentListItem.cy.tsx | 170 +++++++++++------- .../cypress/component/CourseCard.cy.tsx | 104 ++++++----- .../cypress/component/FileUploadButton.cy.tsx | 39 ++-- .../component/GroupAccessComponent.cy.tsx | 9 +- .../frontend/cypress/component/Header.cy.tsx | 79 ++++---- .../cypress/component/ItemList.cy.tsx | 61 ++++--- .../cypress/component/LanguageSwitcher.cy.tsx | 12 +- .../cypress/component/RestrictionCard.cy.tsx | 16 +- .../SubmissionListItemStudentPage.cy.tsx | 59 +++--- .../SubmissionListItemTeacherPage.cy.tsx | 36 ++-- .../cypress/component/TabSwitcher.cy.tsx | 60 +++---- .../cypress/component/WarningPopup.cy.tsx | 38 ++-- 12 files changed, 399 insertions(+), 284 deletions(-) diff --git a/frontend/frontend/cypress/component/AssignmentListItem.cy.tsx b/frontend/frontend/cypress/component/AssignmentListItem.cy.tsx index 68d5c0ba..ff6690b9 100644 --- a/frontend/frontend/cypress/component/AssignmentListItem.cy.tsx +++ b/frontend/frontend/cypress/component/AssignmentListItem.cy.tsx @@ -1,76 +1,108 @@ -import { AssignmentListItem } from '../../src/components/AssignmentListItem'; -import { BrowserRouter } from 'react-router-dom'; -import fixtures from '../fixtures/fixtures.json'; -import { SubmissionStatus } from '../../src/pages/submissionPage/SubmissionPage'; +import { AssignmentListItem } from '../../src/components/AssignmentListItem' +import { BrowserRouter } from 'react-router-dom' +import fixtures from '../fixtures/fixtures.json' +import { SubmissionStatus } from '../../src/pages/submissionPage/SubmissionPage' describe('AssignmentListItem', () => { - const mockProps = { - id: fixtures.id, - course_id: fixtures.course_id, - projectName: fixtures.project, - dueDate: new Date().toLocaleDateString(), - status: SubmissionStatus.FAIL, - isStudent: true, - }; + const mockProps = { + id: fixtures.id, + course_id: fixtures.course_id, + projectName: fixtures.project, + dueDate: new Date().toLocaleDateString(), + status: SubmissionStatus.FAIL, + isStudent: true, + } - it('renders with cross', () => { - cy.mount(); - cy.get('.MuiListItem-root').should('exist'); - cy.get('#project' + fixtures.id).should('exist'); - cy.get('[data-cy=projectName]').should('contain.text', fixtures.project); - cy.get('#dueDate').should('contain.text', new Date().toLocaleDateString()); - cy.get('#cross').should('exist'); - cy.get('#check').should('not.exist'); - cy.get('#clock').should('not.exist'); - }); + it('renders with cross', () => { + cy.mount( + + + + ) + cy.get('.MuiListItem-root').should('exist') + cy.get('#project' + fixtures.id).should('exist') + cy.get('[data-cy=projectName]').should('contain.text', fixtures.project) + cy.get('#dueDate').should( + 'contain.text', + new Date().toLocaleDateString() + ) + cy.get('#cross').should('exist') + cy.get('#check').should('not.exist') + cy.get('#clock').should('not.exist') + }) - it('renders with checkmark', () => { - mockProps.status = SubmissionStatus.PASSED; - cy.mount(); - cy.get('.MuiListItem-root').should('exist'); - cy.get('#project' + fixtures.id).should('exist'); - cy.get('[data-cy=projectName]').should('contain.text', fixtures.project); - cy.get('#dueDate').should('contain.text', new Date().toLocaleDateString()); - cy.get('#cross').should('not.exist'); - cy.get('#check').should('exist'); - cy.get('#clock').should('not.exist'); - }); + it('renders with checkmark', () => { + mockProps.status = SubmissionStatus.PASSED + cy.mount( + + + + ) + cy.get('.MuiListItem-root').should('exist') + cy.get('#project' + fixtures.id).should('exist') + cy.get('[data-cy=projectName]').should('contain.text', fixtures.project) + cy.get('#dueDate').should('contain.text', new Date().toLocaleDateString()) + cy.get('#cross').should('not.exist') + cy.get('#check').should('exist') + cy.get('#clock').should('not.exist') + }) - it('renders with alarm', () => { - mockProps.status = SubmissionStatus.PENDING; - cy.mount(); - cy.get('.MuiListItem-root').should('exist'); - cy.get('#project' + fixtures.id).should('exist'); - cy.get('[data-cy=projectName]').should('contain.text', fixtures.project); - cy.get('#dueDate').should('contain.text', new Date().toLocaleDateString()); - cy.get('#cross').should('not.exist'); - cy.get('#check').should('not.exist'); - cy.get('#clock').should('exist'); - }); + it('renders with alarm', () => { + mockProps.status = SubmissionStatus.PENDING + cy.mount( + + + + ) + cy.get('.MuiListItem-root').should('exist') + cy.get('#project' + fixtures.id).should('exist') + cy.get('[data-cy=projectName]').should('contain.text', fixtures.project) + cy.get('#dueDate').should( + 'contain.text', + new Date().toLocaleDateString() + ) + cy.get('#cross').should('not.exist') + cy.get('#check').should('not.exist') + cy.get('#clock').should('exist') + }) - it('renders with no due date', () => { - mockProps.dueDate = undefined; - mockProps.status = SubmissionStatus.PASSED; - cy.mount(); - cy.get('.MuiListItem-root').should('exist'); - cy.get('#project' + fixtures.id).should('exist'); - cy.get('[data-cy=projectName]').should('contain.text', fixtures.project); - // normaal zou hier 'no deadline' moeten staan in de correcte taal, maar blijkbaar gaat dat niet in de testen - // omdat er hier niet echt een taal is ingesteld? - cy.get('#dueDate').should('not.contain.text', new Date().toLocaleDateString()); - cy.get('#cross').should('not.exist'); - cy.get('#check').should('exist'); - }); + it('renders with no due date', () => { + mockProps.dueDate = undefined + mockProps.status = SubmissionStatus.PASSED + cy.mount( + + + + ) + cy.get('.MuiListItem-root').should('exist') + cy.get('#project' + fixtures.id).should('exist') + cy.get('[data-cy=projectName]').should('contain.text', fixtures.project) + // normaal zou hier 'no deadline' moeten staan in de correcte taal, maar blijkbaar gaat dat niet in de testen + // omdat er hier niet echt een taal is ingesteld? + cy.get('#dueDate').should( + 'not.contain.text', + new Date().toLocaleDateString() + ) + cy.get('#cross').should('not.exist') + cy.get('#check').should('exist') + }) - it('renders as teacher', () => { - mockProps.isStudent = false; - mockProps.dueDate = new Date().toLocaleDateString(); - cy.mount(); - cy.get('.MuiListItem-root').should('exist'); - cy.get('#project' + fixtures.id).should('exist'); - cy.get('[data-cy=projectName]').should('contain.text', fixtures.project); - cy.get('#dueDate').should('contain.text', new Date().toLocaleDateString()); - cy.get('#cross').should('not.exist'); - cy.get('#check').should('not.exist'); - }); -}); + it('renders as teacher', () => { + mockProps.isStudent = false + mockProps.dueDate = new Date().toLocaleDateString() + cy.mount( + + + + ) + cy.get('.MuiListItem-root').should('exist') + cy.get('#project' + fixtures.id).should('exist') + cy.get('[data-cy=projectName]').should('contain.text', fixtures.project) + cy.get('#dueDate').should( + 'contain.text', + new Date().toLocaleDateString() + ) + cy.get('#cross').should('not.exist') + cy.get('#check').should('not.exist') + }) +}) diff --git a/frontend/frontend/cypress/component/CourseCard.cy.tsx b/frontend/frontend/cypress/component/CourseCard.cy.tsx index a7d7f00d..1191d4a4 100644 --- a/frontend/frontend/cypress/component/CourseCard.cy.tsx +++ b/frontend/frontend/cypress/component/CourseCard.cy.tsx @@ -1,64 +1,82 @@ -import { CourseCard } from '../../src/components/CourseCard'; -import { BrowserRouter } from 'react-router-dom'; -import fixtures from '../fixtures/fixtures.json'; +import { CourseCard } from '../../src/components/CourseCard' +import { BrowserRouter } from 'react-router-dom' +import fixtures from '../fixtures/fixtures.json' describe('CourseCard', () => { const mockProps = { courseId: fixtures.id, archived: false, isStudent: true, - }; + } it('renders as student', () => { - cy.mount(); + cy.mount( + + + + ) // data is fetched from the backend, so we can't check that - cy.get('.MuiCard-root').should('exist'); - cy.get('.MuiCardContent-root').should('exist'); - cy.get('#courseInfo').should('have.text', 'undefined: undefined: 0').click(); - cy.get('#student').should('exist'); - cy.get('#teacherArchived').should('not.exist'); - cy.get('#teacherNonArchived').should('not.exist'); - cy.get('#project').contains('Project'); - cy.get('#deadline').contains('Deadline'); - cy.get('#status').contains('Status'); - cy.get('#archiveButton').should('not.exist'); - }); + cy.get('.MuiCard-root').should('exist') + cy.get('.MuiCardContent-root').should('exist') + cy.get('#courseInfo') + .should('have.text', 'undefined: undefined: 0') + .click() + cy.get('#student').should('exist') + cy.get('#teacherArchived').should('not.exist') + cy.get('#teacherNonArchived').should('not.exist') + cy.get('#project').contains('Project') + cy.get('#deadline').contains('Deadline') + cy.get('#status').contains('Status') + cy.get('#archiveButton').should('not.exist') + }) it('renders archived as teacher', () => { const mockProps = { courseId: fixtures.id, archived: true, isStudent: false, - }; - cy.mount(); - cy.get('.MuiCard-root').should('exist'); - cy.get('.MuiCardContent-root').should('exist'); - cy.get('#courseInfo').should('have.text', 'undefined: undefined: 0').click(); - cy.get('#student').should('not.exist'); - cy.get('#teacherArchived').should('exist'); - cy.get('#teacherNonArchived').should('not.exist'); - cy.get('#project').contains('Project'); - cy.get('#deadline').contains('Deadline'); - cy.get('#status').should('not.exist'); - cy.get('#archiveButton').should('not.exist'); - }); + } + cy.mount( + + + + ) + cy.get('.MuiCard-root').should('exist') + cy.get('.MuiCardContent-root').should('exist') + cy.get('#courseInfo') + .should('have.text', 'undefined: undefined: 0') + .click() + cy.get('#student').should('not.exist') + cy.get('#teacherArchived').should('exist') + cy.get('#teacherNonArchived').should('not.exist') + cy.get('#project').contains('Project') + cy.get('#deadline').contains('Deadline') + cy.get('#status').should('not.exist') + cy.get('#archiveButton').should('not.exist') + }) it('renders non-archived as teacher', () => { const mockProps = { courseId: fixtures.id, archived: false, isStudent: false, - }; - cy.mount(); - cy.get('.MuiCard-root').should('exist'); - cy.get('.MuiCardContent-root').should('exist'); - cy.get('#courseInfo').should('have.text', 'undefined: undefined: 0').click(); - cy.get('#student').should('not.exist'); - cy.get('#teacherArchived').should('not.exist'); - cy.get('#teacherNonArchived').should('exist'); - cy.get('#project').contains('Project'); - cy.get('#deadline').contains('Deadline'); - cy.get('#status').should('not.exist'); - cy.get('#archiveButton').should('exist'); - }); -}); \ No newline at end of file + } + cy.mount( + + + + ) + cy.get('.MuiCard-root').should('exist') + cy.get('.MuiCardContent-root').should('exist') + cy.get('#courseInfo') + .should('have.text', 'undefined: undefined: 0') + .click() + cy.get('#student').should('not.exist') + cy.get('#teacherArchived').should('not.exist') + cy.get('#teacherNonArchived').should('exist') + cy.get('#project').contains('Project') + cy.get('#deadline').contains('Deadline') + cy.get('#status').should('not.exist') + cy.get('#archiveButton').should('exist') + }) +}) diff --git a/frontend/frontend/cypress/component/FileUploadButton.cy.tsx b/frontend/frontend/cypress/component/FileUploadButton.cy.tsx index 2ded97fa..6aed5cc3 100644 --- a/frontend/frontend/cypress/component/FileUploadButton.cy.tsx +++ b/frontend/frontend/cypress/component/FileUploadButton.cy.tsx @@ -1,5 +1,5 @@ -import InputFileUpload from '../../src/components/FileUploadButton'; -import fixtures from '../fixtures/fixtures.json'; +import InputFileUpload from '../../src/components/FileUploadButton' +import fixtures from '../fixtures/fixtures.json' describe('FileUploadButton', () => { const mockProps = { @@ -8,24 +8,25 @@ describe('FileUploadButton', () => { onFileChange: () => {}, fileTypes: ['pdf'], path: '../fixtures/test.pdf', - }; + } it('renders', () => { - cy.mount(); - cy.get('#uploadButton').should('exist').should('have.text', fixtures.name); - cy.get('input[type=file]').should('exist'); - cy.contains(fixtures.tooltip).should('not.exist'); - cy.get('#uploadButton').trigger('mouseover'); - cy.get('#uploadButton').trigger('mouseout'); - cy.contains(fixtures.tooltip).should('not.exist'); - cy.get('#clearButton').should('exist'); - }); + cy.mount() + cy.get('#uploadButton') + .should('exist') + .should('have.text', fixtures.name) + cy.get('input[type=file]').should('exist') + cy.contains(fixtures.tooltip).should('not.exist') + cy.get('#uploadButton').trigger('mouseover') + cy.get('#uploadButton').trigger('mouseout') + cy.contains(fixtures.tooltip).should('not.exist') + cy.get('#clearButton').should('exist') + }) it('no path', () => { - mockProps.path = ''; - cy.mount(); - cy.get('#uploadButton').should('exist').should('have.text', fixtures.name); - cy.get('#clearButton').should('not.exist'); - }); - -}); \ No newline at end of file + mockProps.path = '' + cy.mount() + cy.get('#uploadButton').should('exist').should('have.text', fixtures.name) + cy.get('#clearButton').should('not.exist') + }) +}) diff --git a/frontend/frontend/cypress/component/GroupAccessComponent.cy.tsx b/frontend/frontend/cypress/component/GroupAccessComponent.cy.tsx index 10f4eb61..ac3c7b3b 100644 --- a/frontend/frontend/cypress/component/GroupAccessComponent.cy.tsx +++ b/frontend/frontend/cypress/component/GroupAccessComponent.cy.tsx @@ -1,7 +1,6 @@ import { GroupAccessComponent } from '../../src/components/GroupAccessComponent' import { BrowserRouter } from 'react-router-dom' - describe('GroupAccessComponent', () => { const mockProps = { assignmentid: 1, @@ -9,7 +8,11 @@ describe('GroupAccessComponent', () => { } it('toggles group access', () => { - cy.mount() + cy.mount( + + + + ) cy.get('[data-cy=groupButton]').should('exist') }) -}) \ No newline at end of file +}) diff --git a/frontend/frontend/cypress/component/Header.cy.tsx b/frontend/frontend/cypress/component/Header.cy.tsx index a21cd510..37b7e182 100644 --- a/frontend/frontend/cypress/component/Header.cy.tsx +++ b/frontend/frontend/cypress/component/Header.cy.tsx @@ -5,41 +5,58 @@ import fixtures from '../fixtures/fixtures.json' describe('Header', () => { const mockProps = { // variant: "not_main" | "editable" | "default"; - variant: "not_main", + variant: 'not_main', title: fixtures.title, - }; + } it('renders not main', () => { - cy.mount(
) - cy.get('.MuiToolbar-root').should('exist'); - cy.get('[data-cy=title]').should('exist').should('have.text', fixtures.title); - cy.get('#logo').click(); - cy.get('#editButton').should('not.exist'); - cy.get('[data-cy=backButton').trigger('mouseover'); - cy.contains('back').should('be.visible'); - cy.contains('Logout').should('be.visible'); - - }); + cy.mount( + +
+ + ) + cy.get('.MuiToolbar-root').should('exist') + cy.get('[data-cy=title]') + .should('exist') + .should('have.text', fixtures.title) + cy.get('#logo').click() + cy.get('#editButton').should('not.exist') + cy.get('[data-cy=backButton').trigger('mouseover') + cy.contains('back').should('be.visible') + cy.contains('Logout').should('be.visible') + }) it ('renders editable', () => { - mockProps.variant = "editable"; - cy.mount(
) - cy.get('.MuiToolbar-root').should('exist'); - cy.get('[data-cy=title]').should('exist').should('have.text', fixtures.title); - cy.get('#logo').click(); - cy.get('#editButton').should('exist'); - cy.get('[data-cy=backButton').trigger('mouseover'); - cy.contains('back').should('be.visible'); - cy.contains('Logout').should('be.visible'); - }); + mockProps.variant = 'editable' + cy.mount( + +
+ + ) + cy.get('.MuiToolbar-root').should('exist') + cy.get('[data-cy=title]') + .should('exist') + .should('have.text', fixtures.title) + cy.get('#logo').click() + cy.get('#editButton').should('exist') + cy.get('[data-cy=backButton').trigger('mouseover') + cy.contains('back').should('be.visible') + cy.contains('Logout').should('be.visible') + }) it ('renders default', () => { - mockProps.variant = "default"; - cy.mount(
) - cy.get('.MuiToolbar-root').should('exist'); - cy.get('[data-cy=title]').should('exist').should('have.text', fixtures.title); - cy.get('#logo').click(); - cy.get('#editButton').should('not.exist'); - cy.contains('Logout').should('be.visible'); - }); -}) \ No newline at end of file + mockProps.variant = 'default' + cy.mount( + +
+ + ) + cy.get('.MuiToolbar-root').should('exist') + cy.get('[data-cy=title]') + .should('exist') + .should('have.text', fixtures.title) + cy.get('#logo').click() + cy.get('#editButton').should('not.exist') + cy.contains('Logout').should('be.visible') + }) +}) diff --git a/frontend/frontend/cypress/component/ItemList.cy.tsx b/frontend/frontend/cypress/component/ItemList.cy.tsx index 69ae8635..ef027210 100644 --- a/frontend/frontend/cypress/component/ItemList.cy.tsx +++ b/frontend/frontend/cypress/component/ItemList.cy.tsx @@ -1,29 +1,50 @@ -import { ItemList } from '../../src/components/ItemList'; -import fixtures from '../fixtures/fixtures.json'; +import { ItemList } from '../../src/components/ItemList' +import fixtures from '../fixtures/fixtures.json' describe('ItemList', () => { const mockProps = { itemList: fixtures.itemList, - }; + } it('renders', () => { - cy.mount(); - cy.get('.MuiPaper-root').should('exist'); - cy.get('.MuiTable-root').should('exist'); - cy.get('#head').should('exist'); - cy.get('#head').find('#opdracht').should('exist').should('have.text', 'Opdracht'); - cy.get('#head').find('#deadline').should('exist').should('have.text', 'Deadline'); - cy.get('#head').find('#status').should('exist').should('have.text', 'Status'); - cy.get('#body').should('exist'); - cy.get('.MuiTableCell-root').should('exist'); - cy.get('.MuiTableRow-root').should('exist'); + cy.mount() + cy.get('.MuiPaper-root').should('exist') + cy.get('.MuiTable-root').should('exist') + cy.get('#head').should('exist') + cy.get('#head') + .find('#opdracht') + .should('exist') + .should('have.text', 'Opdracht') + cy.get('#head') + .find('#deadline') + .should('exist') + .should('have.text', 'Deadline') + cy.get('#head') + .find('#status') + .should('exist') + .should('have.text', 'Status') + cy.get('#body').should('exist') + cy.get('.MuiTableCell-root').should('exist') + cy.get('.MuiTableRow-root').should('exist') for (let i = 0; i < fixtures.itemList.length; i++) { - cy.get(`#${i}`).should('exist'); - cy.get(`#${i}`).find('#opdracht').should('exist').should('have.text', fixtures.itemList[i].opdracht); - cy.get(`#${i}`).find('#deadline').should('exist').should('have.text', fixtures.itemList[i].deadline); - cy.get(`#${i}`).find('#status').should('exist').should('have.text', fixtures.itemList[i].status); - cy.get(`#${i}`).find('#score').should('exist').should('have.text', fixtures.itemList[i].score); + cy.get(`#${i}`).should('exist') + cy.get(`#${i}`) + .find('#opdracht') + .should('exist') + .should('have.text', fixtures.itemList[i].opdracht) + cy.get(`#${i}`) + .find('#deadline') + .should('exist') + .should('have.text', fixtures.itemList[i].deadline) + cy.get(`#${i}`) + .find('#status') + .should('exist') + .should('have.text', fixtures.itemList[i].status) + cy.get(`#${i}`) + .find('#score') + .should('exist') + .should('have.text', fixtures.itemList[i].score) } - }); -}); \ No newline at end of file + }) +}) diff --git a/frontend/frontend/cypress/component/LanguageSwitcher.cy.tsx b/frontend/frontend/cypress/component/LanguageSwitcher.cy.tsx index 3a1cb47b..73daa107 100644 --- a/frontend/frontend/cypress/component/LanguageSwitcher.cy.tsx +++ b/frontend/frontend/cypress/component/LanguageSwitcher.cy.tsx @@ -1,11 +1,9 @@ -import { LanguageSwitcher } from "../../src/components/LanguageSwitcher"; +import { LanguageSwitcher } from '../../src/components/LanguageSwitcher' describe('LanguageSwitcher', () => { - it('renders', () => { cy.mount() - cy.get('[data-cy=en]').should('exist').should('have.text', 'En'); - cy.get('[data-cy=nl]').should('exist').should('have.text', 'Nl'); - }); - -}) \ No newline at end of file + cy.get('[data-cy=en]').should('exist').should('have.text', 'En') + cy.get('[data-cy=nl]').should('exist').should('have.text', 'Nl') + }) +}) diff --git a/frontend/frontend/cypress/component/RestrictionCard.cy.tsx b/frontend/frontend/cypress/component/RestrictionCard.cy.tsx index d6a44fd8..3798ebb7 100644 --- a/frontend/frontend/cypress/component/RestrictionCard.cy.tsx +++ b/frontend/frontend/cypress/component/RestrictionCard.cy.tsx @@ -1,4 +1,4 @@ -import { RestrictionCard } from '../../src/components/RestrictionCard'; +import { RestrictionCard } from '../../src/components/RestrictionCard' describe('RestrictionCard', () => { const mockProps = { @@ -7,11 +7,13 @@ describe('RestrictionCard', () => { }, restrictions: [], setRestrictions: () => {}, - }; + } it('renders', () => { - cy.mount(); - cy.get('#script').should('exist').should('have.text', 'This is a test script'); - cy.get('#closeButton').should('exist').click(); - }); -}); \ No newline at end of file + cy.mount() + cy.get('#script') + .should('exist') + .should('have.text', 'This is a test script') + cy.get('#closeButton').should('exist').click() + }) +}) diff --git a/frontend/frontend/cypress/component/SubmissionListItemStudentPage.cy.tsx b/frontend/frontend/cypress/component/SubmissionListItemStudentPage.cy.tsx index 6209c48d..0b4bce20 100644 --- a/frontend/frontend/cypress/component/SubmissionListItemStudentPage.cy.tsx +++ b/frontend/frontend/cypress/component/SubmissionListItemStudentPage.cy.tsx @@ -1,33 +1,48 @@ -import { SubmissionListItemStudentPage } from '../../src/components/SubmissionListItemStudentPage'; -import { BrowserRouter } from 'react-router-dom'; +import { SubmissionListItemStudentPage } from '../../src/components/SubmissionListItemStudentPage' +import { BrowserRouter } from 'react-router-dom' describe('SubmissionListItemStudentPage', () => { const mockProps = { - realId: "1", - visualId: "Logisch programmeren - Opdracht 1", + realId: '1', + visualId: 'Logisch programmeren - Opdracht 1', timestamp: new Date().toLocaleString(), status: true, assignment_id: 1, course_id: 1, - }; + } it('renders correct submission', () => { - cy.mount(); - cy.get('.MuiListItemButton-root').should('exist'); - cy.get('[data-cy=visualId]').should('exist').should('have.text', mockProps.visualId); - cy.get('[data-cy=submissionTimestamp]').should('exist').should('have.text', mockProps.timestamp); - cy.get('#check').should('exist'); - cy.get('#cross').should('not.exist'); - }); + cy.mount( + + + + ) + cy.get('.MuiListItemButton-root').should('exist') + cy.get('[data-cy=visualId]') + .should('exist') + .should('have.text', mockProps.visualId) + cy.get('[data-cy=submissionTimestamp]') + .should('exist') + .should('have.text', mockProps.timestamp) + cy.get('#check').should('exist') + cy.get('#cross').should('not.exist') + }) it('renders incorrect submission', () => { - mockProps.status = false; - cy.mount(); - cy.get('.MuiListItemButton-root').should('exist'); - cy.get('[data-cy=visualId]').should('exist').should('have.text', mockProps.visualId); - cy.get('[data-cy=submissionTimestamp]').should('exist').should('have.text', mockProps.timestamp); - cy.get('#check').should('not.exist'); - cy.get('#cross').should('exist'); - }); - -}); \ No newline at end of file + mockProps.status = false + cy.mount( + + + + ) + cy.get('.MuiListItemButton-root').should('exist') + cy.get('[data-cy=visualId]') + .should('exist') + .should('have.text', mockProps.visualId) + cy.get('[data-cy=submissionTimestamp]') + .should('exist') + .should('have.text', mockProps.timestamp) + cy.get('#check').should('not.exist') + cy.get('#cross').should('exist') + }) +}) diff --git a/frontend/frontend/cypress/component/SubmissionListItemTeacherPage.cy.tsx b/frontend/frontend/cypress/component/SubmissionListItemTeacherPage.cy.tsx index f778e895..b7e4a701 100644 --- a/frontend/frontend/cypress/component/SubmissionListItemTeacherPage.cy.tsx +++ b/frontend/frontend/cypress/component/SubmissionListItemTeacherPage.cy.tsx @@ -1,5 +1,5 @@ -import { SubmissionListItemTeacherPage } from '../../src/components/SubmissionListItemTeacherPage'; -import { BrowserRouter } from 'react-router-dom'; +import { SubmissionListItemTeacherPage } from '../../src/components/SubmissionListItemTeacherPage' +import { BrowserRouter } from 'react-router-dom' describe('SubmissionListItemTeacherPage', () => { const mockProps = { @@ -7,19 +7,25 @@ describe('SubmissionListItemTeacherPage', () => { group_id: 1, assignment_id: 1, course_id: 1, - }; + } it('renders correct submission', () => { // The data needs to be fetched from the backend, so we can't check that - cy.mount(); - cy.get('.MuiListItemButton-root').should('exist'); - cy.get('[data-cy=submissionTimestamp]').should('exist'); - cy.get('[data-cy=groupName').should('exist').should('have.text', mockProps.group_name); - cy.get('[data-cy=submissionScore]').should('exist'); - cy.get('[data-cy=statusIcon]').should('exist'); - cy.get('[data-cy=check]').should('not.exist'); - cy.get('[data-cy=cross]').should('exist'); - cy.get('[data-cy=downloadIconGray]').should('exist'); - cy.get('[data-cy=downloadIconColor]').should('not.exist'); - }); -}); \ No newline at end of file + cy.mount( + + + + ) + cy.get('.MuiListItemButton-root').should('exist') + cy.get('[data-cy=submissionTimestamp]').should('exist') + cy.get('[data-cy=groupName') + .should('exist') + .should('have.text', mockProps.group_name) + cy.get('[data-cy=submissionScore]').should('exist') + cy.get('[data-cy=statusIcon]').should('exist') + cy.get('[data-cy=check]').should('not.exist') + cy.get('[data-cy=cross]').should('exist') + cy.get('[data-cy=downloadIconGray]').should('exist') + cy.get('[data-cy=downloadIconColor]').should('not.exist') + }) +}) diff --git a/frontend/frontend/cypress/component/TabSwitcher.cy.tsx b/frontend/frontend/cypress/component/TabSwitcher.cy.tsx index 64d31c4f..f1912295 100644 --- a/frontend/frontend/cypress/component/TabSwitcher.cy.tsx +++ b/frontend/frontend/cypress/component/TabSwitcher.cy.tsx @@ -1,44 +1,42 @@ -import TabSwitcher from "../../src/components/TabSwitcher"; -import { ThemeProvider } from '@mui/system'; -import theme from '../../src/Theme.ts'; - +import TabSwitcher from '../../src/components/TabSwitcher' +import { ThemeProvider } from '@mui/system' +import theme from '../../src/Theme.ts' describe('TabSwitcher', () => { const mockProps = { titles: ['assignment', 'students', 'groups'], nodes: [
node1
,
node2
,
node3
], - }; - + } + it('renders', () => { cy.mount( - ); + ) // the titles do not render because of internationalization? - cy.get('#tab0').should('exist'); - cy.get('#node0').should('exist').should('be.visible'); - cy.get('#node1').should('exist').should('not.be.visible'); - cy.get('#node2').should('exist').should('not.be.visible'); - cy.contains('node1').should('exist'); - cy.contains('node2').should('not.exist'); - cy.contains('node3').should('not.exist'); - - cy.get('#tab1').click(); - cy.get('#node0').should('exist').should('not.be.visible'); - cy.get('#node1').should('exist').should('be.visible'); - cy.get('#node2').should('exist').should('not.be.visible'); - cy.contains('node1').should('not.exist'); - cy.contains('node2').should('exist'); - cy.contains('node3').should('not.exist'); + cy.get('#tab0').should('exist') + cy.get('#node0').should('exist').should('be.visible') + cy.get('#node1').should('exist').should('not.be.visible') + cy.get('#node2').should('exist').should('not.be.visible') + cy.contains('node1').should('exist') + cy.contains('node2').should('not.exist') + cy.contains('node3').should('not.exist') - cy.get('#tab2').click(); - cy.get('#node0').should('exist').should('not.be.visible'); - cy.get('#node1').should('exist').should('not.be.visible'); - cy.get('#node2').should('exist').should('be.visible'); - cy.contains('node1').should('not.exist'); - cy.contains('node2').should('not.exist'); - cy.contains('node3').should('exist'); + cy.get('#tab1').click() + cy.get('#node0').should('exist').should('not.be.visible') + cy.get('#node1').should('exist').should('be.visible') + cy.get('#node2').should('exist').should('not.be.visible') + cy.contains('node1').should('not.exist') + cy.contains('node2').should('exist') + cy.contains('node3').should('not.exist') - }); -}); \ No newline at end of file + cy.get('#tab2').click() + cy.get('#node0').should('exist').should('not.be.visible') + cy.get('#node1').should('exist').should('not.be.visible') + cy.get('#node2').should('exist').should('be.visible') + cy.contains('node1').should('not.exist') + cy.contains('node2').should('not.exist') + cy.contains('node3').should('exist') + }) +}) diff --git a/frontend/frontend/cypress/component/WarningPopup.cy.tsx b/frontend/frontend/cypress/component/WarningPopup.cy.tsx index 8e9fd0fe..1075eeb8 100644 --- a/frontend/frontend/cypress/component/WarningPopup.cy.tsx +++ b/frontend/frontend/cypress/component/WarningPopup.cy.tsx @@ -1,5 +1,5 @@ -import WarningPopup from '../../src/components/WarningPopup'; -import fixtures from '../fixtures/fixtures.json'; +import WarningPopup from '../../src/components/WarningPopup' +import fixtures from '../fixtures/fixtures.json' describe('WarningPopup', () => { const mockProps = { @@ -9,23 +9,27 @@ describe('WarningPopup', () => { open: true, handleClose: () => {}, doAction: () => {}, - }; + } it('renders', () => { - cy.mount(); + cy.mount() // cancel not visible because of internationlization - cy.get('#popUpTitle').should('exist').should('have.text', fixtures.title); - cy.get('#popUpText').should('exist').should('have.text', fixtures.warning); - cy.get('#cancelButton').should('exist'); - cy.get('#confirm').should('exist').should('have.text', fixtures.button); - }); + cy.get('#popUpTitle') + .should('exist') + .should('have.text', fixtures.title) + cy.get('#popUpText') + .should('exist') + .should('have.text', fixtures.warning) + cy.get('#cancelButton').should('exist') + cy.get('#confirm').should('exist').should('have.text', fixtures.button) + }) it('renders closed', () => { - mockProps.open = false; - cy.mount(); - cy.get('#popUpTitle').should('not.exist'); - cy.get('#popUpText').should('not.exist'); - cy.get('#cancelButton').should('not.exist'); - cy.get('#actionButton').should('not.exist'); - }); -}); \ No newline at end of file + mockProps.open = false + cy.mount() + cy.get('#popUpTitle').should('not.exist') + cy.get('#popUpText').should('not.exist') + cy.get('#cancelButton').should('not.exist') + cy.get('#actionButton').should('not.exist') + }) +})