Rafał Krząpa

Cypress IO - wprowadzenie.

Cypress to javascriptowy framework do przeprowadzania testów E2E. Zgodnie z informacjami zawartymi na stronie - tworzenie, konfigurowanie, debugowanie i uruchamianie testów jest proste.

Instalacja

Są dwie metody instalacji Cypressa.
Pierwsza poprzez użycie npma, drugi zaś poprzez pobranie i rozpakowanie.

nmp

Przejdź do swojego projektu i zainstaluj cypressa poprzez polecenie:

 npm install cypress --save-dev

Po instalacji w folderze projektu pojawi się katalog o nazwienode_modules oraz plik package-lock.json.

Uruchomienie Cypressa jest niezwykle proste, gdyż wystarczy wpisać komendę:  node_modules\\.bin\cypress open.

Jeżeli chcesz, poniżej oficjalny tutorial ze strony cypress.io

plik zip

Możesz pobrać plik spakowany w formacie zipa np. tutaj pobierz i wypakować w dowolnym miejscu by przetestować - zapoznać się z narzędziem.

Struktura

Wewnątrz możemy ujrzeć 4 katalogi zawierające pliki które w swoim zamyśle są skatalogowane by łatwiej było się poruszać po stwarzanym projekcie:

• Fixtures – w tym katalogu znajdują się pliki które zawierają statyczne dane, które mogą być użyte podczas testów. Jeżeli chcemy z nich skorzystać, odwołujemy się do nich poprzez polecenie cy.fixture().
• Test files – pliki testów są domyślnie umiejscowione w folderze integration. Cypress generuje folder examples z przykładami użycia, które można odpalić w runnerze i zobaczyć jak to wygląda na przeglądarce (o tym później).
• Plugin files – umożliwiają korzystanie, modyfikowanie, rozszerzanie funkcji. Domyślnie Cypress używa pluginów zawartych w katalogu plugins w pliku index.js. Jeżeli jesteś zainteresowany cypress oferuje na swojej stronie  masę pluginów które są tworzone przez społeczność cypressa.
• Support files – tutaj można wrzucać funkcje, niestandardowe polecenia itp które mają być dostępne dla wszystkich plików testowych.

Test Runner

Miejsce do uruchamiania testów, jest tutaj wykaz wszystkich plików z danego miejsca w katalogu.
Możemy oczywiście wskazać żądane miejsce docelowe, by zmniejszyć ilość testów, lub też użyć zakładki Search by wyszukać konkretny scenariusz.

Wspierane przeglądarki to Canary, Chrome, Chromium, Electron. Jak widać brak jest pozostałej grupy przeglądarek Firefox, Safari, Edge czy IE 11.

Runner posiada trzy zakładki:
– Tests – lista testów do wykonania, użytkownik może sobie konfigurować które testy mają zostać przeprowadzone.
– Runs – sekcja która jest używana po podpięciu Cypress Dashboard. W tej sekcji będą widoczne testy które zostały nagrane.
– Settings – w tej zakładce  jest konfiguracja używana podczas testów, którą możemy oczywiście modyfikować za pomocą pliku cypress.json.

Jeżeli chcesz, poniżej oficjalne video ze strony cypress.io

Writing your first test with Cypress from Cypress.io on Vimeo.

W kolejnych wpisach pojawią się:

• przykładowe testy;
• napotkane w praktyce problemy;
• szerszy tutorial - odnośniki do cypress.io;