PTAQ XLI – zapraszam na kolejne spotkanie ! trzy ciekawe wykłady

Witajcie.

Zapraszam Was na kolejne spotkanie Poznan Quality Assurance Group (PTAQ). Dla osób, które jeszcze nie słyszały czym zajmuje się nasza user group, polecam zapoznać się ze wpisem na temat kariery w IT, gdzie wspominałem czym jest PTAQ  (Kariera w IT? – Jak zacząć? Dla kogo? Cenne rady) oraz wspominałem w poprzednim zaproszeniu na nasze spotkanie (PTaQ XL – zaproszenie na 40 spotkanie).

Polecam zapisać się dlatego, że tym razem mamy ograniczoną ilość miejsc.

Kiedy? 25 kwietnia (wtorek), start: godz. 18:00
Gdzie? Fandom, ul. Baraniaka 6
Rejestracja: http://www.uczestnicy.pl/event/ptaq-xli

PTAQ XLI

Bez tytułu

źródło: „http://ptaq.org/ogloszenia/ptaq-xli-zaproszenie/”

 

Page Object Model CodeceptJS – jak używać wzorca?

Page Object Model CodeceptJS — jak używać wzorca?

Witajcie.

Dzisiaj chcę Wam przedstawić to, jak zaimplementować wzorzec Page Object Model w CodeCeptJS. Pisałem już kiedyś o tym, jak można zrobić to w C# (link). Tym razem zrobimy to w CodeCeptJS. Czym jest ten wzorzec, poruszałem również w tamtym wpisie dotyczącym C#, więc jeżeli go nie znacie, to zachęcam do zajrzenia do tego posta.

Czego potrzebujemy?

  • Projektu stworzonego według poprzednich części serii o codeceptjs
  • Visual Studio Code (lub inne IDE wspierające JS’a)
  • Stronę testową, do której będziemy pisać test

Zaczynamy

Przechodzimy do naszego ulubionego IDE. Następnie otwieramy terminal. W terminalu przechodzimy do katalogu, w którym znajdują się nasze testy.

Wpisujemy codeceptjs 

Podpowiada nam to jakie komendy możemy wykonać. Korzystając z helpa widzimy komendę:

codeceptjs gpo

page object model codeceptjs

Polecenie pozwala na stworzenie page objectu. Po wpisaniu tego polecenia ukazuje się nam pytanie, jak będzie nazywał się nasz page object. Następnie framework „pyta” gdzie chcemy umieścić plik. Jeżeli klikniemy enter, to wówczas umieści on go w folderze pages. Teraz musimy nasz page object zarejestrować w codecept.json, aby framework wiedział, gdzie ma szukać naszego page objecta. Przechodzimy do codecept.json. W include dodajemy parametr „homePage” wraz ze ścieżką, w której znajduję się nasz plik.

page object model codeceptjs

Kolejnym krokiem będzie dodanie kilku pól wraz z selectorami ze strony, którą testujemy. page object model codeceptjs

Wszystkie selectory, które dodałem przy polach, są css selectorami. Gdy dodamy interesujące nas obiekty, to przechodzimy do użycia ich. Pokażę Wam to na przykładzie z home_some_test.js.

Stworzyłem scenariusz, który robi prostą operację — wchodzi na stronę po „/” klika w przycisk, który ma css selector – „.red”.

Pamiętajcie, aby w scenariuszu przekazać interesujący Was obiekt jako parametr.

page object model codeceptjs

Zrzut ekranu 2017-04-11 o 20.36.57

Podsumowanie

W dzisiejszym wpisie pokazałem jak zaimplementować wzorzec page object model w codeceptjs. W następnych wpisach dowiemy się o kolejnych właściwościach tego frameworka.

 

Github student pack – Jeżeli jesteś studentem lub uczniem, to warto skorzystać.

Github student pack — Jeżeli jesteś studentem lub uczniem, to warto skorzystać.

Witajcie.

Studenci oraz osoby, które zaczynają swoją przygodę z IT, często pytają mnie m.in.: Jakich narzędzi używać? Jaki hosting git’a wybrać żeby kod nie był publiczny?

Dziś chcę właśnie przedstawić jedną z możliwości — jest nią github student pack.

