From 7692926954a1645420c06d01e3f99a89878af435 Mon Sep 17 00:00:00 2001 From: Marieke Sinnaeve <153190736+masinnae@users.noreply.github.com> Date: Wed, 22 May 2024 21:37:58 +0200 Subject: [PATCH] Submissions teacher testen (#238) * styling * styling * styling * styling * submissionslist test * meer testen * format * merge conflicts * lint + format * button verplaatsen * styling klaar * testen * fix test after dev merge * projectview test * more tests * SubmissionsTeacherView.spec.ts * button change position * format * change submissioncard * format --- .../src/components/project/ProjectInfo.vue | 5 - .../components/submission/SubmissionCard.vue | 149 ++++++++---------- .../submission/SubmissionTeacherCard.vue | 15 +- frontend/src/i18n/locales/en.ts | 2 +- frontend/src/i18n/locales/nl.ts | 2 +- frontend/src/router/index.ts | 6 - frontend/src/views/ProjectView.vue | 21 +++ frontend/src/views/SubmissionView.vue | 33 ---- frontend/src/views/SubmissionsTeacherView.vue | 78 ++++++--- .../components/project/ProjectInfo.spec.ts | 27 +++- frontend/tests/views/ProjectView.spec.ts | 16 +- .../views/SubmissionsTeacherView.spec.ts | 60 +++++++ 12 files changed, 256 insertions(+), 158 deletions(-) delete mode 100644 frontend/src/views/SubmissionView.vue create mode 100644 frontend/tests/views/SubmissionsTeacherView.spec.ts diff --git a/frontend/src/components/project/ProjectInfo.vue b/frontend/src/components/project/ProjectInfo.vue index 483f6d86..27159910 100644 --- a/frontend/src/components/project/ProjectInfo.vue +++ b/frontend/src/components/project/ProjectInfo.vue @@ -28,11 +28,6 @@
- - - {{ $t("project.submissions_list_teacher") }} - - diff --git a/frontend/src/components/submission/SubmissionCard.vue b/frontend/src/components/submission/SubmissionCard.vue index 0992e811..3d842221 100644 --- a/frontend/src/components/submission/SubmissionCard.vue +++ b/frontend/src/components/submission/SubmissionCard.vue @@ -1,86 +1,75 @@ diff --git a/frontend/src/components/submission/SubmissionTeacherCard.vue b/frontend/src/components/submission/SubmissionTeacherCard.vue index 81099f69..94f3702b 100644 --- a/frontend/src/components/submission/SubmissionTeacherCard.vue +++ b/frontend/src/components/submission/SubmissionTeacherCard.vue @@ -3,11 +3,10 @@ {{ $t("project.group", { number: submission.group_id }) }} - - + - + {{ $t("project.submissions_list") }} @@ -32,6 +31,16 @@ const { submission } = toRefs(props); } .parent-card { + background-color: rgb(var(--v-theme-background)); + padding: 10px; + width: 100%; +} + +.button { background-color: rgb(var(--v-theme-secondary)); } + +.divider { + margin-bottom: 10px; +} diff --git a/frontend/src/i18n/locales/en.ts b/frontend/src/i18n/locales/en.ts index bf3bb7bc..8212be92 100644 --- a/frontend/src/i18n/locales/en.ts +++ b/frontend/src/i18n/locales/en.ts @@ -68,7 +68,7 @@ export default { myProject: "My projects", capacity_group: "Capacity: ", edit: "Edit project", - submissions_list: "All submissions", + submissions_list: "All submissions from this group", submissions_list_teacher: "All submissions for this project", submissions_zip: "Download all submissions", not_found: "No projects found.", diff --git a/frontend/src/i18n/locales/nl.ts b/frontend/src/i18n/locales/nl.ts index 37b3da67..652d7180 100644 --- a/frontend/src/i18n/locales/nl.ts +++ b/frontend/src/i18n/locales/nl.ts @@ -68,7 +68,7 @@ export default { myProject: "Mijn projecten", capacity_group: "Capaciteit: ", edit: "Bewerk project", - submissions_list: "Alle indieningen", + submissions_list: "Alle indieningen van deze groep", submissions_list_teacher: "Alle indieningen voor dit project", submissions_zip: "Download alle indieningen", not_found: "Geen projecten teruggevonden.", diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts index 6c6c30dc..aaa0e90c 100644 --- a/frontend/src/router/index.ts +++ b/frontend/src/router/index.ts @@ -166,12 +166,6 @@ const router = createRouter({ component: () => import("../views/SubjectRegisterView.vue"), props: (route) => ({ uuid: String(route.params.uuid) }), }, - { - path: "/submissions/:submissionId(\\d+)", - name: "submission", - component: () => import("../views/SubmissionView.vue"), - props: (route) => ({ submissionId: Number(route.params.submissionId) }), - }, { path: "/settings", name: "settings", diff --git a/frontend/src/views/ProjectView.vue b/frontend/src/views/ProjectView.vue index a882b636..0a6dcaca 100644 --- a/frontend/src/views/ProjectView.vue +++ b/frontend/src/views/ProjectView.vue @@ -14,6 +14,14 @@ :subject="subject!" :user="user!" /> + + {{ $t("project.submissions_list_teacher") }} + + user.value.is_teacher || + user.value.is_admin || + instructors.value?.some((element) => element.uid == user.value.uid) +); diff --git a/frontend/src/views/SubmissionView.vue b/frontend/src/views/SubmissionView.vue deleted file mode 100644 index a8baac15..00000000 --- a/frontend/src/views/SubmissionView.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - - - diff --git a/frontend/src/views/SubmissionsTeacherView.vue b/frontend/src/views/SubmissionsTeacherView.vue index 346b4ba9..b527bf57 100644 --- a/frontend/src/views/SubmissionsTeacherView.vue +++ b/frontend/src/views/SubmissionsTeacherView.vue @@ -1,30 +1,44 @@ @@ -33,6 +47,7 @@ import { useProjectQuery } from "@/queries/Project"; import { useProjectSubmissionsQuery } from "@/queries/Submission"; import { toRefs } from "vue"; import SubmissionTeacherCard from "@/components/submission/SubmissionTeacherCard.vue"; +import BackButton from "@/components/buttons/BackButton.vue"; import { download_file } from "@/utils"; const props = defineProps<{ @@ -61,4 +76,23 @@ const downloadAll = () => { background-color: rgb(var(--v-theme-primary)); color: rgb(var(--v-theme-navtext)); } + +.card { + background-color: rgb(var(--v-theme-secondary)); + margin-top: 25px; + padding: 15px; +} + +.title, +.subtitle { + width: 100%; +} + +.backbutton { + margin-top: 30px; +} + +.primary-button { + margin: 15px; +} diff --git a/frontend/tests/components/project/ProjectInfo.spec.ts b/frontend/tests/components/project/ProjectInfo.spec.ts index 961a4529..a0cee26a 100644 --- a/frontend/tests/components/project/ProjectInfo.spec.ts +++ b/frontend/tests/components/project/ProjectInfo.spec.ts @@ -1,10 +1,30 @@ import {mount} from "@vue/test-utils"; import {expect, describe, it, vi} from "vitest"; import ProjectInfo from "@/components/project/ProjectInfo.vue" +import {ref} from "vue"; + +const mockRouter = { + push: vi.fn(), +}; + +vi.mock("vue-router", () => ({ + useRouter: () => mockRouter, +})); + +const testAuthStore = { + isLoggedIn: ref(true), + setLoggedIn(value) { + this.isLoggedIn.value = value; + }, +}; + +vi.mock("@/stores/auth-store", () => ({ + useAuthStore: vi.fn(() => testAuthStore), +})); const mockProject = { name: "projectname", - deadline: new Date(), + deadline: new Date(2024, 5, 31), id: 1, description: "this is a testassignment", capacity: 2 @@ -14,9 +34,8 @@ const mockInstructors = [ {uid: "1", given_name: "instructor 1", surname: "Doe", is_admin: false, is_teacher: false} ] -const mockUser = [ - {uid: "2", given_name: "user 2", surname: "Doe 2", is_admin: false, is_teacher: false} -] +const mockUser = {uid: "2", given_name: "user 2", surname: "Doe 2", is_admin: false, is_teacher: false} + const mockSubject = { name: "subjectname" diff --git a/frontend/tests/views/ProjectView.spec.ts b/frontend/tests/views/ProjectView.spec.ts index 1fe901e8..3a20da0c 100644 --- a/frontend/tests/views/ProjectView.spec.ts +++ b/frontend/tests/views/ProjectView.spec.ts @@ -11,7 +11,8 @@ const testProjectQuery = { }, setIsLoading(value){ this.isLoading.value = value; - } + }, + data: ref({id: 1}) }; vi.mock('@/queries/Project', () => ({ @@ -52,10 +53,15 @@ const testSubjectInstructorsQuery = { }, setIsLoading(value){ this.isLoading.value = value; - } + }, + data: ref([{uid: "instructor"}]) }; const testCurrentUserQuery = { + data: ref({id: 1, is_teacher: false, is_admin: false, uid: "student"}), + setTeacher(value){ + this.data.value.is_teacher = value + }, isLoading: ref(true), isError: ref(true), setIsError(value){ @@ -66,7 +72,6 @@ const testCurrentUserQuery = { } }; - vi.mock('@/queries/User', () => ({ useCurrentUserQuery: vi.fn(() => testCurrentUserQuery), })); @@ -136,4 +141,9 @@ describe("ProjectView", async () => { expect(wrapper.findComponent('.projectInfoComponent').exists()).toBeTruthy() expect(wrapper.findComponent('.projectSideBar').exists()).toBeTruthy() }) + it("render if teacher", async () => { + testCurrentUserQuery.setTeacher(true) + await wrapper.vm.$nextTick() + expect(wrapper.text()).toContain("Alle indieningen voor dit project") + }) }); diff --git a/frontend/tests/views/SubmissionsTeacherView.spec.ts b/frontend/tests/views/SubmissionsTeacherView.spec.ts new file mode 100644 index 00000000..11a88ce7 --- /dev/null +++ b/frontend/tests/views/SubmissionsTeacherView.spec.ts @@ -0,0 +1,60 @@ +import { mount } from "@vue/test-utils"; +import {expect, describe, it, vi} from "vitest"; +import SubmissionsTeacherView from "../../src/views/SubmissionsTeacherView.vue" +import {ref} from "vue"; + +const testProjectSubmissionsQuery = { + data: ref([{id: 1}]), + isLoading: ref(false), + isError: ref(true), + error: ref({message: "error message"}), + setError(value){ + this.isError.value = value + }, + setData(value){ + this.data.value = value + } +} + +vi.mock("@/queries/Submission", () => ({ + useProjectSubmissionsQuery: vi.fn(() => testProjectSubmissionsQuery), +})) + +const testProjectQuery = { + data: ref({id: 1, name: "testproject", deadline: new Date(2025, 5, 31)}), + isLoading: ref(false) +} + +vi.mock("@/queries/Project", () => ({ + useProjectQuery: vi.fn(() => testProjectQuery) +})) + + +describe("SubmissionsTeacherView", () => { + const wrapper = mount(SubmissionsTeacherView, { + props: { + projectId: 1 + }, + global: { + stubs: ['SubmissionTeacherCard', 'BackButton'] + } + }) + it("render if error", async () => { + expect(wrapper.text()).toContain("error message") + testProjectSubmissionsQuery.setError(false) + await wrapper.vm.$nextTick() + }); + it("render if submissions", async () => { + const text = wrapper.text() + expect(text).toContain("Indieningen voor project testproject") + expect(text).toContain("Deze pagina bevat een lijst van de laatste indiening van elke groep voor dit project.") + expect(text).toContain("Download alle indieningen") + expect(wrapper.findComponent({name: "SubmissionTeacherCard"}).exists()).toBeTruthy() + expect(wrapper.findComponent({name: "BackButton"}).exists()).toBeTruthy() + testProjectSubmissionsQuery.setData([]) + await wrapper.vm.$nextTick() + }); + it("render if no submissions", () => { + expect(wrapper.text()).toContain("Nog geen indieningen") + }); +})