Nuxt JS/Vue Jest 검사의 클래스 이름 요소가 페이지에 있는지 확인하세요.

Question

저는 Vue JS용 Jest 테스트 스위트를 처음 사용하고 이를 Nuxt JS 애플리케이션에 통합합니다. 구성 요소가 Vue 인스턴스인지 확인하기 위해 몇 가지 기본 테스트를 설정했으며 이러한 테스트가 성공적으로 통과되었습니다.

이제 내 페이지에서 요소를 찾아 해당 요소가 존재하는지, 그 안에 어떤 콘텐츠가 있는지 확인하려고 합니다.

이게 내 구조

페이지/application/begin.vue

으아악

구성요소/양식/단계/대출/LoanTerm.vue

으아악

내가 설정한 테스트는 다음을 제공합니다.

으아악

이 테스트를 실행했을 때 얻은 결과는 "선택할 용어"였습니다. "error.

오류가 발생하여 테스트가 실패했습니다.

저도 findAll를 사용해 보았는데 아무것도 반환되지 않았습니다.

내가 무엇을 놓쳤나요?

Answer 1

보이네요modal 的内容（包括您的测试正在寻找的“datasets-terms”按钮）最初并未呈现，因为 termSelectionModalIsOpen 被初始化为 false，并且没有任何设置将其设置为 true. 패턴은 다음과 유사할 수 있습니다.

으아아아

솔루션

패턴의 내용을 렌더링하려면 data() 属性挂载 LoanTerm，该属性将 termSelectionModalIsOpen 初始化为 true를 사용하세요.

으아아아

LoanTerm.vue 中缺少 jest__datasets-terms 수업을 주목했는데, 그냥 복사-붙여넣기 오류인 것 같아요.

데모