Cypress чи Selenium — в чому різниця і що краще вибрати саме тобі?
Link to the English version of this article you can find at the end of the article.
Як завжди, до написання цієї статті мене надихнула недавня розмова з QA у моїй поточній компанії. Під час розмови він поставив мені питання: чому я обрав Cypress? Адже всі його знайомі колеги використовують Selenium і відносяться до першого досить негативно. Відразу хочу зазначити, що метою статті не є виправдання будь-якого з інструментів і в більшій мірі фокусується на поверхневому порівнянні. Я хочу пролити світло на те, в чому кожен з них є хорошим і як обрати оптимальний саме для вас, керуючись кількома пунктами. Адже, на жаль, у автоматизації тестування не існує ідеального рішення, і нам завжди доведеться вибирати “менше зло”, а ми не відьмами, щоб не вибирати взагалі 😉.
Перше, з чого варто почати — це розуміння проекту, для якого ви розпочинаєте автоматизацію. Якщо це публічний веб-сайт з великою географією та числом унікальних користувачів, то, ймовірно, кроссбраузерність буде для вас ключовою проблемою. Такі сайти часто не мають складного функціоналу, але те, як вони відображаються на різних версіях основних (і не дуже) браузерів, є одним з ключових моментів. Що ж тоді можуть запропонувати нам кожен з інструментів?
Підтримка браузерів
В загальному, Selenium має підтримку найпоширеніших браузерів, таких як Chrome, Firefox, IE, Edge, Opera, Safari. Автоматизація цих браузерів відбувається шляхом відправлення HTTP-запитів до драйвера обраного вами браузера, завдяки чому всі дії здійснюються нативно і, отже, максимально наближені до користувацького досвіду.
Cypress на сьогоднішній день (осінь 2021 року) має більш обмежену підтримку браузерів Chromium, Edge і Firefox. Однак, найбільшим мінусом є сам принцип роботи цього інструмента, а саме те, що всі взаємодії з браузерами відбуваються шляхом виконання JS. Ті, хто пам’ятає розвиток Selenium, можуть згадати його першу версію Selenium RC, яка також працювала шляхом виконання JS-коду на клієнтській стороні.
“В чому проблема із JS events?” запитаєте ви.
Проблема полягає в тому, що JS, на відміну від користувача, може натиснути на елемент, який має нульову ширину і висоту, буде перекритий або зовсім прихований, і це ще не кажучи про інші особливості. На захист Cypress скажу, що вони, на відміну від Selenium RC, проводять цілий набір перевірок елемента перед взаємодією з ним, якщо ви не вимушено вимкнули їх за допомогою властивості {force: true}.
Таким чином, в цьому пункті безсумнівно перевага на боці Selenium.
Selenium: + Cypress: +-
Встановлення і налаштування
Це важний і дуже недооцінений пункт, який часто упускають автоматизатори. Дуже часто автоматизація на проекті починається як особиста ініціатива або спроба пера з невідомими перспективами. І, згодьтесь, мало хто захоче витратити багато часу на встановлення і налаштування інструменту, який, можливо, ще й не підійде вам. І навіть не факт, що ви зможете переконати вашого менеджера виділити вам кілька тижнів на це.
У цьому питанні Cypress має максимальну простоту, яка тільки можлива — встановлення з використанням всього однієї команди npm i cypress. Звичайно, сьогодні Selenium також має багато готових фреймворків, які можна встановити однією командою і декількома виборами. Але перевагою Cypress є те, що вам навіть не потрібно встановлювати браузер, оскільки він йде вже з коробки. І повірте на моє слово, навіть такий, здається, незначний пункт неодноразово зупиняв розробників від запуску тестів локально або спроби написати кілька тестів у відсутність автоматизатора.
Selenium: +- Cypress: +
Документація
Цей пункт є дуже важливим при першому знайомстві з інструментом і в значній мірі впливає на попередній пункт — чим більш обширна і зрозуміла документація, тим швидше ви отримаєте перші результати. Останнім часом офіційний веб-сайт Selenium зробив великий крок вперед, але все ж він досить обмежений в прикладах, і відсутнє повне описання всього API. Ймовірно, це пов’язано з багатомовністю, але поки що швидкий огляд не приніс мені результату у вигляді посилання на опис доступних методів.
Cypress, з іншого боку, має прикладну документацію щодо свого API з кодовими прикладами і сценаріями їх використання. Також на сайті є відео, найкращі практики та доступні плагіни.
Selenium: +- Cypress: +
Додаткові можливості
Коли ми говоримо про автоматизацію, ми часто маємо на увазі тести. А цим тестам потрібні не лише прості кліки і прокрутки. Перехоплення запитів, моковані відповіді, керування часом і локалізацією — це невід’ємні атрибути тестів. З деякими винятками, Selenium просто позбавлений всього цього, оскільки його завдання полягає у відправленні команд браузеру, а все решта — це проблема вашого фреймворку, і небагато з них можуть навіть перехоплювати запити, оскільки технічно це не найпростіша задача, особливо з HTTPS-запитами. У той час як Cypress має все це з самого початку і працює це просто чудово. Насправді, це одна з його ключових особливостей, оскільки він від самого початку був позиціонований як інструмент для фронтенд-розробників, щоб вони могли писати тести для своєї частини коду, навіть коли частина бекенду ще відсутня.
Selenium: - Cypress: +
Висновки
Ми могли би розмовляти про звіти (хоча все залежатиме від обраного вами інструменту, і для обох з них існує практично ідентичний набір функцій), і про синтаксис (наприклад, Cypress не використовує нативні promises, що призводить до багатьох незручностей як для розробників, так і для тих, хто звик до використання async/await), і про багато іншого, але метою цієї статті є короткий опис можливостей інструменту.
Якщо спробувати підрахувати всі плюси, ми можемо зробити некоректний висновок про те, що один інструмент кращий за інший. Але більш розумним підходом буде визначення вагомості кожного пункту для вашого проекту і на основі цього робити вибір. Наприклад, якщо ваш проект — це інтернет-магазин з великою кількістю відвідувань, і у вас є кілька досвідчених програмістів (автоматизаторів), то питання кроссбраузерності буде найважливішим, а наявність досвідчених розробників може нивелювати складність інструменту — ви ймовірно виберете Selenium. Якщо ж ви створюєте адміністративну панель, якою користуватимуться близько сотні осіб, але вона є односторінковим додатком зі складною логікою, і ви хочете розпочати автоматизацію для скорочення часу тестування, то, скоріш за все, ви виберете Cypress.
Я навіть не згадував про те, що Cypress ідеально підходить для інтеграційного тестування для розробників Front-End, тоді як Selenium можна використовувати як засіб автоматизації браузера, як частину вашого продукту, а не для автоматизації тестування. Все залежить від ваших цілей та ресурсів. Тому якщо хтось каже вам, що один інструмент безумовно гірший за інший, я пропоную просто запитати “В чому саме?” і потім робити обґрунтований висновок.
На сьогодні все, дякую всім. І якщо у вас є щось, що ви хочете додати, запрошую вас поділитися своїми думками у коментарях.
Link to the English version here.
