لماذا اختبار TypeScript ليس مخيفًا بل مفيدًا
\n\nلقد كتبت دالة رائعة بلغة TypeScript، وشغّلت المشروع – كل شيء يعمل. بعد أسبوع، أضفت ميزة جديدة، فتعطل المنطق القديم. هل هذا مألوف؟ إذا كان الأمر كذلك، فأنت بحاجة ماسة إلى التعود على الاختبار. ولا تخف: الاختبارات ليست إلزامية مملة، بل هي "كاشف الأخطاء" الشخصي الخاص بك الذي يعمل على مدار الساعة.
\n\nفي هذه المقالة، سنشرح من أين يبدأ المبتدئ في اختبار TypeScript. ستتعلم كيفية إعداد البيئة، وكتابة أول اختبار وحدة، وعدم الارتباك في الأنواع. لا ماء – فقط ممارسة وأمثلة كود حقيقية.
\n\nلماذا نختبر TypeScript أصلاً إذا كان آمنًا بالفعل؟
\n\nيكتشف TypeScript بالفعل العديد من الأخطاء في مرحلة التجميع: الأنواع غير الصحيحة، الحقول المفقودة، الوسائط الخاطئة. لكن الكتابة الثابتة لا تحمي من الأخطاء المنطقية. قد تمر وظيفتك بالتجميع بشكل مثالي، ولكنها تعطي نتيجة خاطئة. على سبيل المثال:
\n\nfunction sum(a: number, b: number): number {\n return a - b; // خطأ! طرح بدلاً من الجمع\n}\n\nلن يشتكي TypeScript – الأنواع محفوظة. لكن اختبار الوحدة سيظهر فورًا أن sum(2, 2) لا يساوي 4. لذلك، اختبار TypeScript ليس ترفًا، بل ضرورة لأي مشروع جاد.
الخطوة 1: اختيار الأداة: لماذا Jest هو أفضل صديق للمبتدئين
\n\nهناك العديد من أطر الاختبار الشائعة في السوق: Mocha، Jasmine، Vitest، Jest. للمبتدئين، أوصي بشدة باستخدام Jest. لماذا؟
\n\n- \n
- يعمل "مباشرة من الصندوق" – لا حاجة لإعداد طويل. \n
- آلية mock مدمجة وتغطية الكود. \n
- دعم ممتاز لـ TypeScript عبر
ts-jest. \n - رسائل خطأ واضحة. \n
لنقم بتثبيت Jest في مشروعك. أفترض أن TypeScript مثبت لديك بالفعل. إذا لم يكن كذلك، فأنشئ مشروعًا جديدًا:
\n\nmkdir my-ts-project\ncd my-ts-project\nnpm init -y\nnpm install typescript jest @types/jest ts-jest --save-dev\n\nالآن، لننشئ ملف jest.config.js في جذر المشروع:
module.exports = {\n preset: 'ts-jest',\n testEnvironment: 'node',\n roots: ['/src'],\n testMatch: ['**/__tests__/**/*.ts', '**/?(*.)+(spec|test).ts'],\n}; \n\nونضيف سكريبت في package.json:
"scripts": {\n "test": "jest",\n "test:watch": "jest --watch"\n}\n\nتم! الآن يمكننا كتابة الاختبارات.
\n\nالخطوة 2: كتابة أول اختبار بلغة TypeScript
\n\nلننشئ دالة بسيطة في ملف src/math.ts:
export function add(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('القسمة على صفر محظورة');\n }\n return a / b;\n}\n\nالآن، لنكتب اختبارًا لها. أنشئ مجلد src/__tests__/ وملف math.test.ts:
import { add, divide } from '../math';\n\ndescribe('دوال الرياضيات', () => {\n test('تجمع رقمين بشكل صحيح', () => {\n expect(add(2, 3)).toBe(5);\n expect(add(-1, 1)).toBe(0);\n expect(add(0, 0)).toBe(0);\n });\n\n test('تقسم رقمين', () => {\n expect(divide(10, 2)).toBe(5);\n expect(divide(9, 3)).toBe(3);\n });\n\n test('ترمي خطأ عند القسمة على صفر', () => {\n expect(() => divide(5, 0)).toThrow('القسمة على صفر محظورة');\n });\n});\n\nشغّل npm test وسترى تقريرًا أخضر. تهانينا – لقد كتبت للتو أول اختبارات وحدة بلغة TypeScript!
ماذا حدث هنا؟
\n\n- \n
describe– يجمع الاختبارات في مجموعة منطقية. \n testأوit– حالة اختبار فردية. \n expect– تأكيد يتحقق من