دسته‌ها را مشاهده کنید

یکپارچه‌سازی با Cypress

مدت زمان مطالعه: : 9 دقیقه

Cypress یک ابزار بسیار محبوب نسل جدید برای تست front-end است که برای وب مدرن ساخته شده است. از آن می‌توان برای unit test، integration test و حتی end-to-end test استفاده کرد. Cypress امکاناتی برای افزایش بهره‌وری دارد، مثل automatic waiting، time travel، reload لحظه‌ای و ابزارهای debugging.

در این آموزش بررسی می‌کنیم چطور نتایج تست تولیدشده از یک test run خودکار Cypress را با استفاده از TestRail CLI در TestRail وارد کنیم. با این کار می‌توانید نتایج تست‌های خودکار خود را در یکجا متمرکز کنید و از همه قابلیت‌های تحلیلی و گزارش‌گیری TestRail استفاده کنید.

نمای کلی #

در این آموزش از یک sample project استفاده می‌کنیم تا راه‌اندازی یک project تست خودکار Cypress سازگار با TestRail CLI و upload کردن نتایج تست تولیدشده را مرحله‌به‌مرحله انجام دهیم.

بعد از خواندن این آموزش، می‌توانید:

  • تست‌های یک project ساده Cypress را اجرا کنید
  • TestRail CLI را نصب کنید
  • TestRail instance خود را پیکربندی کنید
  • CLI را اجرا کنید
  • test caseها و نتایج تست خود را در TestRail ببینید

پیش‌نیازها #

برای اجرای یک project تست Cypress، مطابق مستندات نصب Cypress می‌توانید آن را از طریق npm یا به‌صورت standalone نصب کنید؛ اما در این مقاله آن را از طریق npm نصب می‌کنیم. این روش چند مزیت دارد؛ از جمله اینکه Cypress مثل هر dependency دیگری نسخه‌بندی می‌شود و اجرای Cypress در Continuous Integration را هم ساده‌تر می‌کند. برای نصب Cypress با npm، تنها پیش‌نیاز لازم نصب Node.js است.

برای نصب و اجرای TestRail CLI که برای import کردن نتایج تست به TestRail استفاده می‌شود، به Python هم نیاز دارید.

پیش‌نیاز توضیحات
Node.js نسخه مناسب سیستم‌عامل خود را دانلود کنید و مراحل راهنمای نصب را دنبال کنید.
برای مطمئن شدن از موفقیت‌آمیز بودن نصب، دستورهای node --version و npm --version را از command line اجرا کنید؛ خروجی باید نسخه نصب‌شده را نشان دهد.
Python 3.10.4 نسخه مناسب سیستم‌عامل خود را دانلود کنید و مراحل راهنمای نصب را دنبال کنید.

برای مطمئن شدن از موفقیت‌آمیز بودن نصب، دستورهای python --version و pip --version را از command line اجرا کنید؛ خروجی باید نسخه‌های آن‌ها را نشان دهد.

نصب sample project #

بیایید با دریافت کد sample project و نصب dependencyهای لازم شروع کنیم.

  1. کد sample project را clone یا download کنید
  2. command prompt را در پوشه root پروژه باز کنید و دستور زیر را اجرا کنید
$ npm install

فایل packages.json شامل libraryهایی است که می‌خواهیم برای این project نصب کنیم. در اینجا تنها dependency، خود Cypress است که طبیعتاً به libraryهای دیگری هم وابسته است.

نیازمندی توضیحات
cypress فریم‌ورک اتوماسیون تست با قابلیت‌های اتوماسیون وب

بررسی پروژه نمونه #

با IDE دلخواهتان پروژه نمونه را باز کنید و فایل‌های test را بررسی کنید. کد تست‌های خودکار را ساده نگه داشته‌ایم تا تمرکز این آموزش روی نحوه import کردن نتایج اجرا باشد. این تست‌ها شامل تعامل‌های ساده با یک وب‌اپلیکیشن TO DO list هستند که خود تیم Cypress آن را میزبانی می‌کند.

// To learn more about how Cypress works and
// what makes it such an awesome testing tool,
// please read the getting started guide:
// https://on.cypress.io/introduction-to-cypress

describe('[smoke] example to-do app', () => {
  beforeEach(() => {
    cy.visit('https://example.cypress.io/todo')
  })

  it('displays two todo items by default', () => {
    cy.get('.todo-list li').should('have.length', 2)
    cy.get('.todo-list li').first().should('have.text', 'Pay electric bill')
    cy.get('.todo-list li').last().should('have.text', 'Walk the dog')
  })
})

