[2단계 - 상세 정보 & UI/UX 개선하기] 먼지 미션 제출합니다. #316
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,115 @@ | ||
| import { moviesFixture, movieFixture } from "../../test/fixtures"; | ||
|
|
||
| const mathRound = (value: number, numDigits:number = 1): number => { | ||
| return Math.round(value * 10 ** numDigits) / 10 ** numDigits; | ||
| } | ||
|
|
||
| describe("영화 상세 팝업 기능 테스트", () => { | ||
| beforeEach(() => { | ||
| cy.intercept("GET", "**/movie/popular?page=1", { | ||
| statusCode: 200, | ||
| body: { | ||
| page: 1, | ||
| results: [...moviesFixture], | ||
| total_pages: 2, | ||
| total_results: 40, | ||
| }, | ||
| }).as("getPopularPage1"); | ||
|
|
||
| cy.intercept("GET", `**/movie/${movieFixture.id}`, { | ||
| statusCode: 200, | ||
| body: { ...movieFixture }, | ||
| }).as("getMovieId"); | ||
|
|
||
| cy.visit("localhost:5173"); | ||
| cy.wait("@getPopularPage1"); | ||
| }); | ||
|
|
||
| it("제목을 누르면 상세 팝업이 렌더링 된다.", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| cy.get("#modalBackground").should('have.length', 1); | ||
| cy.get("#detail-modal-title").should('have.text', movieFixture.title); | ||
| cy.get("#detail-modal-img").should('have.attr', 'src').and('include', movieFixture.poster_path); | ||
| cy.get("#detail-modal-rate").should('have.text', mathRound(movieFixture.vote_average)); | ||
| cy.get("#detail-modal-detail").should('have.text', movieFixture.overview); | ||
| }); | ||
|
|
||
| it("닫기버튼을 누르면 상세 팝업이 닫힌다.", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| cy.get("#modalBackground").should('have.length', 1); | ||
|
|
||
| cy.get("#closeModal").click(); | ||
|
|
||
| cy.get("#modalBackground").should('have.length', 0); | ||
| }); | ||
|
|
||
| it("ESC을 입력하면 상세 팝업이 닫힌다.", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| cy.get("#modalBackground").should('have.length', 1); | ||
|
|
||
| cy.get("body").type("{esc}"); | ||
|
|
||
| cy.get("#modalBackground").should('have.length', 0); | ||
| }); | ||
|
|
||
| it("평점 별을 눌러서 평점을 매길수 있다.", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| const rate = 5; | ||
|
|
||
| cy.get("#detail-modal-star-box .star").eq(rate - 1).click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star.on").should('have.length', rate); | ||
| }); | ||
|
|
||
| it("매겼던 평점을 다시 확인할 수 있다", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| const rate = 5; | ||
|
|
||
| cy.get("#detail-modal-star-box .star").eq(rate - 1).click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star.on").should('have.length', rate); | ||
|
|
||
| cy.get("#closeModal").click(); | ||
|
|
||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star.on").should('have.length', rate); | ||
| }); | ||
|
|
||
|
|
||
| it("매겼던 평점을 평점의별을 눌러서 다시 평점을 매길 수 있다", () => { | ||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.wait("@getMovieId"); | ||
|
|
||
| const prevRate = 5; | ||
| const rate = 1; | ||
|
|
||
| cy.get("#detail-modal-star-box .star").eq(prevRate - 1).click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star.on").should('have.length', prevRate); | ||
|
|
||
| cy.get("#closeModal").click(); | ||
|
|
||
| cy.get("#movie-list li").first().find(".thumbnail").click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star").eq(rate - 1).click(); | ||
|
|
||
| cy.get("#detail-modal-star-box .star.on").should('have.length', rate); | ||
| }); | ||
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
체크리스트 항목 업데이트 필요
PR 설명과 구현된 코드를 보면 상세 팝업, 별점, 무한 스크롤, 반응형 기능이 구현된 것으로 보입니다. 완료된 항목의 체크박스를
[x]로 업데이트하는 것이 좋겠습니다.🤖 Prompt for AI Agents