Cypress، یک فریم ورک اتوماسیون پیشرفته است که دارای قابلیت هایی جهت ایجاد سریع سناریوهای تست قوی است. Cucumber، یک رویکرد/ ابزار ازمایشی است که از توسعه مبتنی بر رفتار (BDD) پشتیبانی می کند. این راهی برای نوشتن تست هایی است که هرکسی می تواند صرف نظر از میزان دانش فنی خود، آن را درک کند.
در این مقاله، به بررسی BDD با استفاده از Cucumber و ادغام آن با Cypress خواهیم پرداخت. به عبارت دیگر، نحوه انجام آزمایشات با Cucumber و Cypress را مورد بحث قرار خواهیم داد.
فریم ورک cypress چیست؟
یک فریم ورک آزمایشی مبتنی بر جاوا اسکریپت است که بر روی Mocha ساخته شده است. یک فریم ورک آزمایشی جاوا اسکریپت غنی از ویژگی ها که در مرورگر اجرا می شود و آزمایش های ناهمزمان را ساده و راحت می کند. همچنین، از یک کتابخانه BDD/TDD و یک مرورگر برای جفت شدن با هر فریم ورک تست جاوا اسکریپت استفاده می کند.
Cucumber چیست؟
Cucumber، ابزاری است که از توسعه رفتار محور (BDD) پشتیبانی می کند. که به صورت خودکار آزمون های پذیرش نوشته شده در قالب BDD را اجرا می کند. Cucumber، در اصل به زبان برنامه نویسی Ruby نوشته شده است و راهی برای نوشتن تست هایی ارائه می دهد که هر کسی صرف نظر از دانش فنی خود می تواند آن را درک کند. Cucumber، مراحل آزمایش و رفتار برنامه را به زبان انگلیسی ساده با استفاده از زبان Gherkin توضیح می دهد.
چرا از Cucumber برای آزمایش استفاده می کنیم؟
Cucumber به دلایل زیر به عنوان یک ابزار آزمایش مهم تلقی می شود:
– Cucumber منبع باز است و استفاده از آن نیز رایگان است.
– با استفاده از Cucumber، می توان اسکریپت های آزمایشی شما را به چندین زبان مانند جاوا، روبی،.net ، پایتون و غیره بنویسید.
– با سلنیوم، Watir، Cypress ، Ruby in Rails و سایر ابزارهای تست مبتنی بر وب ادغام می شود.
– Cucumber، یکی از پرکاربردترین ابزارهای BDD است.
مروری بر توسعه مبتنی بر رفتار:
توسعه مبتنی بر رفتار BDD یک تکنیک توسعه نرم افزاری است که از TDD(Test Driven Development) منشعب شده است، عملیاتی که در آن توسعه دهندگان کد جدیدی را فقط در صورت عدم موفقیت مورد آزمایشی خودکار می نویسند.
– این رویکرد شامل استفاده از زبان مشترک است که ارتباط بین تیم های مختلف فناوری و غیرفناوری را افزایش می دهد.
– آزمایشات بیشتر بر کاربر متمرکز است و بر اساس رفتار سیستم است.
– در BDD، Given-When-Then روش پیشنهادی برای نوشتن مورد آزمون است.
– تمرکز بر تعریف اعضای تیم های محصولات چند منظوره را افزایش می دهد.
– با استفاده از زبان غیر فنی به مخاطبان بیشتری دسترسی پیدا می کند.
– برای درک این آموزش، به مثال زیر توجه کنید
نحوه ادغام Cypress و Cucumber
ابتدا با نصب پیش پردازنده Cucumber و Cypress شروع می کنیم.
مرحله1: Cypress را نصب کنید
برای نصب محلی Cypress دستور زیر را اجرا کنید:
سپس، Npm، Cypress را نصب کنید.( npm install cypress)
مرحله2: Cucumber را نصب کنید
برای نصب پکیج Cucumber for Cypress دستور زیر را اجرا کنید:
pm install –save-dev cypress-cucumber-preprocessor
مرحله3: پیکربندی(Config) فایل های محیط Cypress را اضافه کنید
پلاگین/ فایل Index.JS موارد زیر را اضافه کنید:
const cucumber = require(‘cypress-cucumber-preprocessor’).default
module.exports = (on, config) => {
on(‘file:preprocessor’, cucumber())
}
داخل فایل package.json پیکربندی زیر را اضافه کنید
“cypress-cucumber-preprocessor”: {“nonGlobalStepDefinitions”: true
در پارامتر پسوند فایل های مشخصات در فایل Cypress.json، مطمئن شوید که ویژگی های زیر را در نظر میگیرید:
{
“testFiles”: “**/*.feature”
}
تست ها را با cypress و cucumber انجام دهید
ابتدا این تست را فقط با استفاده از Cypress بنویسید:
cy.visit(‘/login’)
.findByPlaceholder(/email/)
.type(xyz@gmail.com‘)
.findByPlaceholder(/password/)
.type(‘my password‘)
.findByText(‘Log in‘)
.click()
.url()
.should(‘eq‘, ‘/‘)
.window().its(‘localStorage.email‘)
.should(‘eq‘, ‘xyz@gmail.com)
این تست به مسیر login/( با استفاده از baseUrl در Cypress.json مشخص شده) حرکت می کند، نام کاربری و رمز عبور را وارد کرده و دکمه «ورود به سیستم(Log In)» را کلیک کنید.
در cypress، کاربران می توانند چندین فرمان را در یک خط فرمان سفارشی واحد با ایجاد فایلی به نام cypress/support/commands.js گروه بندی کرده و اضافه کنند:
Cypress.Commands.add(‘loginWith’, ({ email, password }) =>
cy.visit(‘/login’)
.findByPlaceholderText(/email/)
.type(email)
.findByPlaceholderText(/password/)
.type(password)
.findByText(‘Log in’)
.click()
)
Cypress.Commands.add(‘loginWith’, ({ email, password }) =>
cy.visit(‘/login’)
.findByPlaceholderText(/email/)
.type(email)
.findByPlaceholderText(/password/)
.type(password)
.findByText(‘Log in’)
.click()
)
و سپس cypress/support/index.js را باز کرده و اضافه کنید:
import ‘./commands’
اکنون از دستورات سفارشی در تست ها استفاده کنید:
cy.loginWith({
email: xyz@gmail.com‘,
password: ‘mypassword‘
})
.url()
.should(‘eq‘, ‘/‘)
.window().its(‘localStorage.email‘)
.should(‘eq‘, ‘xyz@gmail.com‘)
کد بالا با استفاده از Cypress نوشته شده است. اکنون، برای استفاده از Gherkin for cucumber، کد آن به شرح زیر است:
ابتدا یک فایل cypress/integration/login.feature ایجاد کنید:
Feature: Login App
Scenario:
When I log in
Then the url is /
And I‘m logged in
این آزمون شامل یک سناریوی 3 مرحله‌ای است: «من وارد سیستم می شوم»، «آدرس اینترنتی{ }» و «من وارد سیستم شده‌ام» است. بنابراین تعریف باید یک سناریوی 3مرحله‌ای ایجاد کنید. یک فایل جاوا اسکریپت در داخل دایرکتوری به نام features ایجا کنید(login/login.js) و بنویسید:
import { When, Then } from ‘cypress-cucumber-preprocessor/steps’
When(‘I login’, () => {
cy.loginWith({ email: ‘[email protected]’, password: ‘my password’})
})
Then(‘the url is {word}’, (url) => {
cy.url()
.should(‘eq’, `${Cypress.config().baseUrl}${url}`)
})
Then(‘I\’m logged’ in, () => {
cy.window().its(‘localStorage.email’)
.should(‘eq’, ‘[email protected]’)
})
پس از اجرای این کد، Cucumber آن را به دستورات Cypress تبدیل می کند.
به خاطر داشته باشید که ازمایش cypress برای نتایج دقیق باید در مرورگر واقعی اجرا شود. با استفاده از BrowserStack، آزمایشات را روی 30 نسخه از آخرین مرورگرها در Windows و macOS شروع کنید. از موازی سازی فوری و بدون دردسر برای دستیابی به نتایج سریعتر بدون به خطر افتادن دقت تست، استفاده کنید. با تست نرم افزار در شرایط واقعی کاربر با BrowserStack، اشکالات و ایرادات را قبل از کاربران تشخیص دهید.