Jest to inicjatywa GitHub’a, którą uruchomił w 2014 roku. Polega ona na tym, że kilkanaście firm, z których produktów na co dzień korzystają developerzy, udostępnia pomoce, które pomogą w starcie studentom/uczniom. Do inicjatywy dołączył m.in. Microsoft, Amazon, DigitalOcean. Dzięki temu studenci i uczniowie mogą uczyć się narzędzi uznanych dostawców technologii  za darmo (można postawić m.in. serwer vps lub CI na Travis CI oraz prywatne repozytorium na GitHubie).

Co zawiera student developer pack?

Student developer pack zawiera zbiór kilku narzędzi/dostępów/pomocy udostępnionych przez firmy, które zajmują się tworzeniem narzędzi, usług dla programistów. Przykładowymi korzyściami, które płyną z pozyskania tego dostępu, jest np. 50$, które pozwala na 10 miesięcy darmowego serwera VPS w najtańszym pakiecie lub 5 miesięcy mocniejszej maszyny. Jest to okres, w którym można (jeżeli jest się zaangażowanym) poznać dobre podstawy administrowania VPS, stawiania usług. DigitalOcena jest jednym z najlepszych dostawców serwerów VPS na świecie (jego klientami są m.in. Atlassian i Ericsson).

Lista wszystkich korzyści https://education.github.com/pack. Jest ich więcej niż te, które wymieniłem w tym wpisie. Polecam zaznajomić się z innymi.

github student pack

 

chrome_2017-04-04_20-53-54

Przykładowe korzyści

chrome_2017-04-04_20-54-01

Przykładowe korzyści

W jaki sposób zdobyć dostęp?

Trzeba być studentem lub uczniem, więc jeżeli spełniasz ten warunek, to załóż konto na github.com. Następnie zaloguj się, a GitHub w kolejnym kroku zweryfikuje czy jesteś studentem/uczniem.

Istnieją dwie możliwości weryfikacji:

  • mail w domenie .edu
  • dokument potwierdzający, że się uczysz (np. legitymacja szkolna/studencka)

Jeżeli posiadacie mail studencki w domenie .edu, to weryfikacja przebiega błyskawicznie. Jeżeli chodzicie np. do liceum i wysłaliście zdjęcie/skan swojej legitymacji uczniowskiej, to weryfikacja potrwa kilka dni.

Podsumowanie

Kolejny raz przedstawiam uczniom i studentom przydatne sposoby, dzięki którym mogą poznawać narzędzia, których używa się komercyjnie. Chcę, żeby wiedza o pomocach dla uczniów i studentów była łatwo dostępna. W kolejnym wpisie wrócę do tematu CodeceptJS i opiszę, w jaki sposób korzystać z page object pattern w tym frameworku.

 

CodeceptJS – interaktywny shell – Jak może pomóc w testach?

CodeceptJS – interaktywny shell – W jaki sposób może pomóc w testach?

Witajcie.

W poprzednim poście rozpoczynającym serię wpisów na temat CodeceptJS nauczyliśmy się jak stworzyć pierwszy test oraz w jaki sposób zainicjować projekt. Dziś zajmiemy się dalszymi aspektami poznawania CodeceptJS , którego używam do projektu testów w konkursie DajSiePoznać (link). Z dzisiejszego wpisu nauczymy się jak uruchomić CodeceptJS  w trybie interaktywnym (shell), dzięki czemu nasze testy będziemy mogli tworzyć szybciej. Tryb interaktywny pozwala bowiem szybko sprawdzić, czy nasz krok (czyli zapisana metoda po „I” np. I.click(‚element’)) uruchomia się oraz równocześnie zobaczyć efekt działania kodu. Rezultat działania testu widzimy szybciej niż przez codeceptjs run. Testy możemy pisać w taki sposób:

  • Wpisujemy metodę po metodzie w shellu
  • Jeżeli dany krok po „I.”  jest dobry to kopiujemy daną linijkę do testu w naszym IDE
  • Dzięki temu gdy jest błąd od razu wiemy w której linijce / kroku

Czego potrzebujemy?

  • Przygotowanego projektu tak jak w pierwszej części serii o codeceptjs (link)
  • Strony, na której będziemy pisać testy. (Ja wykorzystam stronę aplikacji, którą wystawił mi Bartek (link))
  1. Włączamy terminal.
  2. Przechodzimy do katalogu, w którym mamy testy.

codeceptjs      3. Następnie w terminalu używamy komendy:

