inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

실무에 바로 적용하는 프런트엔드 테스트 - 2부. 테스트 심화: 시각적 회귀・E2E 테스트

5.2. E2E 테스트 작성하기 - 메인 홈페이지

[필터 기능] incldues.text vs .each 사용에 대한 차이점 문의

324

wanderlust
1

// shopping-mall-e2e-test-with-answer
cy.findAllByTestId('product-card').each($el => {
      cy.wrap($el).findByText('Shoes').should('exist');
    }); 
// 제 답변
cy.findAllByTestId('product-card').should('includes.text', 'Shoes');

필터 기능을 공식문서를 참고해서 직접 작성해보다가 궁금한 점이 생겼습니다.

Github에 있는 답변처럼 반복문을 돌려 Shoes가 존재하는 지 검증하는 테스트와 제가 작성한 includes.text를 활용하는 방법 사이에 큰 차이점이 있을까요?

어떤게 더 효율적인 테스트 작성방법인지 문의드립니다!

javascript tdd 소프트웨어-테스트 vitest e2e chromatic

답변 1

1

코드 조커, 오프

안녕하세요 wanderlust님!

우선 답변 드리겠습니다. 추후에 질문 있으시다면 고민있어요 게시판 대신 질문으로 남겨주시면 감사하겠습니다 ㅎㅎ 다른 분들도 함께 보시면 좋을 것 같아서요.

추가로 cypress문서를 조금 찾아봤는데요!

includes, include, contain, contains 모두 동일하게 동작하며 배열 중 하나만 포함되어 있어도 참을 반환합니다. (alias 였다는 것은 처음 알았네요 ㅎㅎ)

테스트에서는 모든 카드가 shoes 태그를 갖고 있는지를 검증하고 싶었던 부분이었고, 순회를 하면서 확인한다면 모든 product card가 shoes를 포함하는지 일일히 확인하게 됩니다. 하지만, 작성해주신대로 검증한다면 여러 카드 중 하나만 shoes를 포함하면 된다는 내용이기 때문에 다른 검증이 됩니다.

다른 예시로 radio 버튼 클릭 없이 실행해도 테스트가 통과될 것이며, shoes가 포함된 아이템 뿐만 아니라 다른 아이템이 포함된 상태에서 쿼리를 한 뒤 테스트를 구동해도 통과될 것입니다.

cy.findAllByTestId('product-card').should('includes.text', 'Shoes');

추가로 질문 있으시면 편하게 답변 주시면 감사하겠습니다~

[질문] 삼성 SW 역량테스트 D-5, 효과적인 학습 커리큘럼 추천 부탁드립니다

0

382

1

비전공 국비수료생이 볼 수 있을까요?

0

391

1

로드맵으로 프론트엔드 전향이 가능할까요?

0

413

1

요즘시장에 MERN스택으로 개발하는 프로젝트가 많이 있는지 궁금합니다.

0

457

1

이번에 새로 개강한강좌에대해서 문의요

1

243

1

QA 실무에서도 Appium Studio를 사용하는지 여쭤봅니다.

0

679

1

완강 후 결과물 뒤 커버가 겹쳐서 보이는 경우

0

347

0

여러개의 강의 중 어떤걸 먼저 들어야하나요?

1

401

1

업데이트로 인해, Adroid 설정부분이 조금 다릅니다.

1

444

1

H2 대신 mysql 등 다른 DB를 사용하시는 분들 중 Error creating bean with name 'entityManagerFactory' 에러가 나는 경우

0

431

0

질문이 아니라서 여기에 올립니다.

0

381

1

현업에서 백엔드로는 보통 뭐를 사용하나요?

1

394

1