تحية للجميع!
اسمي رومان Mostafin. أنا اختبار آلي في Clover وعادة ما أكتب اختبارات ذاتية في pytest + selenium. في الآونة الأخيرة ، بدأ فريق تطوير الواجهة الأمامية لدينا باستخدام Cypress لكتابة اختبارات واجهة المستخدم في مشروع Smart Locomotive لأتمتة اختبار الانحدار. تطوعت لمساعدتهم وشربت هذه التكنولوجيا. في هذه المقالة سأتحدث عن السرو ، وكيفية إنشاء أول اختبار لي على ذلك.يعتبر السرو إطارًا جديدًا نسبيًا لكتابة اختبارات جافا سكريبت. ينشر متصفحه ويحقن الاختبارات في شفرة الصفحات.يتميز السرو بالمزايا التالية:- يدعم كتابة الاختبارات المعيارية والتكامل والاختبار الشامل ،
- لديه وثائق جيدة
- لديه واجهة سهلة وبديهية لإطلاق ومشاهدة وتصحيح الأخطاء ،
- لديه أدوات مفيدة لتبسيط كتابة الاختبار.
ونتيجة لذلك ، لدينا إطار عمل عالمي ومناسب لكتابة أنواع مختلفة من الاختبارات.نظرية
لكتابة اختبار ، هناك حاجة إلى ست وظائف أساسية. فكر فيها وبعض الحجج التي تحتاجها كمثال.1. cy.visit ()
يتم استخدام هذه الطريقة للذهاب إلى صفحة التطبيق. كحجة ، فإنه يأخذ سلسلة مع عنوان صفحة التطبيق:cy.visit(‘http:
2. cy.get ()
يتم استخدام هذه الطريقة للحصول على عنصر من نموذج DOM لصفحة الويب. يستغرق الحجج التالية:- عنصر محدد - العنوان الذي يمكن العثور فيه على العنصر ؛
- مهلة - الوقت الذي سيبحث فيه السرو عن عنصر في الصفحة (بشكل افتراضي 4 ثوانٍ).
cy.get(‘div[class=”topbar”]’, {timeout: 3000})
3. نوع ()
يتم استخدام أسلوب .type لتعبئة النماذج النصية والحقول المختلفة. لديها الحجج التالية:- النص الذي سيتم إدخاله هو النص في تمثيل السلسلة. قد يشير النص أيضًا إلى أوامر لوحة المفاتيح المميزة بأقواس متعرجة ؛
- timeout - التأخير قبل تنفيذ الأمر type.
cy.get(‘input’).type(‘Hello world’, {timeout: 3000})
4. cy.wait ()
يتم استخدام هذه الطريقة لإيقاف تنفيذ الأوامر مؤقتًا. يمكن استخدامه أيضًا لانتظار اكتمال طلبات HTTP. لها مهلة الوسيطة - المهلة مباشرة.cy.wait(3000)
5. cy.fixture ()
يتم استخدام هذه الطريقة للحصول على بيانات الاختبار. يقبل اسم ملف json كمدخل.6. cy.should ()
طريقة للتحقق من التعبير. تقبل الحجج التالية:- أمر المقارنة هو شرط يتم فيه فحص عنصر ؛
- النتيجة المتوقعة - النتيجة المتوقعة للشيك.
ممارسة
لنأخذ نموذج تفويض Yandex ، وكمثال على ذلك ، سوف نتحقق من التفويض باستخدام تسجيل دخول غير مصرح به وتفويض باستخدام كلمة مرور غير موجودة. للقيام بذلك ، قم بعمل الاستعدادات الأولية:1. إنشاء مجلد للمشروع الجديد.2. انتقل إلى مجلد المشروع وقم بتنفيذ الأمر لتثبيت Cypress:npm install cypress --save-dev
3. قم بتشغيل أمر السرو:npx cypress open
4. بعد البدء ، تأكد من ظهور التسلسل الهرمي التالي في دليل المشروع:
الآن أنت بحاجة إلى إنشاء تركيبات. نحن بحاجة إليها من أجل فصل بيانات الاختبار عن الاختبار نفسه.1. قم بإنشاء ملف "cypressTest.json" في مجلد "تركيبات" بالمحتويات التالية:
2. بعد ذلك ، في مجلد "تكامل" ، قم بإنشاء ملف يسمى "habr_cypress_test.spec.js":
3. قم بعمل وصف لحالة الاختبار بالكامل باستخدام الوظيفة " صف ':
4. داخل الوظيفة' وصف 'سننشئ اختباراتنا. سنكتب عنوانالاختبار الأول :
5. الخطوة التالية هي كتابة مكالمة البيانات من المباراة:
أخيرًا ، نقوم بإنشاء الاختبار نفسه ، باستخدام معرفة وظائف Cypress.
عن طريق القياس ، نقوم بإنشاء الاختبار الثاني.
نذهب إلى تطبيق Cypress ، ونعثر على اختبارنا وننقر على اسمه
، وبعد ذلك تفتح صفحة المتصفح التي تشغل Cypress ، ويبدأ الاختبار: على اليسار في عمود منفصل يمكنك رؤية الخطوات التفصيلية للعملية. عليك الانتظار حتى يكتمل الاختبار.
تهانينا ، لقد كتبت أول اختبارات السرو!ملاحظة:أود أن أشكر فريق الواجهة الأمامية ، وخاصة أديل خاماتوفا ، على مساعدتهم في تعلم السرو في المشروع.