مقدمة

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

بنهاية هذا الدليل، ستعرف كيفية:

• رفع الملفات باستخدام السرو.
• التحقق من صحة تحميلات الملفات الناجحة.
• تنزيل الملفات والتحقق من صحة محتواها في Cypress.

المتطلبات الأساسية

لمتابعة الأمثلة، تأكد من تثبيت Cypress وإعداده. إذا كنت تستخدم Cypress v13.6.2، فهو متوافق مع الأساليب الموضحة في هذا المنشور.

تحميل الملفات في السرو

لرفع الملفات في Cypress، سنستخدم البرنامج الإضافي cypress-file-upload، الذي يوفر طريقة سهلة لمحاكاة إجراءات تحميل الملفات أثناء اختباراتك.
الخطوة 1: تثبيت البرنامج المساعد cypress-file-upload
للتعامل مع عمليات تحميل الملفات في Cypress، ستحتاج أولاً إلى تثبيت حزمة cypress-file-upload.

npm install --save-dev cypress-file-upload

بعد ذلك، قم باستيراده في ملف Commands.js الخاص بك داخل مجلد دعم Cypress:

import 'cypress-file-upload';

الخطوة 2: بنية المجلد
تأكد من أن مشروعك يحتوي على بنية المجلد التالية لتخزين ملفات الاختبار وتحميلها أثناء الاختبارات:

cypress/
    fixtures/
        exampleFile.pdf  // Test file for uploading
    e2e/
        fileUploadTests.cy.js  // Test file to upload and validate

الخطوة 3: تحميل ملف
بمجرد تثبيت البرنامج المساعد، يمكنك استخدام الأمر AttachFile لتحميل ملف من مجلد Fixations.

إليك كيفية تحميل ملف:

describe('File Upload Test in Cypress', () => {
  it('should upload a file successfully', () => {
    // Visit the page with a file upload input
    cy.visit('/upload');

    // Select the file input element and upload a file from the fixtures folder
    cy.get('input[type="file"]').attachFile('exampleFile.pdf');

    // Validate that the file was uploaded (depends on your app's specific response)
    cy.get('.file-name').should('contain', 'exampleFile.pdf');
  });
});

في هذا الاختبار:

• نقوم بزيارة الصفحة التي يوجد بها إدخال الملف.
• نستخدم AttachFile () لمحاكاة تحميل الملف من مجلد التجهيزات.
• يتحقق التأكيد مما إذا كان اسم الملف الذي تم تحميله يظهر بشكل صحيح على الصفحة.

التحقق من صحة تحميلات الملفات

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

مثال: التحقق من صحة تحميل الملف باستخدام بيانات إضافية

describe('File Upload and Validation', () => {
  it('should upload a file and validate metadata', () => {
    cy.visit('/upload');

    cy.get('input[type="file"]').attachFile('exampleFile.pdf');

    // Assert that the file metadata like size is displayed correctly
    cy.get('.file-size').should('contain', 'Size: 1MB');
  });
});

تنزيلات الملفات في السرو
لا توفر Cypress دعمًا أصليًا للتحقق من تنزيلات الملفات (نظرًا لأن المتصفح يقوم بتنزيل الملفات خارج نطاق سيطرة Cypress)، ولكن يمكننا التغلب على ذلك عن طريق التحقق مباشرة من الملف الذي تم تنزيله في نظام الملفات المحلي.

الخطوة 1: تثبيت ملف تنزيل السرو
للتحقق من صحة تنزيلات الملفات في Cypress، يمكننا استخدام البرنامج المساعد cypress-downloadfile.

تثبيته عبر npm:

npm install --save-dev cypress-downloadfile

بعد ذلك، قم بإضافة المكون الإضافي إلى ملف Commands.js الخاص بك:

require('cypress-downloadfile/lib/downloadFileCommand');

الخطوة 2: تنزيل الملفات والتحقق من صحتها
يمكنك الآن كتابة اختبار يقوم بتنزيل ملف والتحقق من محتواه.

