Автоматичното тестване на Javascript код ни позволява да правим промени в проекти, без да се страхуваме от несъзнателно нарушаване на други функции. Без него добавянето на каквато и да е нова функция може да бъде занимание с гризане на нокти.

По-важното е, че рефакторингът е ключът към подобряване на разбираемостта и бъдещата поддръжка на кодова база, тъй като изискванията на програмата винаги се развиват с течение на времето: дизайнерски решения, които изглеждаха разумни преди няколко месеца, сега могат да се превърнат в тежест. Рефакторингът без автоматизирани тестове е ужасяващ, карайки програмистите да се придържат към неподходящ дизайн твърде дълго.

Cypress е превъзходна рамка за автоматизирано тестване за Javascript, а най-новата версия, 10.0, предоставя нови функции и все още е безплатна за използване.

Но версия 10 премахва очевидна функция, на която аз и много други разчитаме: „Изпълни всички спецификации“.

Реакция на потребителите

Рядко е имало такъв отрицателен отговор на актуализация в Cypress. https://github.com/cypress-io/cypress/discussions/21628

Защо приложихте тази ужасна идея да премахнете филтрираните спецификации и да стартирате всички спецификации?
logan5259

Мисля, че премахването на тези функции е огромна загуба. миробо

Тази функционалност беше проста и страхотна и премахването й ме кара да съжалявам за надграждането, въпреки че харесвам много от промените в 10.0.0. Цвимбър

Мисля, че това беше ужасно решение да се премахне функция, без да се предлага алтернатива, сякаш никой изобщо не е използвал тази функция. JamShady

Причина, дадена от авторите на Cypress

Cypress позволява два начина за провеждане на тестове:

  • npx cypress run

Това изпълнява тестовете в командния ред, в текстов режим. Браузърът се затваря и отваря отново между всеки тестов файл, което е концептуално по-чисто и предотвратява „изтичането“ на данни от един тест към следващия, като по този начин минимизира вероятността от „нестабилни“ тестове, чието поведение е непредвидимо.

  • npx cypress open

За разлика от това, тази версия на браузъра показва тестовете, които се изпълняват в реално време, визуално. Виждате какво би видял крайният потребител. Ключова разлика е, че този подход запазва един и същ прозорец на браузъра за всички тестови файлове.

Поради непредвидимостта на последствията от изтичане на данни между тестови файлове, пуристите трябва да предпочетат версията от командния ред. Това е посочената причина за премахване на функцията „Изпълни всички спецификации“.

Въпреки това много потребители, включително и аз, използват версията на браузъра, тъй като тя показва елегантно не само кои тестове са се провалили, но и какъв е бил външният вид на страницата по време и преди повредата. С версия 10, всеки път, когато искаме да „изпълним всички спецификации“, ще трябва да щракваме всеки тестов файл на свой ред. Те ще наброяват десетки или вероятно стотици в голям проект.

Решение

Усърдният привърженик на Cypress и фанатик на отворения код Глеб Бахмутов е предоставил метод за провеждане на множество тестове. Ключът е да създадете нов тест, който просто импортира всички останали тестове.

Тук показвам как можем да автоматизираме процеса, така че да не се налага ръчно да актуализираме този списък с импортирания.

Стъпка 1. Актуализирайте `cypress.config.js`

Когато този файл се създаде автоматично от Cypress в основата на вашия проект, той изглежда нещо подобно и вие ще вмъкнете код на двете места със стрелка:

В горната част на файла импортираме пакета „fs“ и посочваме имената на файловете, които ще използваме, за да контролираме нашия процес. След това вътре в setupNodeEvents създаваме задача, която чете имената на всички ваши тестови файлове и създава нов единичен файл, който просто импортира всички отделни тестови файлове. Вашият cypress.config.js трябва да изглежда така:

Стъпка 2. Създайте псевдо-тестов файл, който извиква тази задача

В папката e2e създайте тестов файл с име „000 update tests list.cy.js“. В него напишете следното. Въпреки че всъщност не е тест, имаме нужда от блокове „describe“ и „it“, защото само вътре в тях можем да извикаме cy.task.

describe("Update list of tests in 001", () => {
  it("", () => {
    cy.task("updateListOfTests");
  });
});

Как да го използвате за изпълнение на всички тестове

Щракнете върху „000 списъка с тестове за актуализиране“ в панела със спецификации на прозореца на браузъра Cypress. Cypress ще създаде или актуализира файла „001 run all tests.cy.js“, като даде съобщението по-долу:

Когато щракнете върху раздела „Спецификации“, списъкът със спецификации вече ще изглежда така:

Щракнете върху файла „001…“ и всичките ви тестове ще се изпълнят!

В бъдеще, ако сте сигурни, че не сте добавили, премахнали или преименували тестов файл, можете да преминете директно към щракване върху „001…“. Трябва само да щракнете върху „000…“, когато трябва да актуализирате списъка с тестови файлове.

проблеми?

В този код предположих, че използвате конвенциите на Cypress версия 10.

  • Тестовите файлове са в cypress/e2e
  • Имената на тестовите файлове са във формата *.cy.js

Ако имате други конвенции, актуализирайте кода съответно.

Предположих, че вашите тестови файлове не са в поддиректории, тъй като ме мързеше да извлека пътеките и да ги вмъкна отново правилно, но ще се радвам, ако някой може да предложи актуализация, за да направя това.

Предполагам също, че използвате имената на файловете „000…“ и „001…“, описани в тази публикация, избрани, защото ще сортират над тестовете, които започват с думи. Ако решите да наричате тези файлове по друг начин, актуализирайте стойностите на RUN_ALL_TESTS_CY_JS и UPDATE_TESTS_LIST_CY_JS в cypress.config.js.

Кажете ми дали това работи за вас!

Благодарности

Голямо благодаря на Cypress.io за предоставянето на Cypress на общността безплатно! И на @ghiscoding и поддържащия Cypress @lmiller1990 за повдигане и поправяне на проблема с двойното изпълнение.