codeceptjs shell

      4. Dalej wpisujemy metodę I.amOnPage(‚/) specjalnie z błędem, by zobaczyć jak framework się zachowa. Jak widzimy występuję błąd.

      5. Kolejnym krokiem jest wpisanie I.amOnPage(‚/’) metody, która przeniesie nas do do strony testowanej.

      6. Następnie używamy metody I.see(”), która pozwala sprawdzić, czy dany element jest widoczny na stronie.

      7. Po innych użyciach metody I.see(”). Używam metody I.click(‚.red’) dzięki temu, zostaje kliknięty przycisk MORE. Klikamy w selector „.red”, który ma przycisk MORE.

Zrzut ekranu 2017-03-26 o 21.08.59
Zrzut ekranu 2017-03-26 o 21.01.01

 

Zrzut ekranu 2017-03-26 o 21.03.14

 

 

Podsumowanie

Zatem w tym poście dowiedzieliśmy się, w jaki sposób możemy używać powłoki shell w naszych testach. Dzięki niej możemy krok po kroku sprawdzać rezultat z uruchomienia danego testu. Jest to szybki sposób, jeżeli chcemy „na szybko” sprawdzić, czy krok, który chcemy wykonać, przejdzie. W następnych częściach dowiemy się m.in. w jaki sposób używać wzorca Page Object Pattern oraz innych przełączników podczas uruchamiania testów.

 

PTaQ XL – zaproszenie na 40 spotkanie – Czym jest ptaq?

PTaQ XL – zaproszenie + Czym jest ptaq?

