From 153b99d0548080bba62676204e77b890088f1693 Mon Sep 17 00:00:00 2001 From: Alifia Rahmah <alifiarahmah03@gmail.com> Date: Fri, 28 Apr 2023 18:37:25 +0700 Subject: [PATCH] fix: fix cypress error for build --- cypress/support/component.ts | 2 +- cypress/utils/router.tsx | 2 +- src/components/admin/row-action.cy.tsx | 5 ++- src/components/course/row_action.cy.tsx | 4 +- src/components/course_banner.cy.tsx | 5 ++- src/components/course_card.cy.tsx | 5 ++- src/components/course_card_skeleton.cy.tsx | 5 ++- src/components/home_sidebar.cy.tsx | 5 ++- src/components/layout.cy.tsx | 4 +- .../management/course/add-course-modal.cy.tsx | 5 ++- .../course/delete-course-modal.cy.tsx | 5 ++- .../course/edit-course-modal.cy.tsx | 5 ++- .../course/quiz/problem-item.cy.tsx | 38 ++++++++++++++++--- src/components/modal.cy.tsx | 9 +++-- src/components/navbar.cy.tsx | 4 +- src/components/not_found.cy.tsx | 5 ++- src/components/right-sidebar.cy.tsx | 4 +- src/components/select_search.cy.tsx | 5 ++- .../material/[material_id]/file.tsx | 12 +++--- .../course/[course_id]/quiz/index.tsx | 23 +++++------ src/pages/quiz/[id]/pembahasan.tsx | 6 +-- src/pages/quiz/[id]/result.tsx | 15 ++++---- 22 files changed, 108 insertions(+), 65 deletions(-) diff --git a/cypress/support/component.ts b/cypress/support/component.ts index 395d407..aaa9bdd 100644 --- a/cypress/support/component.ts +++ b/cypress/support/component.ts @@ -36,4 +36,4 @@ declare global { Cypress.Commands.add('mount', mount); // Example use: -// cy.mount(<MyComponent />) +// mount(<MyComponent />) diff --git a/cypress/utils/router.tsx b/cypress/utils/router.tsx index a8a3ff0..c419fa8 100644 --- a/cypress/utils/router.tsx +++ b/cypress/utils/router.tsx @@ -37,7 +37,7 @@ const MockRouter = ({ children, ...props }: MockRouterProps) => { const router = createRouter(props); return ( - <RouterContext.Provider value={router}>{children}</RouterContext.Provider> + <RouterContext.Provider value={router as NextRouter}>{children}</RouterContext.Provider> ); }; diff --git a/src/components/admin/row-action.cy.tsx b/src/components/admin/row-action.cy.tsx index 47847ff..3eb57c3 100644 --- a/src/components/admin/row-action.cy.tsx +++ b/src/components/admin/row-action.cy.tsx @@ -1,9 +1,10 @@ -import React from 'react'; import RowAction from './row-action'; +import { mount } from 'cypress/react18'; + describe('<RowAction />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<RowAction onOpenEdit={() => {}} onOpenDelete={() => {}} />); + mount(<RowAction onOpenEdit={() => {}} onOpenDelete={() => {}} />); }); }); diff --git a/src/components/course/row_action.cy.tsx b/src/components/course/row_action.cy.tsx index c1998c0..c9163b5 100644 --- a/src/components/course/row_action.cy.tsx +++ b/src/components/course/row_action.cy.tsx @@ -1,8 +1,10 @@ import RowAction from './row_action'; +import { mount } from 'cypress/react18'; + describe('<RowAction />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<RowAction onOpenEdit={() => {}} onOpenDelete={() => {}} />); + mount(<RowAction />); }); }); diff --git a/src/components/course_banner.cy.tsx b/src/components/course_banner.cy.tsx index 9a280d8..39f6ed4 100644 --- a/src/components/course_banner.cy.tsx +++ b/src/components/course_banner.cy.tsx @@ -1,9 +1,10 @@ -import React from 'react'; import CourseBanner from './course_banner'; +import { mount } from 'cypress/react18'; + describe('<CourseBanner />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<CourseBanner course_code={''} course_name={''} lecturer={''} />); + mount(<CourseBanner course_code={''} course_name={''} lecturer={''} />); }); }); diff --git a/src/components/course_card.cy.tsx b/src/components/course_card.cy.tsx index ef0b103..e0b3158 100644 --- a/src/components/course_card.cy.tsx +++ b/src/components/course_card.cy.tsx @@ -1,10 +1,11 @@ -import React from 'react'; import CourseCard from './course_card'; +import { mount } from 'cypress/react18'; + describe('<CourseCard />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <CourseCard courseCode={''} major={''} diff --git a/src/components/course_card_skeleton.cy.tsx b/src/components/course_card_skeleton.cy.tsx index 94f907a..e085475 100644 --- a/src/components/course_card_skeleton.cy.tsx +++ b/src/components/course_card_skeleton.cy.tsx @@ -1,9 +1,10 @@ -import React from 'react'; import CourseCardSkeleton from './course_card_skeleton'; +import { mount } from 'cypress/react18'; + describe('<CourseCardSkeleton />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<CourseCardSkeleton />); + mount(<CourseCardSkeleton />); }); }); diff --git a/src/components/home_sidebar.cy.tsx b/src/components/home_sidebar.cy.tsx index e6581cf..cafdb2f 100644 --- a/src/components/home_sidebar.cy.tsx +++ b/src/components/home_sidebar.cy.tsx @@ -1,9 +1,10 @@ -import React from 'react'; import HomeSidebar from './home_sidebar'; +import { mount } from 'cypress/react18'; + describe('<HomeSidebar />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<HomeSidebar />); + mount(<HomeSidebar />); }); }); diff --git a/src/components/layout.cy.tsx b/src/components/layout.cy.tsx index 56da5da..6eab1dc 100644 --- a/src/components/layout.cy.tsx +++ b/src/components/layout.cy.tsx @@ -1,11 +1,13 @@ import MockRouter from '../../cypress/utils/router'; import Layout from './layout'; +import { mount } from 'cypress/react18'; + describe('<Layout />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react // mount next router - cy.mount( + mount( <MockRouter> <Layout> <p>test</p> diff --git a/src/components/management/course/add-course-modal.cy.tsx b/src/components/management/course/add-course-modal.cy.tsx index 5a0a113..dacdd4f 100644 --- a/src/components/management/course/add-course-modal.cy.tsx +++ b/src/components/management/course/add-course-modal.cy.tsx @@ -1,10 +1,11 @@ -import React from 'react'; import AddCourseModal from './add-course-modal'; +import { mount } from 'cypress/react18'; + describe('<AddCourseModal />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <AddCourseModal isOpen={false} onClose={function (): void { diff --git a/src/components/management/course/delete-course-modal.cy.tsx b/src/components/management/course/delete-course-modal.cy.tsx index d10ae1e..57d63f1 100644 --- a/src/components/management/course/delete-course-modal.cy.tsx +++ b/src/components/management/course/delete-course-modal.cy.tsx @@ -1,10 +1,11 @@ -import React from 'react'; import DeleteCourseModal from './delete-course-modal'; +import { mount } from 'cypress/react18'; + describe('<DeleteCourseModal />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <DeleteCourseModal isOpen={false} onClose={function (): void { diff --git a/src/components/management/course/edit-course-modal.cy.tsx b/src/components/management/course/edit-course-modal.cy.tsx index 3a46d3c..ecb52e6 100644 --- a/src/components/management/course/edit-course-modal.cy.tsx +++ b/src/components/management/course/edit-course-modal.cy.tsx @@ -1,10 +1,11 @@ -import React from 'react'; import AddCourseModal from './edit-course-modal'; +import { mount } from 'cypress/react18'; + describe('<AddCourseModal />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <AddCourseModal isOpen={false} onClose={function (): void { diff --git a/src/components/management/course/quiz/problem-item.cy.tsx b/src/components/management/course/quiz/problem-item.cy.tsx index dc89b3b..952ee5b 100644 --- a/src/components/management/course/quiz/problem-item.cy.tsx +++ b/src/components/management/course/quiz/problem-item.cy.tsx @@ -1,16 +1,42 @@ import { Problem } from '@/types/problem'; import ProblemItem from './problem-item'; +import { mount } from 'cypress/react18'; + describe('<ProblemItem />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react const question: Problem = { - number: '0', - statement: 'Pertanyaan?', - options: ['Jawaban A', 'Jawaban B', 'Jawaban C'], - answer: 'Jawaban A', - explanation: 'Karena jawaban A benar', + id: 'fe7d63c9-8cf1-4f1f-a351-ce6e611f06b4', + media_id: [], + question: 'Berapa 1 + 1 ?', + answers: [ + { + id: '23fe6f84-cb98-4782-9cf6-3d7e99ad2246', + media_id: [], + answer: '', + is_solution: null, + }, + { + id: '04ecce22-175a-4c6b-9f2e-057e68f3a30a', + media_id: [], + answer: '', + is_solution: null, + }, + { + id: 'e505a84a-56d8-4544-a719-52fbeb8a860c', + media_id: [], + answer: '', + is_solution: null, + }, + { + id: '1f29a78e-65e0-4b45-b884-663eed2ef644', + media_id: [], + answer: '', + is_solution: null, + }, + ], }; - cy.mount(<ProblemItem id={0} question={question} />); + mount(<ProblemItem id={0} question={question} />); }); }); diff --git a/src/components/modal.cy.tsx b/src/components/modal.cy.tsx index 0b27ce2..126a333 100644 --- a/src/components/modal.cy.tsx +++ b/src/components/modal.cy.tsx @@ -1,16 +1,19 @@ import Modal from './modal'; +import { mount } from 'cypress/react18'; + describe('<Modal />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <Modal isOpen={false} onClose={function (): void { throw new Error('Function not implemented.'); }} - children={undefined} - /> + > + <div>Modal</div> + </Modal> ); }); }); diff --git a/src/components/navbar.cy.tsx b/src/components/navbar.cy.tsx index 0f738f9..753b7a5 100644 --- a/src/components/navbar.cy.tsx +++ b/src/components/navbar.cy.tsx @@ -1,10 +1,12 @@ import MockRouter from '../../cypress/utils/router'; import Navbar from './navbar'; +import { mount } from 'cypress/react18'; + describe('<Navbar />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <MockRouter> <Navbar /> </MockRouter> diff --git a/src/components/not_found.cy.tsx b/src/components/not_found.cy.tsx index 5f91e2f..a1482cd 100644 --- a/src/components/not_found.cy.tsx +++ b/src/components/not_found.cy.tsx @@ -1,9 +1,10 @@ -import React from 'react'; import NotFound from './not_found'; +import { mount } from 'cypress/react18'; + describe('<NotFound />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount(<NotFound />); + mount(<NotFound />); }); }); diff --git a/src/components/right-sidebar.cy.tsx b/src/components/right-sidebar.cy.tsx index 0d97194..e440717 100644 --- a/src/components/right-sidebar.cy.tsx +++ b/src/components/right-sidebar.cy.tsx @@ -1,9 +1,11 @@ import RightSidebar from './right-sidebar'; +import { mount } from 'cypress/react18'; + describe('<RightSidebar />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react - cy.mount( + mount( <RightSidebar kodeMataKuliah={''} mataKuliah={''} dosenPengajar={''} /> ); }); diff --git a/src/components/select_search.cy.tsx b/src/components/select_search.cy.tsx index 9dbfb31..318695d 100644 --- a/src/components/select_search.cy.tsx +++ b/src/components/select_search.cy.tsx @@ -1,6 +1,7 @@ -import React from 'react'; import { SelectSearch } from './select_search'; +import { mount } from 'cypress/react18'; + describe('<SelectSearch />', () => { it('renders', () => { // see: https://on.cypress.io/mounting-react @@ -10,6 +11,6 @@ describe('<SelectSearch />', () => { cy.intercept('GET', '/course/faculty', { fixture: 'faculty.json', }); - cy.mount(<SelectSearch />); + mount(<SelectSearch />); }); }); diff --git a/src/pages/management/course/[course_id]/material/[material_id]/file.tsx b/src/pages/management/course/[course_id]/material/[material_id]/file.tsx index bf9f497..a9fb73d 100644 --- a/src/pages/management/course/[course_id]/material/[material_id]/file.tsx +++ b/src/pages/management/course/[course_id]/material/[material_id]/file.tsx @@ -93,7 +93,7 @@ const EditContentPage = ({ console.log(res); toast({ title: 'Adding material success!', - description: res.message, + description: res.data.message, status: 'success', duration: 9000, isClosable: true @@ -204,31 +204,31 @@ const EditContent = () => { material_code : null }; const course = await http.get(`${process.env.NEXT_PUBLIC_API_URL}/course/${course_id}`); - + if(course.status != 200){ res.status = 404; setData(res); return; } - + res.course_code = course.data.data.id; res.course_name = course.data.data.name; res.lecturer = course.data.data.lecturer; - + let user : UserClaim | null = getAvailableUserData(); if(!user || (user.role != "admin" && user.email != course.data.data.email)){ res.status = 403; setData(res); return; } - + /* const material = await http.get(`${process.env.NEXT_PUBLIC_API_URL}/material/${material_id}`); if(material.status != 200 || material.data.data.course_code != course_id){ res.status = 404; return res; }*/ - + res.material_code = material_id; setData(res); } diff --git a/src/pages/management/course/[course_id]/quiz/index.tsx b/src/pages/management/course/[course_id]/quiz/index.tsx index 8233967..3ec1c89 100644 --- a/src/pages/management/course/[course_id]/quiz/index.tsx +++ b/src/pages/management/course/[course_id]/quiz/index.tsx @@ -26,19 +26,16 @@ import Modal from '@/components/modal'; const quizzes = [ { - id: 1, - title: 'Latihan Soal Clustering 1', - week: 1, + id: '440e9a7b-5fe5-481c-a98d-a1736e91f42b', + nama: 'Latihan Sample', + course_id: 'IF3270', + creator_email: 'contributor@example.com', }, { - id: 2, - title: 'Latihan Soal Clustering 2', - week: 2, - }, - { - id: 3, - title: 'Latihan Soal Clustering 3', - week: 3, + id: 'ca45c775-bb74-422e-943c-08e9601d6d41', + nama: 'Latihan Beneran', + course_id: 'IF3270', + creator_email: 'contributor@example.com', }, ]; @@ -79,15 +76,13 @@ export default function QuizManagement() { <Thead textTransform="capitalize"> <Tr> <Th>Judul Latihan Soal</Th> - <Th>Week</Th> <Th>Action</Th> </Tr> </Thead> <Tbody> {quizzes.map((q: Quiz) => ( <Tr key={q.id}> - <Td>{q.title}</Td> - <Td>{q.week}</Td> + <Td>{q.nama}</Td> <Td> <RowAction onOpenEdit={() => { diff --git a/src/pages/quiz/[id]/pembahasan.tsx b/src/pages/quiz/[id]/pembahasan.tsx index 4c0f604..9fe816e 100644 --- a/src/pages/quiz/[id]/pembahasan.tsx +++ b/src/pages/quiz/[id]/pembahasan.tsx @@ -15,9 +15,9 @@ import { useRouter } from 'next/router'; function Pembahasan() { const router = useRouter(); - const userAnswers = JSON.parse( - router.query.userAnswers as string - ) as UserAnswer[]; + // const userAnswers: UserAnswer[] = JSON.parse( + // router.query.userAnswers as string + // ); return ( <Layout> diff --git a/src/pages/quiz/[id]/result.tsx b/src/pages/quiz/[id]/result.tsx index 1aa2d19..44c6e63 100644 --- a/src/pages/quiz/[id]/result.tsx +++ b/src/pages/quiz/[id]/result.tsx @@ -10,12 +10,11 @@ import { useEffect, useState } from 'react'; function Result() { const router = useRouter(); const [score, setScore] = useState(0); - const userAnswers = JSON.parse( - router.query.userAnswers as string - ) as UserAnswer[]; + const [userAnswers, setUserAnswers] = useState<UserAnswer[]>([]); useEffect(() => { // parse user answer as UserAnswer[] from router.query.userAnswers + setUserAnswers(JSON.parse(router.query.userAnswers as string)); // POST http .post(`/quiz/${router.query.id}/finish`, { @@ -50,10 +49,12 @@ function Result() { justifyContent="space-between" direction={{ base: 'column', lg: 'row' }} > - <Link href={{ - pathname: router.asPath + '/../pembahasan', - query: { userAnswers: JSON.stringify(userAnswers) }, - }}> + <Link + href={{ + pathname: router.asPath + '/../pembahasan', + query: { userAnswers: JSON.stringify(userAnswers) }, + }} + > <Button bg="#4F4F4F" color="white"> Cek Pembahasan </Button> -- GitLab