Geçiş Rehberi

Jest'ten Geçiş

Vitest, Jest'ten geçişi kolaylaştırmak amacıyla Jest ile uyumlu bir API ile tasarlanmıştır. Bu çabalara rağmen, aşağıdaki farklılıklarla karşılaşabilirsiniz:

Varsayılan Olarak Global Değişkenler

Jest, globals API'lerini varsayılan olarak etkinleştirmiştir. Vitest bunu varsayılan olarak etkinleştirmez. The globals yapılandırma ayarı aracılığıyla global değişkenleri etkinleştirebilir veya bunun yerine vitest modülünden içe aktarmaları kullanmak için kodunuzu güncelleyebilirsiniz.

Global değişkenleri devre dışı bırakmaya karar verirseniz, testing-library gibi yaygın kütüphanelerin otomatik DOM temizleme işlemini gerçekleştirmediğini unutmayın.

Modül Sahteleri (Mocks)

Jest'te bir modülü sahtelerken, fabrika fonksiyonunun dönüş değeri varsayılan dışa aktarımdır. Vitest'te, fabrika fonksiyonu her dışa aktarımı açıkça tanımlayan bir nesne döndürmelidir. Örneğin, aşağıdaki jest.mock şu şekilde güncellenmelidir:

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

Daha fazla ayrıntı için lütfen vi.mock api bölümüne bakın.

Otomatik Sahteleme Davranışı

Jest'ten farklı olarak, <root>/__mocks__ içindeki mock'lanan modüller, vi.mock() çağrılmadığı sürece yüklenmez. Jest'te olduğu gibi, her testte sahtelenmeleri gerekiyorsa, bunları setupFiles içinde sahteleyebilirsiniz.

Taklit Edilen Bir Paketin Orijinalini İçe Aktarma

Bir paketi yalnızca kısmen sahteliyorsanız, daha önce Jest'in requireActual işlevini kullanmış olabilirsiniz. Vitest'te, bu çağrıları vi.importActual ile değiştirmelisiniz.

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

Ortam Değişkenleri

Tıpkı Jest gibi, Vitest de daha önce ayarlanmamışsa NODE_ENV'yi test olarak ayarlar. Vitest ayrıca JEST_WORKER_ID için VITEST_POOL_ID (her zaman maxThreads'den küçük veya eşit) adlı bir karşılığa sahiptir, bu nedenle buna güveniyorsanız, yeniden adlandırmayı unutmayın. Vitest ayrıca, çalışan bir worker'ın benzersiz kimliğini temsil eden VITEST_WORKER_ID değişkenini de sunar. Bu değer, maxThreads ayarından bağımsızdır ve her oluşturulan worker için artar.

Ortam değişkenlerini değiştirmek istiyorsanız, Jest'te replaceProperty API kullanırsınız, Vitest'te ise vi.stubEnv kullanabilirsiniz.

Tamamlandı Geri Çağrısı (Callback)

Vitest v0.10.0 sürümünden itibaren, test tanımlamalarında geri çağrı (callback) stilinin kullanımı önerilmemektedir. Bunları async/await işlevlerini kullanmak veya geri arama stilini taklit etmek için Promise kullanmak üzere yeniden yazabilirsiniz.

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

Kancalar

beforeAll/beforeEach kancaları Vitest'te teardown işlevi döndürebilir. Bu nedenle, undefined veya null dışında bir değer döndürüyorlarsa, hook tanımlarınızı yeniden düzenlemeniz gerekebilir:

- beforeEach(() => setActivePinia(createTestingPinia()))
+ beforeEach(() => { setActivePinia(createTestingPinia()) })

Tipler

Vitest, Vi ad alanında çok fazla tip tanımlamaz. Bu ad alanı, temel olarak eşleştiricilerle uyumluluk içindir. Bu nedenle, tipleri Vi ad alanına güvenmek yerine doğrudan vitest modülünden import etmeniz gerekebilir:

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

Ayrıca, Vitest'te örnekte görüldüğü gibi, Returns yerine ilk argüman olarak Args tipi vardır.

Zamanlayıcılar

Vitest, Jest'in eski zamanlayıcılarını desteklememektedir.

Vue Anlık Görüntüleri

Bu, Jest'e özgü bir özellik değildir; ancak daha önce vue-cli ön ayarıyla Jest kullanıyorsanız, jest-serializer-vue paketini yüklemeniz ve setupFiles içinde kullanmanız gerekecektir:

vite.config.js

import { defineConfig } from 'vite';

export default defineConfig({
  test: {
    setupFiles: ['./tests/unit/setup.js'],
  },
});

tests/unit/setup.js

import vueSnapshotSerializer from 'jest-serializer-vue';

expect.addSnapshotSerializer(vueSnapshotSerializer);

Aksi takdirde, anlık görüntülerinizde çok sayıda ters eğik çizgi ile işaretlenmiş (\) " karakterleri görünecektir.