TypeError: null のプロパティ 'type' を読み取れません - 非同期関数を使用した vue コンポーネントのテスト

Question

コンポーネント ComponentA.spec.js をテストしていますが、TypeError: Cannot read property 'type' of null が発生します。 ComponentA の getData() 関数の wait キーワードを削除すると、機能します。テストで getData API 呼び出しをモックしましたが、それでも動作しません。

これは完全なスタックです TypeError: C: [プライバシー]\Unknown: null

のプロパティ 'type' を読み取れません。

atassert (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)

これはテストを作成しようとしているコンポーネントです、A

<テンプレート>
  <div class="d-flex flex-row">
    <コンポーネント-b />
    <コンポーネント-c />
  </div>
</テンプレート>

<スクリプト>
'./ComponentB' から ComponentB をインポートします。
'./ComponentC' から ComponentC をインポートします。
import { getData } から 'apis';
デフォルトのエクスポート {
  名前: 'コンポーネント-a'、
  コンポーネント: {
    コンポーネントB、
    コンポーネントC、
  }、
  非同期作成() {
    this.getData() を待ちます。
  }、
  メソッド: {
    // この関数が原因です
    非同期 getData() {
      試す {
        const 応答 = getData() を待ちます。
      } キャッチ {
        //
      }
    }、
  }、
};
</スクリプト>

これは私の ComponentA.spec.js ファイルです

「vuetify」から Vuetify をインポートします;
'components/ComponentA' から ComponentA をインポートします。
import { createLocalVue,shallowMount,mount } from '@vue/test-utils';

jest.mock('shared/apis', () => {
  const data = require('../fixedData/data.json');

  戻る {
    getData: jest.fn().mockResolvedValue(data)、
  };
});

const localVue = createLocalVue();
華やかにしましょう。

function createShallowWrapper(options = {}) {
  returnshallowMount(ComponentA, {
    ローカルビュー、
    華やぐ、
    ...オプション、
  });
}

beforeEach(() => {
  vuetify = 新しい Vuetify();
});

description('コンポーネントA', () => {
  description('コンポーネントの作成', () => {
    test('テスト中', () => {
      const ラッパー = createShallowWrapper();
      Expect(wrapper).toMatchSnapshot();
    });
  });
});

Answer 1

ComponentA の getData 関数のキャプチャに例外変数 (e) を追加すると、問題が修正されました。