مقدمة

في منشورنا السابق، قدمنا ​​مفهوم الأوامر المخصصة في Cypress وأظهرنا كيف يمكنها تبسيط وتعزيز إطار الاختبار الخاص بك. يتعمق منشور المتابعة هذا بشكل أعمق في أفضل الممارسات لإنشاء الأوامر المخصصة واستخدامها، ويقدم أمثلة تفصيلية للتأكد من أن اختباراتك قابلة للصيانة وقابلة للقراءة وقوية.

لماذا تعتبر أفضل الممارسات مهمة؟

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

أفضل الممارسات للأوامر المخصصة

1. أوامر الاسم بوضوح
الأسماء الواضحة والوصفية تجعل أوامرك سهلة الفهم والاستخدام. يجب أن ينقل اسم الأمر الجيد غرضه دون الحاجة إلى سياق إضافي.
مثال:

// cypress/support/commands.js
Cypress.Commands.add('login', (email, password) => {
  cy.visit('/login');
  cy.get('input[name=email]').type(email);
  cy.get('input[name=password]').type(password);
  cy.get('button[type=submit]').click();
});

الاستخدام:

// cypress/integration/login.spec.js
describe('Login Tests', () => {
  it('Should login with valid credentials', () => {
    cy.login('[email protected]', 'password123');
    cy.url().should('include', '/dashboard');
  });
});

2. أوامر المعلمات
يجب أن تقبل الأوامر المعلمات لتعزيز مرونتها وإمكانية إعادة استخدامها. وهذا يسمح باستخدام نفس الأمر في سياقات مختلفة مع بيانات مختلفة.

مثال:

// cypress/support/commands.js
Cypress.Commands.add('fillForm', (formData) => {
  cy.get('input[name=firstName]').type(formData.firstName);
  cy.get('input[name=lastName]').type(formData.lastName);
  cy.get('input[name=email]').type(formData.email);
  cy.get('button[type=submit]').click();
});

الاستخدام:

// cypress/integration/form.spec.js
describe('Form Tests', () => {
  it('Should submit the form with valid data', () => {
    const formData = {
      firstName: 'John',
      lastName: 'Doe',
      email: '[email protected]'
    };
    cy.fillForm(formData);
    cy.get('.success-message').should('be.visible');
  });
});

3. أوامر السلسلة
تأكد من أن الأوامر المخصصة تُرجع عناصر Cypress القابلة للتسلسل باستخدام cy.wrap() لتمكين التسلسل والحفاظ على تدفق أوامر Cypress.

مثال:

// cypress/support/commands.js
Cypress.Commands.add('selectDropdown', (selector, value) => {
  cy.get(selector).select(value).should('have.value', value);
  return cy.wrap(value);
});

الاستخدام:

// cypress/integration/dropdown.spec.js
describe('Dropdown Tests', () => {
  it('Should select a value from the dropdown', () => {
    cy.visit('/dropdown-page');
    cy.selectDropdown('#dropdown', 'Option 1').then((value) => {
      expect(value).to.equal('Option 1');
    });
  });
});

4. أوامر الوثيقة
أضف تعليقات إلى أوامرك المخصصة لوصف الغرض منها واستخدامها. وهذا يساعد المطورين الآخرين على فهم الكود الخاص بك واستخدامه بشكل صحيح.

مثال:

// cypress/support/commands.js

/**
 * Custom command to login to the application
 * @param {string} email - User email
 * @param {string} password - User password
 */
Cypress.Commands.add('login', (email, password) => {
  cy.visit('/login');
  cy.get('input[name=email]').type(email);
  cy.get('input[name=password]').type(password);
  cy.get('button[type=submit]').click();
});

5. نموذجية الإجراءات المشتركة
قم بتغليف الإجراءات الشائعة ضمن الأوامر المخصصة لتعزيز إعادة الاستخدام وتقليل الازدواجية. وهذا أيضًا يجعل الاختبارات أكثر قابلية للقراءة من خلال تجريد التفاعلات المعقدة.

مثال:

// cypress/support/commands.js
Cypress.Commands.add('addItemToCart', (itemName) => {
  cy.get('.product-list').contains(itemName).click();
  cy.get('.add-to-cart').click();
});

الاستخدام:

// cypress/integration/cart.spec.js
describe('Cart Tests', () => {
  it('Should add an item to the cart', () => {
    cy.visit('/shop');
    cy.addItemToCart('Laptop');
    cy.get('.cart-items').should('contain', 'Laptop');
  });
});

خاتمة

باتباع أفضل الممارسات هذه، يمكنك إنشاء أوامر مخصصة في Cypress ليست قوية فحسب، بل يمكن صيانتها أيضًا وسهلة الفهم. تُعد التسمية الواضحة وتحديد المعلمات والتسلسل والتوثيق والنمطية أمرًا أساسيًا لكتابة أوامر مخصصة فعالة. قم بتنفيذ هذه الممارسات في إطار عمل أتمتة الاختبار الخاص بك لتحسين جودة وكفاءة اختباراتك.

ابدأ في تحسين أوامرك المخصصة اليوم، وانتقل باختبارات Cypress إلى المستوى التالي. اختبار سعيد!