تغطية الكود بالاختبارات في JavaScript: الأدوات والمقاييس
\n\nتخيل أنك قبطان سفينة ضخمة. فريقك يفحص بانتظام المحركات والملاحة وأنظمة الأمان. ولكن في يوم من الأيام، تقرر عدم فحص نظام التبريد لأن "كان يعمل بالأمس". النتيجة متوقعة: ارتفاع الحرارة، عطل، وأنت تنجرف في البحر المفتوح. في عالم JavaScript، يُسمى هذا الإهمال "غياب تغطية الكود بالاختبارات".
\n\nأنت تكتب الاختبارات - هذا رائع. ولكن كيف تعرف أنك اختبرت كل شيء حقًا، ولم تخلق مجرد وهم بالأمان؟ الإجابة هي مقاييس تغطية الكود. فهي تُظهر أي جزء من تطبيقك تم تنفيذه أثناء الاختبارات. بدون هذه المقاييس، أنت تخاطر بفقدان خطأ حرج اختبأ في فرع شرط لم يتم اختباره.
\n\nفي هذه المقالة، سنشرح كيفية قياس تغطية الكود بالاختبارات في JavaScript بشكل صحيح، وما هي الأدوات المتاحة لذلك، وكيفية تفسير المقاييس حتى لا تؤذي نفسك. نغوص في عالم code coverage دون ملل!
\n\nما هي تغطية الكود ولماذا هي مهمة؟
\n\nتغطية الكود (code coverage) هي مقياس يُظهر عدد الأسطر أو الدوال أو الفروع من الكود الخاص بك التي تم تنفيذها عند تشغيل الاختبارات. ببساطة، هي النسبة المئوية للكود "المختبر".
\n\nيعتقد العديد من المطورين أن التغطية بنسبة 100% هي الكأس المقدسة. لكن هذا ليس صحيحًا تمامًا. التغطية هي أداة، وليست هدفًا. فهي تساعد في:
\n\n- \n
- العثور على الكود "الميت" الذي لا يتم تنفيذه أبدًا (وربما ليس ضروريًا). \n
- فهم أجزاء الكود التي بقيت بدون اختبارات، وتقييم المخاطر. \n
- زيادة الثقة في إعادة الهيكلة: إذا لم تنخفض التغطية، فأنت لم تكسر شيئًا. \n
ولكن هناك أيضًا مطبات. التغطية بنسبة 100% لا تضمن عدم وجود أخطاء. يمكنك اختبار جميع الأسطر، ولكن تفوت خطأ منطقيًا في قواعد العمل. لذلك، يجب النظر إلى تغطية اختبارات JavaScript بشكل متكامل مع جودة الاختبارات نفسها.
\n\nالمقاييس الرئيسية لتغطية الكود
\n\nقبل اختيار الأداة، دعنا نفهم المقاييس الموجودة. مقاييس تغطية الكود تنقسم إلى عدة أنواع، وكل منها يجيب على سؤال معين.
\n\nتغطية الأسطر (Line Coverage)
\nأبسط مقياس. يُظهر عدد أسطر الكود المصدري التي تم تنفيذها مرة واحدة على الأقل. إذا كان لديك 100 سطر، ونفذت الاختبارات 80 منها، فإن تغطية الأسطر تكون 80%.
\n\nتغطية الفروع (Branch Coverage)
\nمقياس أعمق. يحلل جميع المسارات الممكنة لتنفيذ الكود (فروع if/else، العوامل الثلاثية، switch). على سبيل المثال، إذا كان لديك شرط if (a > 5)، فهناك فرعان: true و false. إذا كان اختبارك يتحقق فقط من الحالة عندما a > 5، فإن تغطية الفروع ستكون 50%.
تغطية الدوال (Function Coverage)
\nيُظهر عدد الدوال (أو الطرق) التي تم استدعاؤها أثناء الاختبارات. إذا تم تعريف دالة ولكن لم يتم استدعاؤها مطلقًا، فهي غير مغطاة.
\n\nتغطية العبارات (Statement Coverage)
\nيشبه تغطية الأسطر، لكنه لا يتعامل مع الأسطر، بل مع العبارات الفردية (التعبيرات). في JavaScript، غالبًا ما تتداخل هذه المفاهيم، لكنها رسميًا أشياء مختلفة.
\n\nللمشاريع الحقيقية، تحليل تغطية JS عادةً ما يشمل جميع المقاييس الأربعة. لكن التركيز الرئيسي يجب أن يكون على تغطية الفروع، لأنها هي التي تكشف السيناريوهات المفقودة.
\n\nأدوات قياس التغطية في JavaScript
\n\nلحسن الحظ، نظام JavaScript البيئي غني بالأدوات. سنستعرض الأكثر شيوعًا: من البسيطة إلى المتقدمة.
\n\nIstanbul (nyc) — المعيار الذهبي
\nIstanbul هي الأداة الأكثر شيوعًا لقياس تغطية الكود بالاختبارات في JavaScript. تعمل مع أي مشغل اختبار تقريبًا: Jest، Mocha، Ava، Cypress. بعد التثبيت، تقوم ببساطة بتشغيل الاختبارات باستخدام الغلاف nyc.
مثال على التثبيت والتشغيل: