Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. React
Code

8 الأشياء التي تجعل Jest أفضل اختبار رد فعل الإطار

by
Difficulty:IntermediateLength:MediumLanguages:

Arabic (العربية/عربي) translation by محمود (you can also view the original English article)

نظرة عامة

Jest هي مكتبة اختبار جافا سكريبت من الفيس بوك. شعارها هو "اختبار جافا سكريبت لذيذ". Jest للتغيير أي مكتبة جافا سكريبت ، أصل يضيء عند نشر الأمر React و React Native.

هذا ليس مفاجئًا لأن كل من React و Jest يأتيان من فيس بوك ، مستخدمًا رئيسيًا لكليهما. في هذا البرنامج التعليمي ، سأعرض لك 8 جوانب مختلفة من Jest تجعل من هذا فرحة

1. Jest هو نسيم الاقامة

Jest بسيط جدا لتركيب من تلقاء نفسها. هل فقط تثبيته في فارغة مباشرة باستخدام إما npm أو غزل. أنا أفضل الغزل. شاهد 6 أشياء تجعل غزل أفضل مدير حزمة جافا سكريبت لفهم السبب. انها بسيطة مثل:

yarn add --dev jest

إذا كنت تفضل npm ، فاكتب:

npm install --save-dev jest

قبل أن نتمكن من الاختبار ، دعنا نكتب بعض المعلومات البرمجية للاختبار. هنا هو palindrome.js:

في ما باسم ذلك في ملف باسم palindrome.test.js:

للتدقيق ، أضف هذا إلى package.json:

يمكن الآن إجراء اختبارات باستخدام اختبار الغزل أو اختبار npm :

هذا بسيط جدا. ولكن إذا استخدمت رد فعل - إنشاء - تطبيق لإنشاء مشروع React ، فلن تحتاج حتى إلى القيام بذلك. تأتي حزمة الجوائز مجمعة في ، ويمكنك فقط البدء في كتابة الاختبارات على الفور.

2. Jest هو البرق سريع

Jest سريع. سريع جدا. عندما تكون اختباراتك مرتبطة بوحدة المعالجة المركزية (CPU) ، يمكنها أن تحلق وقتًا كبيرًا من تشغيل الاختبار. تحولت Airbnb من Mocha إلى Jest ، وانخفضت الكثير من الوقت إلى أكثر من 12 دقيقة إلى 4.5 دقيقة فقط على جهاز CI للخدمة الشاقة مع 32 مركزًا. كانت الاختبارات المحلية المصادر 45 دقيقة ، والتي يعود إلى 14.5 دقيقة.

ما الذي يجعل Jest سريع جدا؟ إنها مزيج من عدة عوامل:

  • التوازي: هذا واضح تمامًا ، وأطر الاقتصادية الأخرى تستخدمهم
  • تشغيل الاختبارات الأبطأ أولاً:
  • التخزين المؤقت بابل التحولات: وزن من عمليات تحويل بابل

3. Jest هو متجر وقفة واحدة

تأتي Jest بمطابقات مدمجة وجواسيس ومكتبة خرافية ضخمة خاصة بها. كانت تابعة على الياسمين ، لذلك ورثت كل خير ياسمين. لكن في الحديث الأحدث ، غادر Jest من Jasmine ، ومع ذلك حافظ على نفس الوظيفة.

عند مقارنته بحل اختبار مفصل مبني على Mocha ، فمن الواضح أن سهولة الاستخدام تشكل مصدر قلق كبير لتصميم Jest.

4. Jest ديه موكب رائع

الهزء هو جزء مهم بشكل كامل هذا مهم بشكل خاص إذا كنت تهتم باختبارات سريعة (ومن لا يفعل ذلك؟).

يسمح لك الهزء باستبدال التبعيات غير ذات التي قد تكون بطيئة ووقت السيطرة على الكود الذي يعتمد على التوقيت. يتيح لك Jest التحكم الكامل في الاعتماديات والوقت الرئيسي.

وظائف وهمية بسيطة

تهمس التبعية هو تقليد طويل من اختبارات الوحدة. إذا كانت شفرتك تقرأ ملفًا أو تكتب إلى ملف أو الاتصال ببعض الخدمات عن بُعد أو تصل إلى قاعدة بيانات ، فقد تكون بطيئة وقد يكون من الصعب تكوين وتنظيف بعد الاختبار. عند التشغيل بالتوازي ، قد لا يكون من الممكن التحكم بشكل صحيح.

في هذه الحالات ، من الأفضل استبدال التبعية الحقيقية بوظيفة وهمية لا تفعل شيئًا سوى تسجيل الحقيقة التي كانت تسمى ، حتى يمكنك التحقق من سير العمل. و jest.fn () تسمح الوظيفة الوهمية التي تقدمها القيم عودة القيم (للمكالمات متعددة متتالية)، ويسجل كم مرة كان يطلق عليه وما كانت المعلمات في كل مكالمة.

وحدة يدوية

قد تحتاج في بعض الأحيان إلى استبدال وحدة كاملة بوظائفها كحد من وظيفتين. يتيح لك Jest القيام بذلك عن طريق وضع الوحدة الخاصة بك بنفس الاسم في دليل فرعي __mocks__ .

عندما تكون شفرتك تستخدم الوحدة النمطية الهدف ، فإنها ستدخل إلى النموذج الخاص بك بدلاً من الوحدة الحقيقية. يمكنك حتى اختيار بعض الاختبارات لاستخدام الوحدة النمطية الأصلية عن طريق استدعاء jest.Unmock ('moduleName') .

المؤقت

التوقيت هو جزء من اختبارات الوحدة. ماذا لو كنت تريد اختبار هذا الرمز بعد مرور الوقت؟ رمز الذي يطلق كل 30 ثانية؟ رمز خاص يقوم بتشغيل خوارزمية التوفيق في نهاية الشهر؟

من تحليل اختبارها. يمكن إما الخضوع لمتطلبات التوقيت الخاص بالرصاص الأصلي (ومن ثم ستكون اختباراتك بطيئة جدًا) ، أو يمكنك التلاعب بالوقت ، وهي أكثر فائدة. يتيح لك Jest التحكم في الوظائف المتعلقة بالمؤقت التالي:

  • setTimeout ()
  • setInterval ()
  • clearTimeout ()
  • clearInterval ()

ES6 الفئة Mocks

Jest بشكل كامل فصول ES6

  • محاكاة تلقائية: تتيح لك التجسس على المكالمات إلى المنشئ وكافة الطُرق ، ولكنها دائمًا تقوم بإرجاع غير محدد.
  • همية يدوية: قم بتنفيذ محاكاة خاصة بك في الدليل الفرعي __mocks__ .
  • استهزأ بمصنّع الصف مع وظيفة من الدرجة الأعلى.
  • سخرية انتقائية باستخدام mockImplementation () أوmockImplementationOnce () .

5. يدعم Jest TypeScript

TypeScript هو مجموعة كبيرة معروفة من جافا سكريبت والتي تتحول إلى جافا سكريبت عادي. يدعم Jest TypeScript عبر حزمة ts-jest . يصف نفسه أنه المعالج لـ TypeScript مع دعم خريطة المصدر لـ Jest ولديه مجتمع نشط للغاية.

6. حصلت Jest لك غطت

القدح التقارير التأديفة. اختباراتك جيدة فقط بقدر تغطيتها. إذا قمت باختبار 80 ٪ فقط من شفرتك ، معقد اكتشاف الأخطاء في الـ 20 ٪ فقط في الإنتاج.

في بعض الأحيان ، تكون من المنطقي. على سبيل المثال ، قد لا تريد الأدوات الداخلية التي تريد المهندسون الخبراء عند النظر إلى نفس المستوى من اختبار الصارمة مثل شفرة الإنتاج الخاصة بك. ولكن ، على أي حال ، يجب أن يكون لديك قرارًا واعًا ، وتعد أن تكون قادرًا على رؤية تغطية التحديث تمامًا لأجزاء مختلفة من نظامك.

فيما يلي كيفية إنشاء تقرير تغطية لمثال الباينرومير البسيط:

7. Jest لا لقطات

اختبار اللقطات رائع. فإنه يتيح لك التقاط سلسلة تمثل المكون الخاص بك وتخزينها في ملف. ثم يمكنك مقارنتها لاحقًا لضمان عدم تغيير واجهة المستخدم. في حين أنه مثالي لتطبيقات React و React Native ، يمكنك استخدام لقطات لمقارنة القيم المتسلسلة لأطر العمل الأخرى. إذا قمت بتغيير واجهة المستخدم الخاصة بك فعليًا فأنت بحاجة إلى تحديث ملفات اللقطات الخاصة بك لتعكسها بالطبع.

8. Jest لا اختبار دلتا مع ووتش

يمكن تشغيل Jest في وضع المراقبة ، حيث يتم تشغيل الاختبارات تلقائيًا كلما قمت بتغيير الرمز. يمكنك تشغيله مع وسيطة سطر الأوامر --watchAll ، وسيراقب تطبيقك للتغييرات. ركضت الدعابة في وضع المراقبة وقدمت خطأً حول الغرض إلى palindrome.js ، وهنا النتيجة:

استنتاج

Jest هو إطار اختبار سريع يسهل إعداده. تم تطويره واستخدامه بشكل فاعل من قِبل Facebook للبدء جميع تطبيقات React إليها إلى خلايا من المطورين والشركات الأخرى.

كل ما تحتاجه في حزمة واحدة مريحة ، ويدعم TypeScript ، و IMO هو أفضل خيار لحساب التطبيقات React و React Native. كما أنه منافات أقل الانتقال من حلول الاختبارات الأخرى.

تذكر ، نمت React في شعبية. في الواقع ، لدينا عدد من العناصر في سوق Envato متوفرة للشراء والمراجعة والتنفيذ وما إلى ذلك. إذا كنت تبحث عن موارد إضافية حول رد فعل، لا تتردد في التحقق منها .

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.