コンテンツにスキップ

移行ガイド

Vitest 0.34.6 からの移行

最小要件

Vitest 1.0 は Vite 5.0 および Node.js 18 以上が必要です。

すべての @vitest/* サブパッケージには、Vitest バージョン 1.0 が必要です。

スナップショットの更新 #3961

スナップショット内の引用符はエスケープされなくなり、文字列が1行の場合でも、すべてのスナップショットでバッククォート (`) が使用されます。

  1. 引用符はエスケープされなくなりました
diff
expect({ foo: 'bar' }).toMatchInlineSnapshot(`
  Object {
-    \\"foo\\": \\"bar\\",
+    "foo": "bar",
  }
`)
  1. 1行のスナップショットは、' の代わりに "`" 引用符を使用するようになりました
diff
- expect('some string').toMatchInlineSnapshot('"some string"')
+ expect('some string').toMatchInlineSnapshot(`"some string"`)

@vitest/snapshot パッケージにも 変更 がありました。直接使用していない場合は、何も変更する必要はありません。

  • equalityCheck メソッドをオーバーライドするためだけに SnapshotClient を拡張する必要はなくなりました。インスタンスを初期化するときに isEqual として渡すだけです
  • client.setTestclient.startCurrentRun に名前が変更されました
  • client.resetCurrentclient.finishCurrentRun に名前が変更されました

プールの標準化 #4172

ランナーをニーズに合わせて構成しやすくするために、多くの構成オプションを削除しました。--threads またはその他の関連フラグを使用している場合は、移行例を参照してください。

  • --threads--pool=threads になりました
  • --no-threads--pool=forks になりました
  • --single-thread--poolOptions.threads.singleThread になりました
  • --experimental-vm-threads--pool=vmThreads になりました
  • --experimental-vm-worker-memory-limit--poolOptions.vmThreads.memoryLimit になりました
  • --isolate--poolOptions.<pool-name>.isolate および browser.isolate になりました
  • test.maxThreadstest.poolOptions.<pool-name>.maxThreads になりました
  • test.minThreadstest.poolOptions.<pool-name>.minThreads になりました
  • test.useAtomicstest.poolOptions.<pool-name>.useAtomics になりました
  • test.poolMatchGlobs.child_processtest.poolMatchGlobs.forks になりました
  • test.poolMatchGlobs.experimentalVmThreadstest.poolMatchGlobs.vmThreads になりました
diff
{
  scripts: {
-    "test": "vitest --no-threads"
     // For identical behaviour:
+    "test": "vitest --pool forks --poolOptions.forks.singleFork"
     // Or multi parallel forks:
+    "test": "vitest --pool forks"

  }
}
diff
{
  scripts: {
-    "test": "vitest --experimental-vm-threads"
+    "test": "vitest --pool vmThreads"
  }
}
diff
{
  scripts: {
-    "test": "vitest --isolate false"
+    "test": "vitest --poolOptions.threads.isolate false"
  }
}
diff
{
  scripts: {
-    "test": "vitest --no-threads --isolate false"
+    "test": "vitest --pool forks --poolOptions.forks.isolate false"
  }
}

カバレッジの変更 #4265, #4442

オプション coverage.all がデフォルトで有効になりました。これは、coverage.include パターンに一致するすべてのプロジェクトファイルが、実行されなくても処理されることを意味します。

カバレッジしきい値 API の形状が変更され、グロブパターンを使用して特定のファイルのしきい値を指定できるようになりました

diff
export default defineConfig({
  test: {
    coverage: {
-      perFile: true,
-      thresholdAutoUpdate: true,
-      100: true,
-      lines: 100,
-      functions: 100,
-      branches: 100,
-      statements: 100,
+      thresholds: {
+        perFile: true,
+        autoUpdate: true,
+        100: true,
+        lines: 100,
+        functions: 100,
+        branches: 100,
+        statements: 100,
+      }
    }
  }
})

モックの型 #4400

いくつかの型が削除され、Jest スタイルの "Mock" という名前が使用されるようになりました。

diff
- import { EnhancedSpy, SpyInstance } from 'vitest'
+ import { MockInstance } from 'vitest'

警告

SpyInstanceMockInstance に置き換えられ、次のメジャーリリースで削除されます。

タイマーのモック #3925

vi.useFakeTimers() は、process.nextTick を自動的にモックしなくなりました。vi.useFakeTimers({ toFake: ['nextTick'] }) を使用して明示的に指定することで、process.nextTick をモックすることは引き続き可能です。

ただし、--pool=forks を使用している場合、process.nextTick のモックはできません。process.nextTick のモックが必要な場合は、別の --pool オプションを使用してください。

Jest からの移行

Vitest は、Jest からの移行をできるだけ簡単にするために、Jest 互換の API で設計されています。それにもかかわらず、以下の違いに遭遇する可能性があります

デフォルトとしてのグローバル変数

Jest は、グローバル API がデフォルトで有効になっています。Vitest はそうではありません。globals 構成設定を介してグローバル変数を有効にするか、vitest モジュールからのインポートを使用するようにコードを更新することができます。

グローバル変数を無効にしたままにすると、testing-library などの一般的なライブラリが自動 DOM クリーンアップを実行しないことに注意してください。

モジュールモック

Jest でモジュールをモックする場合、ファクトリ引数の戻り値はデフォルトのエクスポートです。Vitest では、ファクトリ引数は、各エクスポートが明示的に定義されたオブジェクトを返す必要があります。たとえば、次の jest.mock は次のように更新する必要があります

ts
jest.mock('./some-path', () => 'hello') 
vi.mock('./some-path', () => ({ 
  default: 'hello', 
})) 

詳細については、vi.mock api セクションを参照してください。

自動モック動作

Jest とは異なり、<root>/__mocks__ 内のモックされたモジュールは、vi.mock() が呼び出されない限りロードされません。Jest のようにすべてのテストでモックする必要がある場合は、setupFiles 内でモックできます。

モックされたパッケージのオリジナルをインポートする

パッケージを部分的にのみモックする場合、以前は Jest の関数 requireActual を使用していた可能性があります。Vitest では、これらの呼び出しを vi.importActual に置き換える必要があります。

ts
const { cloneDeep } = jest.requireActual('lodash/cloneDeep') 
const { cloneDeep } = await vi.importActual('lodash/cloneDeep') 

外部ライブラリへのモックの拡張

Jest ではデフォルトでモジュールをモックし、このモックを同じモジュールを使用する他の外部ライブラリに拡張したい場合、server.deps.inline を使用して、モックされるサードパーティライブラリを明示的に指定する必要があります。これにより、外部ライブラリがソースコードの一部になります。

server.deps.inline: ["lib-name"]

モックされた Promise の戻り値へのアクセス

Jest と Vitest の両方で、すべてのモック呼び出しの結果が mock.results 配列に保存され、各呼び出しの戻り値が value プロパティに保存されます。ただし、promise をモックまたはスパイする場合(例:mockResolvedValue を使用)、Jest では value プロパティは promise になりますが、Vitest では、promise が解決されると解決済みの値になります。

ts
await expect(spy.mock.results[0].value).resolves.toBe(123) 
expect(spy.mock.results[0].value).toBe(123) 

Envs

Jest と同様に、Vitest は、以前に設定されていない場合は NODE_ENVtest に設定します。Vitest には JEST_WORKER_ID の対応物である VITEST_POOL_ID (常に maxThreads 以下)もあります。したがって、それに依存している場合は、名前を変更することを忘れないでください。Vitest は VITEST_WORKER_ID も公開します。これは実行中のワーカーの一意の ID です。この数値は maxThreads の影響を受けず、作成されたワーカーごとに増加します。

プロパティの置換

オブジェクトを変更する場合は、Jest で replaceProperty API を使用します。Vitest でも同じことを行うには、vi.stubEnv または vi.spyOn を使用できます。

Done コールバック

Vitest v0.10.0 以降では、テストを宣言するコールバックスタイルは非推奨になりました。それらを async/await 関数を使用するように書き換えるか、Promise を使用してコールバックスタイルを模倣できます。

it('should work', (done) => {
it('should work', () => new Promise(done => {
  // ...
  done()
})
}))

フック

beforeAll/beforeEach フックは、Vitest で ティアダウン関数を返す場合があります。そのため、undefined または null 以外のものを返す場合は、フック宣言を書き換える必要がある場合があります

ts
beforeEach(() => setActivePinia(createTestingPinia())) 
beforeEach(() => { setActivePinia(createTestingPinia()) }) 

Jest では、フックは順次(1つずつ)呼び出されます。デフォルトでは、Vitest はフックを並行して実行します。Jest の動作を使用するには、sequence.hooks オプションを更新します

ts
export default defineConfig({
  test: {
    sequence: { 
      hooks: 'list', 
    } 
  }
})

Vitest には jest 名前空間に相当するものがないため、vitest から直接型をインポートする必要があります

ts
let fn: jest.Mock<string, [string]> 
import type { Mock } from 'vitest'
let fn: Mock<[string], string> 

また、Vitest では、差分でわかるように、Returns の代わりに最初の引数として Args 型があります。

タイマー

Vitest は Jest のレガシータイマーをサポートしていません。

タイムアウト

jest.setTimeout を使用した場合は、vi.setConfig に移行する必要があります

ts
jest.setTimeout(5_000) 
vi.setConfig({ testTimeout: 5_000 }) 

Vue スナップショット

これは Jest 固有の機能ではありませんが、以前に vue-cli プリセットで Jest を使用していた場合は、jest-serializer-vue パッケージをインストールし、setupFiles 内で使用する必要があります

vite.config.js

js
import {  } from 'vite'

export default ({
  : {
    : ['./tests/unit/setup.js']
  }
})

tests/unit/setup.js

js
import vueSnapshotSerializer from 'jest-serializer-vue'

expect.addSnapshotSerializer(vueSnapshotSerializer)

そうしないと、スナップショットにはエスケープされた"文字がたくさん含まれることになります。

MITライセンスの下でリリースされています。