Testing

CodeceptJS – część 2 – uruchamianie współbieżne, page object pattern

Styczeń 21, 2020 0
Podziel się:

W poprzednim wpisie pokazałem jak zacząć pracę z CodeceptJS. Jeżeli jeszcze nie miałeś okazji z nim zapoznać się, zachęcam do czytania link. W dzisiejszym wpisie chce pokazać, jak zaimplementować page object pattern dla CodeceptJS oraz, jak skorzystać z kilku przydatnych funkcji, które są dostępne dla tego frameworka.

Czego dowiesz się z tekstu?

  • Jak zaimplementować page object pattern dla CodeceptJS?
  • Jak uruchomić testy współbieżnie?
  • Jak skorzystać z Data Table?

Zacznę od pokazania, w jaki sposób w CodeCeptJS możliwe jest uruchomienie testów współbieżnie. Kopiuje przypadek testowy, który utworzyłem w poprzednim wpisie i wklejam go cztery razy.  Robię to po to, żebym mógł pokazać Ci działanie współbieżności, a do tego potrzebne jest posiadanie więcej testów niż jeden. W kodzie prezentuję się to tak:

repeated tests - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Kolejnym krokiem jest zapisanie tego pliku i skorzystanie z parametru run-workers 5, który uruchomi testy w sposób współbieżny.

 codeceptjs minimum version node - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Co, jeżeli natrafimy na taki błąd?

W tym przypadku trzeba pobrać wyższą wersje Node JSa.

node js version higher - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Wybrałem drugą opcję. W moim przypadku jest to instalacja node js dla Windowsa. Po tym kroku uruchamianie testów w sposób współbieżny będzie działać.

Filmik jak działają testy współbieżnie w trybie headless z Puppeteerem:

codecept js parallel - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Jeżeli chciałbyś widzieć okno przeglądarki podczas egzekucji testów, to w ustawieniach codecept.conf.js parametr show trzeba zmienić na true. Domyślnie testy uruchamiane są w trybie headless.

Implementacja page object

Kod, który utworzyłem w poprzednim wpisie, w tym kroku dostosuje do page object pattern.  Potrzebuje zdefiniować metodę, która będzie wypełniała treścią formularz kontaktowy. CodeceptJS ma możliwość wygenerowania w prosty sposób page objectu dla określonej strony.

codecept own steps - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Przechodzę do konsoli. W tzw. „helpie” CodeceptJSa mam podpowiedź, że mogę użyć komendy codeceptjs gpo, która stworzy mi pusty page object. Po dodaniu pliku z page objectem przechodzę do dodania metody, która wypełni treścią formularz kontaktowy.

Ta komenda zawiera prosty konfigurator. Jestem pytany o to jak page object ma się nazywać. Nadałem nazwę contactFormPage następnie wybrałem gdzie ma znaleźć się mój page object. Zostawiłem domyślną ścieżkę „./pages/contactFormPage.js”. W tym miejscu CodeceptJS stworzy folder pages, jeżeli jeszcze go nie ma na dysku. Po stworzeniu mogę przejść do implementacji, którą będzie zawierał ten page object.

Następnie należy dodać page object do codecept.conf.js

codecept js include - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Teraz wracam do pliku contactFormPage.js i implementuje metodę, która będzie wypełniała formularz kontaktowy i go wysyłała. Rozpoczynam od dodania nazwy metody w tym wypadku będzie to fillForm(name, email, comment).

Metoda składa się z czterech linijek. Zaczynam od podania wartości dla pola Name, następnie przekazuje wartość pola Email oraz dla pola Comment. Metodę kończę wysłaniem formularza. Ktoś mógłby zapytać, czemu również asercji tutaj nie umieściłem? Uważam, że lepiej, gdy asercja znajduje się w samym kodzie testu, bo:

  • Od razu w teście widać co jest sprawdzane.
  • Nie trzeba wchodzić do implementacji metody.
  • Czasem nazwa metody może być myląca, a asercja odnosi się do czegoś innego.

codecept page object - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Przechodzę do contactForm_test.js, aby korzystać z page objecta potrzebuje w parametrze testu przekazać nazwę page objecta. scenario with page as parameter - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Gdy zdefiniowałem to w ten sposób, od tego momentu mogę korzystać z page objecta w tym teście. Test ma teraz trzy linijki zamiast wcześniejszych ośmiu. Jako parametry podaje wcześniej używane dane testowe. Zmiany dokonuje dla wszystkich skopiowanych testów.

Przydatne opcje

W ostatnim wpisie nie poruszyłem tego, w jaki sposób mogę debugować testy napisane w CodeceptJS. Jednym ze sposobów jest skorzystanie z interaktywnego shella. Żeby z tego skorzystać, używam komendy:

npx codeceptjs shell

