Özellikler

Vite'in yapılandırması, dönüştürücüleri, çözümleyicileri ve eklentileri.
Testleri çalıştırmak için uygulamanızdaki aynı yapılandırmayı kullanın!
Testler için HMR benzeri akıllı ve anlık izleme modu!
Vue, React, Svelte, Lit ve daha fazlası için bileşen testi
Yerleşik TypeScript / JSX desteği
ESM öncelikli, en üst düzeyde await
Tinypool aracılığıyla çalışanlar için çoklu iş parçacığı desteği
Tinybench ile kıyaslama desteği
Süitler ve testler için filtreleme, zaman aşımları, eşzamanlılık
Çalışma Alanı (Workspace) desteği
Jest uyumlu anlık görüntü
Doğrulamalar için yerleşik Chai + Jest expect uyumlu API'ler
Sahteleme için yerleşik Tinyspy
DOM taklidi için happy-dom veya jsdom
v8 veya istanbul aracılığıyla kod kapsamı
Rust tarzı kaynak kodu içinde test
expect-type aracılığıyla Tür testi

Video ile ilk testinizi nasıl yazacağınızı öğrenin

Test, Geliştirme ve Derleme Arasında Paylaşılan Yapılandırma

Vite'nin yapılandırması, dönüştürücüleri, çözümleyicileri ve eklentileri. Testleri çalıştırmak için uygulamanızdaki aynı kurulumu kullanın.

Vitest'i Yapılandırma sayfasında daha fazla bilgi edinin.

İzleme Modu (Watch Mode)

bash

$ vitest

Kaynak kodunuzu veya test dosyalarınızı değiştirdiğinizde, Vitest akıllıca modül grafiğini tarar ve yalnızca ilgili testleri yeniden çalıştırır, tıpkı Vite'deki HMR gibi!](https://twitter.com/antfu7/status/1468233216939245579)

vitest, geliştirme ortamında varsayılan olarak izleme modunda ve CI ortamında (process.env.CI değişkeni tanımlı olduğunda) otomatik olarak çalıştırma modunda başlar. İstediğiniz modu açıkça belirtmek için vitest watch veya vitest run komutlarını kullanabilirsiniz.

Hazır Gelen Yaygın Web Özellikleri

ES Modülü, TypeScript, JSX ve PostCSS desteği yerleşik olarak gelir.

İş Parçacıkları (Threads)

