遂にバージョン1を迎えたVitestのバージョンを上げる

はじめに

Vitestが2023年12月4日にバージョン1.0.0を迎えました。
VitestはJavaScript・TypeScriptのテストフレームです。Viteと同じ設定で動き、watchモードのHMRの様な効率的なテスト実行、Jestの記法と似たような書き心地でテストを記述できる点が特徴的です。
この記事ではVitestが1.0.0にバージョンアップして変更された記法などを紹介します。
Vitest自体について知りたい場合は公式ドキュメントや去年記述した記事があるのでよければ見てください。

Vitest1.0.0

必要な環境設定

バージョン1からはNodeのバージョンが18以降、Viteのバージョンが5以降が必要になってきます。Viteのバージョン5に上がったのも1ヶ月以内のことなので上げていなければこの機会にあげましょう。
そして、@vitest/uiや@vitest/coverage-v8のようなサブパッケージのバージョンも同じバージョンで揃えて利用する必要があります。

スナップショットの変更

スナップショットの結果が変更されました。

expect('hello vitest').toMatchInlineSnapshot()

上記のテストによって以下のようなスナップショットが生成されるようになりました。

// 1.0.0
expect('hello vitest').toMatchInlineSnapshot('"hello vitest"')

// 0.34.6
expect('hello vitest').toMatchInlineSnapshot(`"hello vitest"`)

私の手元では確認できませんでしたが、以下の結果も変更されたとされています。

// 1.0.0
expect({ foo: 'bar' }).toMatchInlineSnapshot(`
  Object {
    "foo": "bar",
  }
`)
// 0.34.6
expect({ foo: 'bar' }).toMatchInlineSnapshot(`
  Object {
    \\"foo\\": \\"bar\\",
  }
`);

記法的にpretty-formatを有効にすることで再現すると思いましたが、両バージョンとも以下のような出力で違いが見られませんでした。

/**
 * snapshotFormat: {
 *   printBasicPrototype: true,
 * } ,
 */
expect({ foo: 'bar' }).toMatchInlineSnapshot(`
  Object {
    "foo": "bar",
  }
`);

/**
 * default
 */
expect({ foo: 'bar' }).toMatchInlineSnapshot(`
  {
    "foo": "bar",
  }
`);

この他にVitestのsnapshotに関連するパッケージ@vitest/snapshotにていくつか変更があったようです(通常は直接触らないので影響はないはずです)。

設定の変更

--threadsが--pool=threadsになりました

tinypoolでマルチスレッドを有効にするものです。

--no-threadsが--pool=forksになりました

child_processでマルチスレッドを有効にするものです。

--single-threadが--poolOptions.threads.singleThreadになりました

単一のスレッドで実行するものです。

--experimental-vm-threadsが--pool=vmThreadsになりました

VM contextでマルチスレッドを有効にするものです。

--experimental-vm-worker-memory-limitが--poolOptions.vmThreads.memoryLimitになりました

--pool=vmThreadsとした時のオプションです。メモリの制限を設定します。

--isolateが--poolOptions.<pool-name>.isolate and browser.isolateになりました

テストファイルごとに環境を分割するものです。

test.maxThreadsがtest.poolOptions.<pool-name>.maxThreadsになりました

最大のスレッド数を設定します。<poo-name>には--poolで指定したものを渡します。

test.minThreadsがtest.poolOptions.<pool-name>.minThreadsになりました

最小のスレッド数を設定します。<poo-name>には--poolで指定したものを渡します。

test.useAtomicsがtest.poolOptions.<pool-name>.useAtomicsになりました

データの整合性を保つためにAtomicsを使用してスレッドを開始します。<poo-name>には--poolで指定したものを渡します。

test.poolMatchGlobs.child_processがtest.poolMatchGlobs.forksになりました

指定したglobに基づいて行われるテストでchild_processのマルチスレッドを有効にします。

test.poolMatchGlobs.experimentalVmThreadsがtest.poolMatchGlobs.vmThreadsになりました

指定したglobに基づいて行われるテストでVM contextのマルチスレッドを有効にします。

coverageの変更

テストしていないファイルを含めてcoverageレポートに含めるのがデフォルトになりました。元のデフォルトの挙動にするにはcoverage.allをfalsで設定してください。
また、閾値に関する設定はまとめて記述するようになりました。

// 1.0.0
coverage: {
  threshold: {
    perFile: true,
    thresholdAutoUpdate: true,
    100: true,
    lines: 100,
    functions: 100,
    branches: 100,
    statements: 100,
  }
}

// 0.34.6
coverage: {
  perFile: true,
  thresholdAutoUpdate: true,
  100: true,
  lines: 100,
  functions: 100,
  branches: 100,
  statements: 100,
}

型の変更

Jestとの互換性のためEnhancedSpy型が削除され、SpyInstanceが非推奨になりました。今後はMockInstanceを使用するようにしてください。
SpyInstanceはバージョン2.0.0になるタイミングで削除されるので今のうちにあらためておきましょう。

vi.useFakeTimerの挙動

vi.useFakeTimersがprocess.nextTickのモックを自動でしなくなりました。
今後はvi.useFakeTimers({toFake: ['nextTick'] })を用いることでモックを行うように設定できますが、--pool=forksを利用している場合は行えないことに注意してください。