مثال: تنزيل ملف

describe('File Download Test in Cypress', () => {
  it('should download a file and validate its content', () => {
    cy.visit('/download');

    // Download the file and save it to a custom downloads folder
    cy.downloadFile('https://example.com/sample.pdf', 'cypress/downloads', 'sample.pdf');

    // Validate that the file exists in the specified location
    cy.readFile('cypress/downloads/sample.pdf').should('exist');
  });
});

في هذا الاختبار:

• نستخدم cy.downloadFile() لتنزيل ملف من عنوان URL وتخزينه في مجلد cypress/downloads.
• بعد التنزيل، نتحقق من وجود الملف باستخدام cy.readFile().

الخطوة 3: التحقق من صحة محتوى الملف
قد ترغب في التحقق من محتوى الملف الذي تم تنزيله للتأكد من نجاح التنزيل. بالنسبة للملفات النصية (على سبيل المثال، .txt، .csv)، يمكن استخدام cy.readFile() الخاص بـ Cypress لتأكيد محتوى الملف.

مثال: التحقق من صحة محتوى الملف الذي تم تنزيله

describe('Validate Downloaded File Content', () => {
  it('should download and check the content of a text file', () => {
    cy.visit('/download');

    // Download the text file
    cy.downloadFile('https://example.com/sample.txt', 'cypress/downloads', 'sample.txt');

    // Read the file and assert its content
    cy.readFile('cypress/downloads/sample.txt').then((fileContent) => {
      expect(fileContent).to.contain('This is a sample text file');
    });
  });
});

يقوم هذا الاختبار بتنزيل ملف .txt والتحقق من أنه يحتوي على النص المتوقع.

أفضل الممارسات لتحميل الملفات وتنزيلها في Cypress

1. استخدام Fixtures للتحميل: قم دائمًا بتخزين الملفات للتحميل في مجلد Fixtures للحفاظ على بيانات الاختبار الخاصة بك منظمة ويمكن الوصول إليها.
2. تنظيف مجلد التنزيلات: قبل بدء الاختبارات الجديدة، قم بتنظيف مجلد التنزيلات لتجنب مشكلات الملفات المتبقية من عمليات التشغيل الاختبارية السابقة.
3. التحقق من استجابة الخادم: بالنسبة لتحميلات الملفات، تحقق دائمًا من الاستجابات من جانب الخادم بالإضافة إلى تأكيدات واجهة المستخدم لضمان معالجة الملف بشكل صحيح.
4. استخدام الدلائل المؤقتة للتنزيلات: قم بتخزين الملفات التي تم تنزيلها في الدلائل المؤقتة (السرو/التنزيلات) لتجنب ازدحام بنية مشروعك.
5. تحميلات الملفات الوهمية (اختياري): في السيناريوهات التي تريد فيها محاكاة تحميلات الملفات لأسباب تتعلق بالأداء، استخدم بذرة لتجاوز تحميلات الملفات الحقيقية.

خاتمة

يعتبر تحميل الملفات وتنزيلها من العمليات الهامة في اختبار تطبيقات الويب، وبينما لا يدعم Cypress هذه العمليات أصلاً، فإن المكونات الإضافية cypress-file-upload و cypress-downloadfile توفر حلولاً سهلة الاستخدام.

في هذا الدليل، اكتشفنا كيفية:

• تحميل الملفات باستخدام البرنامج المساعد Cypress-file-upload من Cypress.
• التحقق من صحة تحميلات الملفات عن طريق التحقق من أسماء الملفات والبيانات الوصفية.
• قم بتنزيل الملفات باستخدام البرنامج المساعد cypress-downloadfile والتحقق من وجود ومحتوى الملفات التي تم تنزيلها.

باستخدام هذه الأدوات والتقنيات، يمكنك التعامل بثقة مع عمليات تحميل الملفات وتنزيلها في اختبارات Cypress الشاملة!