TypeError: null의 'type' 속성을 읽을 수 없습니다 - 비동기 함수를 사용하여 vue 구성 요소 테스트

Question

<p>구성요소 ComponentA.spec.js를 테스트하는 중인데 <code>TypeError: Cannot read property 'type' of null</code>이 발생합니다. ComponentA의 getData() 함수에서 wait 키워드를 제거하면 작동합니다. 테스트에서 getData API 호출을 조롱했지만 여전히 작동하지 않습니다. </p> <p>전체 스택입니다. TypeError: C: [개인정보 보호] 알 수 없음: null </p>의 'type' 속성을 읽을 수 없습니다. <pre class="brush:js;toolbar:false;">at 주장(node_modules/@babel/types/lib/asserts/generated/index.js:284:112) Object.assertIdentifier(node_modules/@babel/types/lib/asserts/generated/index.js:373:3)에서 새로운 CatchEntry에서 (node_modules/regenerator-transform/lib/leap.js:93:5) Emitter.Ep.explodeStatement(node_modules/regenerator-transform/lib/emit.js:535:36)에서 node_modules/regenerator-transform/lib/emit.js:323:12에서 Array.forEach에서(<익명>) Emitter.Ep.explodeStatement(node_modules/regenerator-transform/lib/emit.js:322:22)에서 Emitter.Ep.explode에서 (node_modules/regenerator-transform/lib/emit.js:280:40) </pre> <p>이것은 제가 테스트를 만들려고 하는 구성요소입니다. A</p> <pre class="brush:js;toolbar:false;"><템플릿> <div class="d-flex flex-row"> <컴포넌트-b /> <컴포넌트-c /> </div> </템플릿> <스크립트> './ComponentB'에서 ComponentB를 가져옵니다. './ComponentC'에서 ComponentC를 가져옵니다. 'apis'에서 { getData }를 가져옵니다. 기본값 내보내기 { 이름: '컴포넌트-a', 구성요소: { 구성요소B, 구성요소C, }, 비동기 생성() { this.getData()를 기다립니다. }, 방법: { // 이 함수가 범인이다 비동기 getData() { 노력하다 { const 응답 = getData()를 기다립니다; } 잡다 { // } }, }, }; </스크립트> </pre> <p>이것은 내 ComponentA.spec.js 파일입니다</p> <pre class="brush:js;toolbar:false;">'vuetify'에서 Vuetify를 가져옵니다. '구성요소/ComponentA'에서 ComponentA를 가져옵니다. import { createLocalVue,shallowMount, mount } from '@vue/test-utils'; jest.mock('shared/apis', () => { const data = require('../fixedData/data.json'); 반품 { getData: jest.fn().mockResolvedValue(데이터), }; }); const localVue = createLocalVue(); 부끄럽게 하라; 함수 createShallowWrapper(옵션 = {}) { 얕은 마운트(컴포넌트A, { 로컬뷰, 부조화하다, ...옵션, }); } beforeEach(() => { vuetify = 새로운 Vuetify(); }); explain('ComponentA', () => { explain('컴포넌트 생성', () => { test('테스트', () => { const 래퍼 = createShallowWrapper(); 기대(래퍼).toMatchSnapshot(); }); }); });

Answer 1

ComponentA의 getData 함수 캡처에 예외 변수(e)를 추가하면 문제가 해결되었습니다.