ts-jest لـ TypeScript: دليل شامل مع أمثلة

مدرب بايثون أونلاين للمبتدئين

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

ابدأ الدورة

ما هو ts-jest ولماذا هو مطلوب؟

\n\n

ts-jest هو معالج مسبق لـ TypeScript لإطار اختبار Jest الشهير. يسمح بتشغيل الاختبارات المكتوبة بـ TypeScript دون الحاجة إلى التجميع المسبق إلى JavaScript. تقوم المكتبة تلقائيًا بتحويل كود TypeScript إلى JavaScript أثناء تنفيذ الاختبارات، باستخدام مترجم TypeScript المدمج.

\n\n

الهدف الرئيسي لـ ts-jest هو توفير تكامل سلس بين TypeScript و Jest. بدونه، سيكون عليك إعداد تجميع TypeScript يدويًا قبل كل تشغيل اختبار أو استخدام أدوات إضافية مثل ts-node. يجعل ts-jest هذه العملية شفافة وتلقائية.

\n\n

المزايا الرئيسية لاستخدام ts-jest:

\n
    \n
  • التجميع التلقائي — يتم تجميع ملفات TypeScript "أثناء التشغيل" أثناء الاختبار
  • \n
  • دعم كامل لـ TypeScript — جميع ميزات اللغة (المزخرفات، الأدوية العامة، الأنواع) تعمل بشكل صحيح
  • \n
  • خرائط المصدر — عند حدوث أخطاء، ترى كود TypeScript الأصلي بدلاً من JavaScript المُجمّع
  • \n
  • الأداء — يقوم ts-jest بتخزين نتائج التجميع مؤقتًا، مما يسرع عمليات التشغيل المتكررة
  • \n
  • المرونة — يمكنك ضبط خيارات مترجم TypeScript من خلال إعدادات Jest
  • \n
\n\n

تثبيت ts-jest

\n\n

للعمل مع ts-jest، ستحتاج إلى Node.js (الإصدار 14 أو أعلى) ومدير حزم npm أو yarn. يتم التثبيت بأمر واحد:

\n\n
npm install --save-dev jest typescript ts-jest @types/jest
\n\n

أو عبر yarn:

\n\n
yarn add --dev jest typescript ts-jest @types/jest
\n\n

شرح الحزم:

\n
    \n
  • jest — إطار الاختبار نفسه
  • \n
  • typescript — مترجم TypeScript
  • \n
  • ts-jest — المعالج المسبق للتكامل
  • \n
  • @types/jest — أنواع TypeScript لـ Jest (للإكمال التلقائي والتحقق من الأنواع)
  • \n
\n\n

بعد التثبيت، يجب إنشاء أو تحديث ملف jest.config.js (أو jest.config.ts):

\n\n
// jest.config.js\nmodule.exports = {\n  preset: 'ts-jest',\n  testEnvironment: 'node',\n  roots: ['<rootDir>/src'],\n  testMatch: ['**/__tests__/**/*.ts?(x)', '**/?(*.)+(spec|test).ts?(x)'],\n  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node']\n};
\n\n

تأكد أيضًا من ضبط الخيارات الصحيحة في tsconfig.json:

\n\n
{\n  "compilerOptions": {\n    "target": "ES2020",\n    "module": "commonjs",\n    "strict": true,\n    "esModuleInterop": true,\n    "skipLibCheck": true,\n    "forceConsistentCasingInFileNames": true,\n    "outDir": "./dist",\n    "rootDir": "./src",\n    "declaration": true,\n    "sourceMap": true\n  },\n  "include": ["src/**/*"],\n  "exclude": ["node_modules", "dist", "**/*.test.ts"]\n}
\n\n

بداية سريعة مع مثال كود

\n\n

لنقم بإنشاء دالة بسيطة واختبار لها. هيكل المشروع:

\n\n
my-project/\n├── src/\n│   ├── math.ts\n│   └── __tests__/\n│       └── math.test.ts\n├── jest.config.js\n├── tsconfig.json\n└── package.json
\n\n

الملف: src/math.ts

\n\n
export function add(a: number, b: number): number {\n  return a + b;\n}\n\nexport function subtract(a: number, b: number): number {\n  return a - b;\n}\n\nexport function multiply(a: number, b: number): number {\n  return a * b;\n}\n\nexport function divide(a: number, b: number): number {\n  if (b === 0) {\n    throw new Error('Division by zero');\n  }\n  return a / b;\n}
\n\n

الملف: src/__tests__/math.test.ts

\n\n
import { add, subtract, multiply, divide } from '../math';\n\ndescribe('Math functions', () => {\n  test('adds 1 + 2 to equal 3', () => {\n    expect(add(1, 2)).toBe(3)                    

توصيات