TypeScript を用いる時に Cypress と Jest を共存させると "expect" などがコンフリクトして VS Code に怒られるとき

前提

  • TypeScript を用いている
  • Jest を使っている
  • Cypress を使っている
  • テストも TypeScript (ts-jest) を使っている
  • モノレポである*1
  • 「型 Assertion に存在しません」ととにかく怒られるとき
  • 実行自体は可能だが VS Code で怒られる

状況

expect を用いると プロパティ 'toBe' は型'Assertion' に存在しません。ts(2339) と怒られます。

結論(こっちがいいと思う)

import { expect } from '@jest/globals'; する。テストファイルしか汚さないので、これがいいと思います。

テストファイルごとに毎回 import するのは面倒くさいので共通化できるならやっていいと思います。

結論(おすすめしない)

tsconfig.jsonexclude プロパティを書く。tsconfig.json を更新した後は VS Code をリロードする必要があります。

__tests__/ 配下にテストを記述したファイルがあるときです*2

{
  "compilerOptions": {
    (省略)
  },
  "exclude": ["__tests__/*.spec.ts"]
}

補足

上記を設定した場合でも型についてちゃんと怒ってくれます。しかし、コンポーネントの型定義を見に行ってくれなくなるので、あまりよろしくない

参考

*1:Jest と Cypress が共存していることを「モノレポ」というのは微妙ですが、イメージとして

*2:階層を掘る場合にはこれでは不十分です

Powered by はてなブログ