Dzięki temu CodeceptJS otwiera okno przeglądarki i mogę przetestować każdą metodę CodeceptJS, która jest po  “I.”  w konsoli. W łatwy sposób sprawdzenie tego, czy kod będzie działał dla przeglądarki.

Innym sposobem na interaktywne debugowanie dla CodeceptJS jest dodanie “pause” pomiędzy akcjami. Ta komenda zatrzyma przeglądarkę i możemy sprawdzić, jak zachowuje się dany test.

codeceptjs debugging - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Dry – run pokazuje jakie testy zostaną uruchomione.

codecept dry run - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

CodeCeptJS – bardziej zaawansowany przykład

Tym razem przechodzę do bardziej zaawansowanego przykładu, bo będę korzystał z Data Driven Tests. Czyli możliwości tworzenia i korzystania z danych testowych w sposób dynamiczny.

login to account - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Test będzie polegał na:

  1. Wejście do ekranu logowania wordpressa.
  2. Podanie loginu do jednego konta.
  3. Podanie hasła do jednego konta.
  4. Zalogowanie się i sprawdzenie, czy nazwa użytkownika się wyświetla.

CodeceptJS zrobi to dla dwóch kont.

code codeceptjs - CodeceptJS – część 2 - uruchamianie współbieżne, page object patternPracę rozpoczynam od utworzenia nowego pliku. Nazwałem go checkAccounts_test.js implementacje rozpoczynam od dodania Feature w pliku z nazwą obszaru, do którego będą odnosić się testy. Kolejnym krokiem jest zdefiniowanie accounts, które korzystają ze struktury DataTable, która pozwala dla CodeceptJS umieszczać różnego rodzaju wartości np. dane do konta dla użytkowników. To, że w nazwie korzystam z @accounts to jest to sposób, w jaki definiuje się tagi dla CodeceptJS. Tagi pomagają grupować testy.

Przekazuje accounts do Data. Następnie przekazuje w scenariuszu wartość z “current”, który pozwoli pobrać wartość z date table.

Test zaczyna się od przejścia do panelu logowania wordpressa. Zrobiłem to, podając pełną ścieżkę. Oczywiście, gdybym zdefiniował domenę, mógłbym odwoływać się do ścieżki po /. Wypełniam pole login loginem, który znajduje się w current.login. W tym miejscu korzystam ze wpisywania wartości do selectora. Po tym kroku klikam przycisk “Continue”. Pojawia mi się pole password. W nie wpisuje hasło tego użytkownika.

Dodałem krok, który sprawdza, czy przycisk się pojawił. W tym przypadku jest to przycisk “Log In”. Klikam w niego i dodaję metodę I.waitInUrl(‘/me’,10), która pozwala czekać na pojawienie się określonej wartości w linku. Po tym kroku dodaję krok czekający na element I.waitForElement(‘.profile-gravatar__user-display-name’, 15), który jest odzwierciedleniem nazwy użytkownika wyświetlanym w dashbordzie . Test kończę dodaniem asercji, która sprawdzam, że ta wartość znajduje się na tej stronie.

Uruchamianie testów z tagiem

Jeżeli chcesz uruchomić jakąś pulę testów z określonym tagiem, możesz to zrobić za pomocą tej komendy:

codeceptjs run –grep @accounts

Popularne jest nadawanie tagów np. @slow dla wolniejszych testów, czy @basic dla podstawowych testów, które sprawdzają najważniejsze rzeczy.

Kod dostępny jest na GitHubie

https://github.com/testingplusme/IntroductionToCodeCeptJS/tree/second_artile_parallel_and_page_object

passed all tests codeceptjs - CodeceptJS – część 2 - uruchamianie współbieżne, page object pattern

Podsumowanie

W dzisiejszym wpisie przedstawiłem Ci, w jaki sposób można skorzystać w bardziej zaawansowany sposób z CodeceptJS. W relatywnie łatwy sposób możesz zaimplementować page object pattern, jak i również skorzystać z uruchamiania współbieżnego testów. Jeżeli lubisz javascript,  ten framework spokojnie możesz wdrożyć przy komercyjnym projekcie.

5 / 5
Tagi:
Kategorie: Testing
Michał Ślęzak
Autor: Michał Ślęzak
Michał Ślęzak – Developer Test Engineer w SII sp. z o.o – Automatyzacją testów zajmuję się od kilku lat. Prowadzi bloga - testingplus.me oraz jest jednym z liderów PTaQ.org, oraz podcastu TestingParrot jednego z pierwszych podcastów o testowaniu w Polsce. Pisał dla geek.justjoin.it / blog.testuj.pl / Programista Magazyn. Poza pracą lubi rozwój osobisty, czytać książki i oglądać seriale.

Imię i nazwisko (wymagane)

Adres email (wymagane)

Temat

Treść wiadomości

Zostaw komentarz