اجرای پروژه نمونه #

در همان command prompt، دستور زیر را اجرا کنید تا testهای Cypress در project اجرا شوند و نتایج با فرمت JUnit XML ذخیره شوند.

$ npx cypress run --reporter junit --reporter-options "mochaFile=reports/TEST-[hash].xml"

اگر اجرای Cypress موفق باشد، باید بتوانید نتایج test را در پوشه reports ببینید. این پوشه باید چند فایل XML داشته باشد که reportهای JUnit برای هر test suite هستند. دقت کنید نام همه فایل‌های report با TEST- شروع می‌شود؛ این همان چیزی است که در دستور اجرا شده تعیین کردیم تا بعداً بتوانیم همه reportها را در یک فایل ادغام کنیم. این فایل واحد توسط TestRail CLI پردازش می‌شود تا در مرحله بعد test run ساخته شود و نتایج test شما در TestRail آپلود شود. در ادامه نمونه‌ای از بخشی از یک report را می‌بینید.

<?xml version="1.0" encoding="UTF-8"?>
<testsuites name="Mocha Tests" time="1.4800" tests="5" failures="1">
  <testsuite name="Root Suite" timestamp="2022-06-22T13:40:26" tests="0" file="cypress/integration/1-getting-started/todo_interactions.spec.js" time="0.0000" failures="0">
  </testsuite>
  <testsuite name="[interactions] example to-do app" timestamp="2022-06-22T13:40:26" tests="2" time="0.8810" failures="0">
    <testcase name="[interactions] example to-do app can add new todo items" time="0.6530" classname="can add new todo items">
    </testcase>
    <testcase name="[interactions] example to-do app can check off an item as completed" time="0.2280" classname="can check off an item as completed">
    </testcase>
    </testsuite>
    <testsuite name="with a checked task" timestamp="2022-06-22T13:40:28" tests="3" time="0.5990" failures="1">
    <testcase name="[interactions] example to-do app with a checked task can filter for uncompleted tasks" time="0.3060" classname="can filter for uncompleted tasks">
    </testcase>
    <testcase name="[interactions] example to-do app with a checked task can filter for completed tasks" time="0.2930" classname="can filter for completed tasks">
    </testcase>
    <testcase name="[interactions] example to-do app with a checked task can delete all completed tasks" time="0.0000" classname="can delete all completed tasks">
      <failure message="Timed out retrying after 4000ms: Not enough elements found. Found &apos;1&apos;, expected &apos;2&apos;." type="AssertionError">
        <![CDATA[AssertionError: Timed out retrying after 4000ms: Not enough elements found. Found '1', expected '2'.
        at Context.eval (https://example.cypress.io/__cypress/tests?p=cypress\integration\1-getting-started\todo_interactions.spec.js:186:31)]]>
      </failure>
    </testcase>
  </testsuite>
</testsuites>

  #

test fileهایی با describe blockهای هم‌نام ایجاد نکنید؛ این کار باعث تداخل نام‌ها می‌شود و ممکن است import مطابق انتظار کار نکند. دقت کنید ما در project خود به describe blockها یک prefix اضافه کرده‌ایم، مثلاً: [interactions]) تا این اتفاق نیفتد.

وارد کردن نتایج به TestRail #

بعد از اجرای testها و تولید فایل‌های report با فرمت JUnit، می‌توانید نتایج test و test caseها را به‌راحتی به TestRail وارد کنید. با این کار test runهای خودکار شما قابل مشاهده و پیگیری می‌شوند و می‌توانید در خود TestRail تصویر کلی‌تری از نحوه تست کردن اپلیکیشن‌تان داشته باشید.

نصب TestRail CLI #

اگر Python از قبل روی سیستم شما نصب است، نصب TestRail CLI به سادگی اجرای دستور زیر در command line است.

$ pip install trcli

پیکربندی TestRail #

در مرحله بعد، باید محیط TestRail خود را طبق دستورالعمل‌های زیر پیکربندی کنید.

  1. برای فعال کردن TestRail API به Admin > Site Settings بروید، روی API tab کلیک کنید و گزینه Enable API را فعال کنید.
  2. یک Custom Field ایجاد کنید تا کد test caseهای خودکار شما به test caseهای واقعی در TestRail نگاشت شود. برای این کار به Admin > Customizations بروید و روی Add Field کلیک کنید. بعد از ورود به صفحه ایجاد field، این custom field باید دو شرط زیر را داشته باشد:
    • مقدار System Name باید automation_id باشد.
    • مقدار Type باید متن

ارسال نتایج به TestRail #

بعد از اینکه نصب TestRail CLI و پیکربندی محیط TestRail خود را تمام کردید، فقط یک مرحله دیگر تا آپلود نتایج باقی می‌ماند. در TestRail CLI نسخه ۱.۶.۰، مسیر report اکنون از wildcard پشتیبانی می‌کند؛ بنابراین می‌توانید چند report را بدون دردسر با هم ادغام کنید. این قابلیت به شما اجازه می‌دهد نتایج منابع مختلف را در یک test run واحد ارسال کنید

می‌توانید نتایج test خود را به‌سادگی با یک دستور یک‌خطی مثل نمونه زیر آپلود کنید.

$ trcli -y \
>  -h https://INSERT-INSTANCE-NAME.testrail.io \
>  --project "My Project" \
>  --username INSERT-EMAIL \
>  --password INSERT-PASSWORD \
>  parse_junit \
>  --title "Cypress Automated Test Run" \
>  -f "./reports/junit*.xml"

توجه داشته باشید که نام فایل بعد از گزینه -f اگر محل پیش‌فرض report را تغییر داده‌اید، باید با مسیر فایل report شما یکی باشد. سایر optionها هم باید مطابق instance و project شما در TestRail تنظیم شوند. برای دیدن optionهای دیگر command line، می‌توانید فایل TestRail CLI README.md را در repository پروژه، مقاله مستندات TRCLI، یا راهنمای داخلی CLI از طریق دستورهای زیر بررسی کنید.

$ trcli --help
$ trcli parse_junit --help

مشاهده نتایج در TestRail #

حالا اگر در project خود در TestRail به صفحه Test Cases بروید، می‌بینید که TestRail CLI به‌صورت خودکار test caseهایی را که در report نتایج test شما بوده‌اند ایجاد کرده است. همچنین می‌بینید که با ترکیب کردن classname و name attributeهای هر test در report مربوط به JUnit، یک Automation ID یکتا اضافه کرده است. این Automation ID برای نگاشت testهای موجود در codebase اتوماسیون شما به test caseهای TestRail استفاده می‌شود. یعنی هر بار که TestRail CLI را اجرا می‌کنید، ابتدا سعی می‌کند یک test case موجود در TestRail را پیدا و match کند و فقط زمانی test case جدید می‌سازد که test caseای با آن Automation ID وجود نداشته باشد.

  #

اگر نام testها، نام فایل یا محل فایل را تغییر دهید، Automation ID آن testها هم تغییر می‌کند و دیگر به test caseهای موجود در TestRail نگاشت نمی‌شوند.

Integrating with cypress ss1.png

در صفحه Test Runs & Results می‌بینیم که یک test run با نام Cypress Automated Test Run ایجاد شده است. با باز کردن آن می‌توانیم جزئیات هر نتیجه test خودکار را دقیق‌تر بررسی کنیم و در سطح کلی بفهمیم چرا یک test شکست خورده است؛ چون پیام خطایی که test automation framework ارائه کرده هم در نتیجه test ثبت می‌شود، همان‌طور که در تصویر زیر می‌بینید.

Integrating with cypress ss2.png

قدم بعدی چیست؟ #

حالا که نتایج test خود را در TestRail متمرکز کرده‌اید، علاوه بر دیدن نتایج test runهای خودکار و پیام خطای testهای ناموفق، می‌توانید فعالیت‌های تست دستی و خودکار خود را هم در reportهایی تجمیع کنید که پوشش کامل test برای app شما را نشان می‌دهند و حتی پیشرفت test automation را دنبال می‌کنند. همچنین می‌توانید مثل نتایج testهای دستی، bug را مستقیماً از نتیجه test خودکار به issue tracker دلخواه خود گزارش کنید.

برای آشنایی بیشتر با نحوه استفاده از قابلیت‌های reporting در TestRail، می‌توانید ویدیوی TestRail’s Reports and Test Metrics را ببینید.

به‌روزرسانی شده در ۱۴۰۵-۰۴-۱۷

احساسات شما چیست؟

  • خوشحال
  • عادی
  • ناراحت

دیدگاهتان را بنویسید