以下の内容はhttps://fuqda.hatenablog.com/entry/2024/09/03/211338より取得しました。


Vueのテストでmountした後は、テスト終了後にwrapperオブジェクトをunmountしないとテストが重くなるかも?

結論

mountやshoallowMountで生成されたDOMをテスト終了後に wrapper.unmount() (Vue2だと wrapper.destroy())で破棄しないと、リアクティブな値の変更などにすべてのwrapperが反応してしまい、 結果としてwrapperを生成した分だけ反応してしまう模様。 (その結果メモリリークしたり、重くなることも...)

import { wrapperFactory } from "../utils/wrapper-factory";
import Title, { TitleComponentProps } from "./Title.vue";

describe("Title", () => {
  let wrapper: ReturnType<typeof shallowMount<typeof Title>>;

  beforeEach(() => {
    const props: TitleComponentProps = { value: "My title" };
    wrapper = wrapperFactory(Title, { props });
  });

  afterAll(() => {
    // テスト終了後にDOMを破棄する
    wrapper.unmount();
  });

  it('XXXX', () => {
    // 中略
  });
});



以上の内容はhttps://fuqda.hatenablog.com/entry/2024/09/03/211338より取得しました。
このページはhttp://font.textar.tv/のウェブフォントを使用してます

不具合報告/要望等はこちらへお願いします。
モバイルやる夫Viewer Ver0.14