Vitestで「Slot "default" invoked outside of the render function」というエラーが発生した件について

2024-03-15

事象

画面触ってるときは出てこないのに、Vitestを走らせたときだけ以下のエラーが表示される事象に遭遇した。

Slot "default" invoked outside of the render function: this will not track dependencies used in the slot. Invoke the slot function inside the render function instead.

考えられる原因とその対処

親コンポーネントとは別のタイミング(v-if)で描画される子コンポーネント内で、
setupawaitを使うのがよくないっぽい…?
(v-showでも変わらなかった気もするが)

今回の原因

v-ifによりユーザー操作で表示される子コンポーネントのマウント時に、非同期処理が走っていたこと。

ここでいう非同期処理は、Storeからのデータ取得処理。

対処

Storeからデータ取得する処理は、初めから表示される親コンポーネントで行い、
Provide/Injectを使って子コンポーネントで値を受け取る形に実装を修正。

スポンサーリンク