Jakiś czas temu zaangażowałem się w rozwój testerskiej społeczności w Poznaniu. Czy znacie PTaQ? (Poznan Quality Assurance Group). Jeśli nie to jest to najstarsza grupa testerska w Polsce, skupiająca pasjonatów testowania oprogramowania. Polecam śledzić ją za pośrednictwem fanpage’u (https://web.facebook.com/PTaQGroup/) lub poprzez stronę – www (link.)

Jak wyglądają spotkania PTaQ?

Każde ze spotkań ma podobną formułę:

  • Prezentowane są dwa wykłady/ dwie prezentację związane z temat testowania. Tematyka jest bardzo zróżnicowana – od filozoficznego podejścia do tej dziedziny po np. testowanie automatyczne. Uważam, że warto się pojawiać na takim spotkaniu nawet jeżeli wykład jest z innego obszaru testowania niż ten, którym zajmujemy się na co dzień, pozwala to rozszerzyć nam pogląd na tematykę testowania.
  • Po każdym z wykładów jest czas na zadawanie pytań prelegentom, a w międzyczasie na poznawanie innych osób z testerskiej społeczności.

Dziś chcę zachęcić was do przyjścia na kolejne spotkanie naszej społeczności. Jeżeli będziecie mieli jakieś pytania związane z grupą (i nie tylko) zapraszam do kontaktu.

„Zapraszamy na XL już spotkanie PTaQ! Tym razem wracamy do STX Next, gdzie będziemy mogli porozmawiać o automatyzacji oraz trochę o rozwijającym się trendzie jakim jest DevOps i Continuous Delivery.

Kiedy? 21 marca (wtorek), start godz. 18:00

Gdzie? STX Next, ul. Morawskiego 12/5″

źródło: ptaq.org

Podsumowanie

Jeżeli mieszkasz w Poznaniu lub masz do niego niedaleko to zachęcam do przyjścia. Dla osób spoza z Poznania polecam sprawdzić inne grupy/wydarzenia (http://testerzy.pl/wiesci-ze-swiata-testerow). W tekście (link) na temat kariery wspominałem jak grupy mogą wspierać rozwój umiejętności, karierę, więc polecam.

 

CodeceptJS testy akceptacyjne w przyjemny frameworku js.

CodeceptJS testy akceptacyjne w przyjemny frameworku js.

Witajcie,

Dziś chcę przedstawić przykład użycia framework’a w którym zdecydowałem się tworzyć swój projekt konkursowy. Testy do aplikacji typu mikroblog. Aplikację piszę Bartek (http://feree.net/) – również biorący udział w DajSięPoznać. Przy okazji czytania wiadomości na testerskim Slacku trafiłem na ten framework i właśnie w tym projekcie chcę go przetestować (Chyba, że z jakiegoś powodu jego możliwości będą mnie ograniczać to wówczas przejdę na Protractor’a). Aplikacja korzysta na fronendzie z Angulara, więc potrzebowałem frameworka radzącego sobie z nim lepiej niż czysty Selenium WebDriver.

Korzyści

  • Framework dostosowany jest do tzw. DSP (eng. Domain Specific Language) – czyli nasz kod testu posiada warstwę abstrakcji zrozumiałą w danym języku.  Przez to skupiamy się bardziej na scenariuszu dzięki czemu łatwiej analizuje się kod.
  • Testy piszemy jako użytkownik, każdy krok zaczynamy od „I.”-  pozwala to osobom postronnym lepiej zrozumieć scenariusz, który brzmi jak akcje, których dokonywalibyśmy na stronie a „pod spodem” danego kroku  „I.sth” znajduje się zaimplementowana akcja.
  • BDD – kładziemy nacisk na to jak ma się zachowywać system.

Wady

  • Jest to dość nowy framework więc mogą pojawić się czasami sytuacje nie wspierania danej funkcji.

Jak zacząć?

CodeceptJS posiada przyjemny konfigurator, który pozwala szybko stworzyć szkielet projektu. Zaczynamy od wejścia na stronę framework http://codecept.io/ . Polecam zapoznać się z jasno przedstawioną dokumentacją.

Do instalacji codeceptJS potrzebować będziemy node.js.

Po  instalacji node.js przechodzimy do terminala.

[sudo] npm install -g codeceptjs

instaluje globalnie codeceptJS

lub lokalnie

npm install –save-dev codeceptjs

Następnie po instalacji pakietu npm przechodzimy do terminala

codecepjs init  

Ta komenda utworzy nam szkielet projektu w ścieżce w której znajdujemy się aktualnie w terminalu. Aby dowiedzieć gdzie się aktualnie znajdujemy używamy polecenia pwd (w mac’u, powershell’u).

codeceptjs pyta się o folder w którym będziemy przechowywać nasze testy.

Następnie wybieramy  to jakiego helpera będziemy używać :

Ja wybieram Protractora

Wybieramy ścieżkę gdzie będziemy przechowywać output (logi, screenshoty)

Czy chcemy by utworzył folder ze stepami

Wybieram język angielski

Po skończonej konfiguracji również z terminala możemy dodać pierwszy test.

codeceptjs gt

Po wygenerowaniu testu możemy przejść do pisania kodu.CodeceptJS testy

Do pisania kodu w CodeceptJS wykorzystywał będę webStorm’a lub Visual Studio Code.

Przechodzimy w VSC – > Open -> folder exampleCodeceptJS

CodeceptJS testy

Do konfiguracji dodajemy helper Protractora. W czasie gdy czekałem na aplikacje do testów, którą tworzył Bartek, doszedłem do wniosku, że mogę zacząć pisać testy już do przykładowej strony aby zaznajomić się z frameworkiem. Jako przykład posłużył mi todomvc example, który posiada angulara na frontendzie. Url:

http://todomvc.com/examples/angularjs/

Polecam próbę na tej stronie.

Przechodzę do first_test.js

CodeceptJS testy

Metoda amOnPage(‚/’); przenosi do wybranej strony. CodeceptJS wie gdzie ma się udać, ponieważ url docelowy wzięty jest z pliku codecept.json

Przechodzimy do próby uruchomienia testów w terminalu, w folderze gdzie tworzyliśmy codeceptjs init:

codeceptjs run 

CodeceptJS testy

Naszym oczom ukazuje się błąd. I dobrze ;- ). Nasz WebDriver nie jest jeszcze uruchomiony. Aby to zrobić (musimy mieć go zainstalowanego) wpisujemy

webdriver-manager update

webdriver-manager start

update – po to by nasz server WebDriver’a był aktualny.

start – uruchamia server WebDriver’a.

Wracamy do polecenia :

codeceptjs run CodeceptJS testy

Nasze test uruchamia się. ; -)

Podsumowanie

Dziś dowiedzieliśmy się jak zainstalować codeceptJS, jak rozpocząć tworzenie testów tym frameworku. W kolejnych częściach będziemy pisać kolejne testy.

 

R# za darmo? Dla studentów i uczniów oraz inne oprogramowanie

R# za darmo? Dla studentów i uczniów

Czy znacie może firmę JetBrains? Jeśli nie, to jest to firma tworząca jedne z najlepszych środowisk do wytwarzania oprogramowania (IDE) oraz wtyczki do tych środowisk takie jak m.in. R#. Są to narzędzia dla najbardziej popularnych języków programowania m.in. C#, Java, Python, CSS, JS, Ruby.

Każdy kto rozpoczął już swoją przygodę z testowaniem automatycznym lub programowaniem mógł już słyszeć o JetBrains oraz ich produktach. Jeżeli nie to tym bardziej zachęcam do przeczytania wpisu, by móc się zapoznać z owymi narzędziami. Jeżeli tak jak ja chcecie tworzyć/tworzycie testy w C# to zachęcam do zapoznania się z wpisem Maćka Aniserowicza:

http://devstyle.pl/2008/04/27/c-via-r-czyli-11-powodow-do-uzywania-resharpera-part-i/

W skrócie R# pomaga m.in. w :

  • Refaktoryzacji kodu, robi się to szybciej i przyjemniej
  • Korzystania z testów (korzystających z popularnych runnerów np. NUnit)

Dziś chce przedstawić w jaki sposób zdobyć licencję firmy JetBrains za darmo do celów edukacyjnych.

Zaczynamy?

Przechodzimy do https://www.jetbrains.com/student/ następnie klikamy w „Apply Now”

Ukazuję się taka strona:

R# za darmo

Gdy dołączymy przez ten formularz możemy korzystać z R# oraz innych środowisk/pluginów:

chrome_2017-03-10_21-01-52

3 sposoby do uzyskania dostępu dla studenta/ucznia:

  • Jako student możemy zgłosić się za pomocą adresu mail z domeną .edu
  • Jako uczeń możemy załączyć skan naszej legitymacji z krótkim opisem
  • Za pomocą karty ISIC

 

Co jeżeli nie jesteś studentem?

Możliwości uzyskania R#/InteliJ są przynajmniej trzy:

  • https://confluence.jetbrains.com/display/ReSharper/ReSharper+Early+Access+Program
  • Okres testowy 30 dni
  • Często na różnego rodzaju user grupach np. .NETowych lub Javowych można otrzymać licencję typu personal. JetBrains bardzo mocna stara się wspierać również społeczności.

Oczywiście pamiętajcie, że owe licencje służyć mogą tylko i wyłącznie do celów edukacyjnych.

Podsumowanie

Dziś podzieliłem się z wami możliwością pozyskania narzędzi, których środowiska komercyjne stosują na co dzień.  Jest to drugi wpis na temat zdobywania wiedzy, oprogramowania za darmo. Tymi wpisami chce pokazać wam, że większość ograniczeń możemy pokonywać.

 

Page Object Model – Wzorzec, który ułatwi Wam implementowanie testów w Selenium WebDriver.

Page Object Model – Wzorzec, który jest nieodzowny w testowaniu automatycznym stron www.

Dzisiaj chcę przedstawić wam jeden z najbardziej podstawowych wzorców projektowych używany przy implementowaniu testów automatycznych. Pokażę jak w prosty sposób możecie go zastosować przy użyciu C# + Selenium WebDriver. Jeżeli ktoś z Was nie słyszał o tym wzorcu, dowie się jakie korzyści płyną z korzystania z niego w swoich testach. Przykład będzie prosty na tyle, na ile to jest możliwe.

Z tekstu dowiesz się m.in:

  • Jak budować testy, które będą łatwiejsze w utrzymaniu i implementowaniu ?
  • Jak zmniejszyć ilość duplikowanego kodu?

Czym jest Page Object Model?

 

 

folwer

 

Martin Folwer

źródło „ http://martinfowler.com/bliki/PageObject.html

Jest to sposób pisania testów polegający na tym, że każdą ze stron danej aplikacji webowej przedstawiamy jako tzw. Page object. Każdy z elementów na stronie, którą testujemy możemy przedstawić w naszej implementacji jako obiekt typu IWebElement (Może != Musi, jeżeli danego elementu znajdującego się na stronie, którą testujemy nie potrzebujemy w teście, to nie implementujemy go, by nie zaciemniać kodu).

Czego będziemy potrzebować do zdeklarowania naszego elementu w teście?

Do zdeklarowania elementu w teście potrzebujemy użyć tak jak przy deklaracji IWebElement – jakiegoś selectora. Do wyboru mamy:

  • XPath,
  • CssSelector,
  • Id,
  • Name,
  • Class,
  • PartialLinkText,
  • LinkText,

Pozwala to w jednym miejscu posiadać deklaracje obiektu IWebElement, który odpowiada elementowi na stronie. Jeżeli na stronie będzie dokonana jakaś zmiana np. selector Id przycisku zmieni się z „buttonId” na „buttonNewId” dzięki używaniu page object model – zmiany selectora dokonujemy w jednym miejscu.

Przykładowy obiekt:

[FindsBy(How=How.Id,Using = „user_login”)]

public IWebElement LoginField { get; set; }

Programista wprowadza zmianę  w html, od teraz element, który na stronie to selector user_login po zmianie to user_login_foo.  Gdy zamienimy user_login na user_login_foo to w testach w których wszędzie używaliśmy tego elementu zachodzą takie zmiany. Jeżeli nie używalibyśmy Page Object Model to w każdym teście gdzie używalibyśmy IWebElement z selectorem „user_login” trzeba byłoby zmienić na „user_login_cos”.

Po co stosować Page Object Model?

– Pozwala oddzielić logikę metod robiących akcje na stronie od reprezentacji elementów na stronie w postaci obiektów IWebElement

-Pozwala w łatwiejszy sposób zrozumieć abstrakcje związaną z pisaniem testów

-Pozwala łatwiej utrzymywać testy, jeżeli zmienia się selector na stronie np. poprzez zmianę układu strony to selector do elementu zmieniamy tylko w jednym miejscu. Jeżeli nie stosujemy Page Object Model to należy we wszystkich testach zmienić dany selector.

Przechodzimy do części napisania dwóch prostych testów, które będą korzystały ze wzorca page object model.

Co będzie Ci potrzebne?

  • Postawiona testowa strona wordpress.com.  -Ja użyję w tym celu swojego bloga, którego stworzyłem do pisania testów.(https://studytestingblog.wordpress.com/). Możesz również lokalnie postawić sobie takiego wordpressa.
  • Visual Studio

Dodane do projektu

  • ChromeDriver (przykładów nie testuje na innych driverach, więc może się zdarzyć, że kod z wpisów może inaczej się zachowywać na innych driverach).
  • Dodane przez NuGet’a:

page object model

Do projektu z testami dodaję folder Pages – Miejsce gdzie będziemy umieszczać nasze klasy z reprezentacją danego widoku na stronie.

pom3

Tworzymy plik klasy HomePage.cs

page object model

Sama klasa, którą użyje do testu wygląda tak:

  • Zaczynamy od definicji Driver, który jest/może być potrzebny do metod w Page’ach.
  • Następnie definiuje kilka elementów, które znajdują się na stronie.

https://studytestingblog.wordpress.com/wp-login.php

page object model

Aby stworzyć properites, który będzie odzwierciedlał element na stronie używamy:

[FindsBy(How= Tutaj wpisujemy jakiego selectora używamy  np. How.Id,Using = „tutaj wartość tego selectora np. user_login”)]

 LoginField  – properties, który reprezentuje pole służące do wpisywania loginu;

Selectory „zdobywamy” tak jak pokazywałem to w jednym ze wcześniejszych wpisów (link).

PasswordField – properties, który reprezentuje pole służące do wpisywania hasła;

SubmitButton – properties, który reprezentuje przycisk do wysłania formularza;

ErrorBox – propeties, który reprezentuje div’a zawierającego komunikaty o błędach (jeżeli jest na stronie np. gdy próbujemy zalogować się złym hasłem);

Po dodaniu propertiesów tworzymy konstruktor z parametrem.

Parametr jest typu IWebDriver. Powoduje to, że możemy przekazać każdy Driver, który implementuje interfejs IWebDriver. Gdybyśmy wpisali jako parametr ChromeDriver driver, zamiast IWebDriver driver to nie moglibyśmy w teście przekazać np. FirefoxDriver’a

this.Driver=driver;

Powoduje to, że nasz properties Driver będzie miał przypisaną referencje przekazanego driver’a, gdy stworzymy nowy obiekt typu HomePage.

PageFactory.InitElements(driver, this); <- Powoduje, że w konstruktorze inicjalizowane są elementy z tego Page’a. Gdybyśmy tego nie zrobili to test w miejscu gdzie używany byłby element z klasy HomePage rzuciłby błędem NullReferenceException dlatego, że element nie miałyby referencji.

pom5

Kolejnym elementem, który zaimplementujemy jest stworzenie metody odpowiadającej za logowanie do strony. Zmniejsza to ilość kodu w teście, łatwiej się go analizuje oraz nie trzeba w każdym teście pisać mechanizmu logowania.

Raz napisana metoda jest reużywalna w innych testach.

Metoda, którą napiszemy będzie zawierać:

Dwie właściwości, które są typu IWebElement (więc posiadają „po kropce” dostęp do metody SendKeys(„”);, odpowiadającej za wpisywanie znaków).

W parametrze będziemy przekazywać login i hasło.

Następnie po wpisaniu klikniemy w przycisk „Log In”  czyli w naszym przykładzie SubmitButton.Click();

Metoda jest typu DashboardPage i zwracamy return new DashboardPage(Driver);

logujemy się i test przenosi nas do Dashboard’u (Tak działa zalogowanie się do panelu admina w wordpressie).

pom6
devenv_2017-04-02_12-59-33

Po stworzeniu metody logującej tworzymy w folderze Tests folder Login. Dobre ułożenie testów po folderach pozwala zachować porządek w solucji. W folderze Login tworzymy klasę CheckLoginFunctionality.cs.  Stworzymy dwa testy, które sprawdzą w różnej konfiguracji:

  • Czy po zalogowaniu URL jest prawidłowy.
  • Czy gdy podamy złe hasło wyświetlany jest prawidłowy komunikat walidacyjny.

page object model

Testy zaczynamy od deklaracji zmiennej driver typu IWebDriver.

W setupie definiujemy zmienną driver typu ChromeDriver. Następnie przechodzimy do stworzenia w teście obiektu typu HomePage w parametrze przekazujemy obiekt driver.

CommonHelper.cs  – to klasa, która zawiera dwa properties’y. Jeden z loginem, drugi z hasłem do panelu administracyjnego.

Na końcu pierwszego testu znajduję się asercja sprawdzająca czy adres URL Driver’a jest taki jak oczekujemy po zalogowaniu. W drugim teście dodałem więcej asercji, żeby pokazać Wam jakie inne rzeczy możemy sprawdzać.

Assert.IsTrue(home.ErrorBox.Displayed) – sprawdza czy ErrorBox wyświetlił się.

Ostatnia asercja sprawdza czy komunikat walidacyjny jest prawidłowy znak po znaku.

W [TeardDown]

znajduję się metoda Close(), która zamyka po każdym teście przeglądarkę za pomocą driver.Dispose();

Próbujemy uruchomić nasz test. Testy wyświetlają się na zielono. Jednak gdy uruchamiam je drugi raz. Pojawia się błąd przy jednym z testów. Widać, że Selenium WebDriver zbyt szybko wpisuje tekst. Dodamy klasę WaitHelper.cs, która będzie zawierał metodę, która czeka na wpisanie przez selenium tekstu w pole.

Klasa WaitHelper.cs

page object model

Następnie tworzymy metodę statyczną WaitUntilElementValueEquals, która zawiera trzy parametry:

this IWebDriver driver – każdy obiekt, który implementuje IWebDriver ma dostęp do tej metody „po kropce”,

IWebElement element – element, który będziemy przekazywać i w nim sprawdzać czy wartość zdążyła się wpisać,

valueToCheck – przekazujemy tu tekst na, który będziemy czekać, aż się pojawi jako wartości w elemencie,

W pierwszej linii metody tworzymy obiekt typu WebDriverWait, który pozwala czekać za pomocą Selenium. Jako parametr potrzebuje jakiegoś driver’a, oraz TimeSpan.

Ostatnim krokiem jest wywołanie metody Unitl, która czeka w zadanym czasie na to by wartość atrybtu naszego elementu przekazengo w metodzie była równa z valueToCheck

Po stworzeniu metody dodajemy ją do klasy HomePage i metody LoginOnPage

pom8

Dodajemy naszą metodę. Uruchamiamy testy.

pom9

Podsumowanie

Dzisiaj dowiedzieliśmy się czym jest wzorzec Page Object Model. Zachęcam do wypróbowania tego u siebie.

MS.

 

Stało się… Start w konkursie „Daj się poznać”

Witajcie,

Wielu z Was prawdopodobnie słyszało o konkursie „Daj Się Poznać” (http://dajsiepoznac.pl)

Chcę spróbować w nim swoich sił i użyć również innych technologii niż te, których używam na co dzień.

Projekt będzie dotyczył testów UI :

Technologie, których zamierzam użyć to:

CodeceptJS,

Protractor,

Docker

Zachęcam do śledzenia bloga.