Varsayılan olarak Vitest, test dosyalarını node:worker_threads kullanarak Tinypool ( Piscina'nın hafif bir çatalı) aracılığıyla birden çok iş parçacığında çalıştırarak testlerin aynı anda çalışmasını sağlar. Test kodunuz çoklu iş parçacığı ile uyumlu değilse, --pool=forks seçeneğine geçebilirsiniz; bu seçenek, Tinypool aracılığıyla node:child_process kullanarak testleri birden çok işlemde çalıştırır.

Testleri tek bir iş parçacığında veya işlemde çalıştırmak için poolOptions bölümüne bakın.

Vitest ayrıca her dosyanın ortamını yalıtır, böylece bir dosyadaki ortam değişiklikleri diğerlerini etkilemez. Yalıtım, --no-isolate komut satırı argümanı ile devre dışı bırakılabilir (doğruluk ile çalışma performansı arasında bir denge kurarak).

Test Filtreleme

Vitest, geliştirmeye odaklanabilmeniz için test seçimini daraltmanın birçok yolunu sunarak testleri hızlandırmayı amaçlar.

Test Filtreleme hakkında daha fazla bilgi edinin.

Testleri Paralel Çalıştırma

Paralel olarak çalıştırılacak testlerde .concurrent kullanın.

import { describe, it } from 'vitest';

// Eş zamanlı olarak işaretlenen iki test paralel olarak çalıştırılacak
describe('suite', () => {
  it('serial test', async () => {
    /* ... */
  });
  it.concurrent('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
});

Bir süitte .concurrent kullanırsanız, içindeki tüm testler paralel olarak çalıştırılır.

import { describe, it } from 'vitest';

// Bu süit içindeki tüm testler paralel olarak çalıştırılacak
describe.concurrent('suite', () => {
  it('concurrent test 1', async ({ expect }) => {
    /* ... */
  });
  it('concurrent test 2', async ({ expect }) => {
    /* ... */
  });
  it.concurrent('concurrent test 3', async ({ expect }) => {
    /* ... */
  });
});

Ayrıca eş zamanlı süitler ve testlerle .skip, .only ve .todo kullanabilirsiniz. API Referansı bölümünde daha fazla bilgi edinin.

WARNING

Eş zamanlı testler çalıştırılırken, anlık görüntüler ve doğrulamaların doğru testi algılamasını sağlamak için yerel Test Bağlamı'ndan expect kullanılmalıdır.

Anlık Görüntü (Snapshot)

Jest uyumlu anlık görüntü desteği.

import { expect, it } from 'vitest';

it('renders correctly', () => {
  const result = render();
  expect(result).toMatchSnapshot();
});

Anlık Görüntü bölümünden daha fazla bilgi edinin.

Chai ve Jest `expect` Uyumluluğu

Chai, doğrulamalar için yerleşiktir ve Jest expect uyumlu API'ler sunar.

Eğer eşleştirici ekleyen üçüncü taraf kütüphaneler kullanıyorsanız, test.globals'ı true olarak ayarlamanın daha iyi uyumluluk sağlayacağını unutmayın.

Mocklama (Mocking)

Tinyspy, vi nesnesinde jest uyumlu API'lerle mocklama için yerleşiktir.

import { expect, vi } from 'vitest';

const fn = vi.fn();

fn('hello', 1);

expect(vi.isMockFunction(fn)).toBe(true);
expect(fn.mock.calls[0]).toEqual(['hello', 1]);

fn.mockImplementation(arg => arg);

fn('world', 2);

expect(fn.mock.results[1].value).toBe('world');

Vitest, DOM ve tarayıcı API'lerini mocklama için hem happy-dom'u hem de jsdom'u destekler. Bunlar Vitest ile birlikte gelmez, bu nedenle yüklemeniz gerekebilir:

bash

$ npm i -D happy-dom
# veya
$ npm i -D jsdom

Bundan sonra, yapılandırma dosyanızdaki environment seçeneğini değiştirin:

// vitest.config.ts
import { defineConfig } from 'vitest/config';

export default defineConfig({
  test: {
    environment: 'happy-dom', // veya 'jsdom', 'node'
  },
});

Mocking bölümünden daha fazla bilgi edinin.

Kapsam Analizi (Coverage Analysis)

Vitest, v8 aracılığıyla yerel kod kapsamını ve istanbul aracılığıyla araçlı kod kapsamını destekler.

json

{
  "scripts": {
    "test": "vitest",
    "coverage": "vitest run --coverage"
  }
}

Kapsam bölümünden daha fazla bilgi edinin.

Kaynak Kodu İçinde Test (In-Source Testing)

Vitest ayrıca, Rust'ın modül testlerine benzer şekilde, testleri uygulama ile birlikte kaynak kodunuz içinde çalıştırmanın bir yolunu da sunar.

Bu, testlerin uygulamalarla aynı closure'ı paylaşmasını ve dışarı aktarmaya gerek kalmadan özel durumları test edebilmesini sağlar. Bu aynı zamanda geliştirme için geri bildirim döngüsünü de kısaltır.

// src/index.ts

// uygulama
export function add(...args: number[]) {
  return args.reduce((a, b) => a + b, 0);
}

// kaynak içi test süitleri
if (import.meta.vitest) {
  const { it, expect } = import.meta.vitest;
  it('add', () => {
    expect(add()).toBe(0);
    expect(add(1)).toBe(1);
    expect(add(1, 2, 3)).toBe(6);
  });
}

Kaynak İçi Test bölümünden daha fazla bilgi edinin.

Performans Testleri deneysel

Vitest 0.23.0'dan itibaren, performans sonuçlarını karşılaştırmak için Tinybench aracılığıyla bench fonksiyonunu kullanarak kıyaslama testleri çalıştırabilirsiniz.

import { bench, describe } from 'vitest';

describe('sort', () => {
  bench('normal', () => {
    const x = [1, 5, 4, 2, 3];
    x.sort((a, b) => {
      return a - b;
    });
  });

  bench('reverse', () => {
    const x = [1, 5, 4, 2, 3];
    x.reverse().sort((a, b) => {
      return a - b;
    });
  });
});

Tip Testleri deneysel

Vitest 0.25.0'dan itibaren, tür regresyonlarını yakalamak için testler yazabilirsiniz. Vitest, size benzer ve kolay anlaşılır bir API sağlamak için expect-type paketiyle birlikte gelir.

import { assertType, expectTypeOf } from 'vitest';
import { mount } from './mount.js';

test('my types work properly', () => {
  expectTypeOf(mount).toBeFunction();
  expectTypeOf(mount).parameter(0).toMatchTypeOf<{ name: string }>();

  // @ts-expect-error name is a string
  assertType(mount({ name: 42 }));
});

Özellikler ​

Test, Geliştirme ve Derleme Arasında Paylaşılan Yapılandırma ​

İzleme Modu (Watch Mode) ​

Hazır Gelen Yaygın Web Özellikleri ​

İş Parçacıkları (Threads) ​

Test Filtreleme ​

Testleri Paralel Çalıştırma ​

Anlık Görüntü (Snapshot) ​

Chai ve Jest expect Uyumluluğu ​

Mocklama (Mocking) ​

Kapsam Analizi (Coverage Analysis) ​

Kaynak Kodu İçinde Test (In-Source Testing) ​

Performans Testleri deneysel ​

Tip Testleri deneysel ​