vitest لـ TypeScript: الدليل الشامل

vitest هو إطار عمل حديث وسريع وقوي لاختبار الوحدة (Unit Testing)، صُمم خصيصًا لبيئة TypeScript وJavaScript. تم تطويره كبديل مباشر لـ Jest، مع التركيز على سرعة التنفيذ والدعم الأصلي لـ Vite. إذا كنت تستخدم Vite لبناء مشروعك، فإن vitest سيكون الخيار الأمثل، لأنه يستخدم نفس الإضافات والإعدادات التي تستخدمها أداة البناء الرئيسية لديك.

لماذا تحتاج vitest؟ أولاً، إنه سريع بشكل لا يُصدق بفضل استخدام esbuild في الترجمة والدعم الأصلي لوحدات ESM. ثانيًا، يوفر واجهة برمجة تطبيقات (API) غنية ومتوافقة مع Jest، مما يسهل عملية الترحيل. ثالثًا، vitest يدعم TypeScript وJSX وMocking وتغطية الكود (Coverage) واختبار اللقطات (Snapshot Testing) بشكل مدمج دون الحاجة لتثبيت حزم إضافية. هذا يجعله الأداة المثالية للمشاريع الصغيرة والكبيرة على حد سواء.

في موقع PythonLib التعليمي، سنشرح لك كيفية استخدام vitest لاختبار كود TypeScript. ستتعلم كيفية تثبيت المكتبة، كتابة أول اختبار لك، إتقان الدوال الأساسية، وتجنب الأخطاء الشائعة. بنهاية المقال، ستكون قادرًا على استخدام vitest بثقة في مشاريعك.

التثبيت

يتم تثبيت vitest عبر npm أو yarn. لمشروع TypeScript، ستحتاج أيضًا إلى تثبيت TypeScript نفسه وأنواع Node.js (إذا كنت تختبر كود الخادم).

npm install -D vitest typescript @types/node

إذا كنت تستخدم yarn:

yarn add -D vitest typescript @types/node

بعد التثبيت، أضف السكريبت التالي إلى ملف package.json:

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

الأمر vitest يشغل الاختبارات في وضع المراقبة (Watch Mode) حيث يعيد التشغيل تلقائيًا عند إجراء أي تغيير، بينما الأمر vitest run يقوم بتشغيل الاختبارات لمرة واحدة فقط.

البداية السريعة

قم بإنشاء ملف sum.ts يحتوي على دالة بسيطة:

// sum.ts
export function sum(a: number, b: number): number {
  return a + b;
}

الآن، أنشئ ملف الاختبار sum.test.ts:

// sum.test.ts
import { describe, it, expect } from 'vitest';
import { sum } from './sum';

describe('دالة الجمع', () => {
  it('يجب أن تجمع رقمين بشكل صحيح', () => {
    expect(sum(2, 3)).toBe(5);
  });

  it('يجب أن تتعامل مع الأرقام السالبة', () => {
    expect(sum(-1, -2)).toBe(-3);
  });
});

قم بتشغيل الاختبارات:

npm run test

سترى مخرجات خضراء تشير إلى نجاح الاختبارات. تهانينا! لقد كتبت أول اختبار لك باستخدام vitest.

الدوال والأساليب الأساسية

يوفر vitest واجهة برمجة تطبيقات (API) غنية لكتابة الاختبارات. فيما يلي 8 دوال رئيسية مع شرح وأمثلة.

1. describe

التوقيع: describe(name: string, fn: () => void): void

الوصف: تُستخدم لتجميع الاختبارات ذات الصلة في كتلة واحدة. تحسن قابلية القراءة وتسمح بتطبيق الخطافات (مثل beforeEach, afterEach) على المجموعة.

import { describe, it, expect } from 'vitest';

describe('العمليات الحسابية', () => {
  it('يجب أن يجمع', () => {
    expect(1 + 1).toBe(2);
  });

  it('يجب أن يطرح', () => {
    expect(5 - 3).toBe(2);
  });
});

2. it / test

التوقيع: it(name: string, fn: () => void | Promise<void>, timeout?: number): void

الوصف: تُستخدم لتعريف اختبار فردي. يمكنك استخدام it أو test، فهما مترادفان.

import { it, expect } from 'vitest';

it('يجب أن يعيد صحيحًا إذا كان الرقم موجبًا', () => {
  expect(isPositive(5)).toBe(true);
});