Test & Feedback – część 2 – narzędzie do testów eksploracyjnych

W poprzednim wpisie pokazałem wam czym Test & Feedback jest. Dzisiaj opowiem wam o nim w trybie Connected, który zawiera więcej możliwości. Szczególnie polecam ten wpis, jeżeli w firmie korzystacie z VSTS.

Czym jest VSTS?

Platforma firmy Microsoft, która zawiera w sobie:

  • Możliwość tworzenia repozytorium Gita (Jest możliwość dołączenia istniejącego repozytorium). TFVC jest wspierany.
  • Wspiera Agile, więc możemy dodawać zadania poprzez wbudowany kanban board.
  • Również zawiera w sobie wsparcie dla testów, o którym dziś chcę opowiedzieć.
  • CI / CD możliwość budowania aplikacji na wew.  lub zew. build serwerze.
  • Realesowanie paczek NPM czy NuGet packages.

Czym jest Test & Feedback?

Aplikacja pomagająca przeprowadzać proces testowania eksploracyjnego naszych aplikacji www (Jeżeli nie czytałeś pierwszego wpisu zachęcam link).

Jakie ma plusy Test & Feedback w trybie connected?

  • Tworzenie video z testów – jedno video maksymalnie 10 minut (Możemy załączyć video do naszego zadania).
  • Szybkie tworzenie przypadków testowych podczas sesji eksploracyjnej – jak wpadniemy na ciekawy pomysł możemy szybko go dodać.
  • Załączanie informacji z przeglądarki np. ile ładowała się strona.
  • Dodawanie błędów jako zadania.
  • Dodawanie zadań.

Czego potrzebujemy?

Test & Feedback

 

 

 

Tworzymy konto na stronie (Link). VSTS jest darmowy do 5 osób, więc jeżeli jesteście małą firmą lub sami chcecie nauczyć się tej platformy to zachęcam. Są ograniczenia, jeśli chodzi kwoty rocznego dochodu firmy w wersji bezpłatnej. Najlepiej skontaktować się z kimś z Microsoftu, jeżeli chcielibyście korzystać z VSTS komercyjnie w firmie.

 

 

Podstawowa konfiguracja projektu

Gdy się zalogujemy, wówczasz musimy podać adres url do naszego VSTS. W tym kroku również wybieramy, czy chcemy korzystać z Gita, czy z TFVC (System kontroli wersji stworzony przez Microsoft).

Test & Feedback

Przechodzimy do założenia teraz board przy naszym koncie VSTS.

Po założeniu boardu przechodzimy do instalacji pluginu. (Również Firefox jest wspierany)

https://chrome.google.com/webstore/detail/test-feedback/gnldpbnocfnlkkicnaplmkaphfdnlplb

W tym miejscu przechodzimy do dodania naszego adresu VSTS do pluginu Test & Feedback.

Klikamy na ikonę pluginu. Następnie wybieramy ustawienia i wprowadzamy adres naszego VSTSa.

 

Dashboard

Jeżeli chcemy mieć bardziej dostosowany do naszych potrzeb wygląd dashboardu możemy ułożyć go, tak jak nam pasuje.

Test & Feedback

 

W tym miejscu możemy nasz dashboard dostosować, tak aby wyświetlał dla nas informacje związane z testami.

 

Do boardu dodajemy przykładowe zadanie

Przechodzimy do naszego boardu (Work – > Backlog -> Stories -> Board)  gdzie mamy możliwość dodawania zadań i powiązanych z nimi testów.

Test & Feedback

Gdy dodaliśmy zadanie do naszego boardu możemy najechać myszką na to zadanie. W menu kontekstowym pojawia się opcja zrobienia sesji eksploracyjnej. Jeżeli klikniemy z tego miejsca nasz plugin, Test & Feedback będzie migać w obszarze pluginów w przeglądarce i automatycznie, gdy rozpoczniemy sesję powiążę ją nam z tym zadaniem.

 

Sesja eksploracyjne z Test & Feedback – Gdy nie chcemy łączyć jej z zadaniem

Oprócz łączenia naszej sesji z instniejącym już zadaniem możemy rozpoczać sesje bez zadania, a w razie potrzeby stworzyć je podczas sesji.

Przechodzę na testową stronę https://courseofautomationtesting.wordpress.com. Uruchamiam „play” w Test & Feedback.

Dalej przechodzę do formularza kontaktowego i wypełnieniu go podstawowymi, prawidłowymi danymi.

W tym miejscu możemy stworzyć test case z podstawowego wprowadzania danych. Dzięki tej możliwości możemy szybko dodać zadanie dla osoby, która ma zautomatyzować ten obszar.

Przechodzę do 

Automatycznie to, co klikałem i wprowadzałem podczas sesji będzie zmienione na test case, który możemy uruchamiać gdy załączymy nasz test case pod dany stories.

Gdy uruchomimy dany test case (Run Test) zostanie otwarty popup, który pozwala nam krok po kroku uruchamiać test.

Jest to wygodna forma realizowania test case’u.  Zrzuty ekranu, które są w popupie dodały się podczas, tego gdy stworzyliśmy test case. Test & Feedback sam je dodaje.

Dodawanie błędów przez Test & Feedback

Przyjmujemy scenariusz, że ikonka Instagrama, która znajduje się na testowej stronie, powinna przenosić do profilu tej strony, a nie do instagram.com. Po kliknięciu powinna otwierać ten link i przenosić do nowej karty, a nie otwierać link w bieżącej karcie.

Gdy dodajemy błąd możemy wpisać jego nazwę. Test &Feedback szuka, czy podobnego błędu nie dodał np. ktoś inny w systemie.

Gdy wykonujemy jakieś akcje automatycznie są one załączane jako zrzut ekranu:

  • Wpisywanie treści do pól.
  • Klikanie w określony element na stronie. Dodawana jest również ikonka celownika.

Tekst również jest dodawany, w zależności od tego, jaki to typ akcji był (w języku angielskim) np. Gdy klikamy w nagłówek –  Test & Feedback dodaje nam tę akcje jako „Click on” również jak wpisujemy, czy aktualizujemy tekst w polu jest on dodawany.

Observations – w tej sekcji dodał się czas ładowania strony instagram.com. W zgłoszeniu tego błędu raport jest również załączony. (Przydatna funkcja możemy od razu sprawdzić, czy strona nie ładuje się zbyt wolno.)

 

Gdy dodamy nasz błąd, będzie on widoczny w Session Timeline gdzie, po kliknięciu w nazwę przenosi nas do zgłoszenia tego błędu.

Tak jak widzimy automatycznie załączane są informacje na temat systemu, którego używamy, są one dość szczegółowe, więc przy trudno odtwarzalnych błędach może nam to pomóc.

Raport ładowania stron wygłąda tak:

Generuje się w htmlu. Jest możliwy do pobrania z zadania, które stworzyliśmy.

Czy warto korzystać z trybu Connected?

Connected jest znacznie bardziej rozwiniętym trybem od Standalone. Myślę, że Microsoft chce zachęcić nas do korzystania z VSTS.

Czy warto korzystać? Odpowiem – to zależy. Jeżeli korzystacie z Jiry i  wam się ona sprawdza, a nie korzystacie zbytnio ze stacku technologicznego Microsoftu – prawdopodobnie nie warto.

Warto na pewno, jeżeli korzystacie z VSTS w waszej firmie. Będziecie mogli użyć narzędzia, które pomoże wam w testach eksploracyjnych. Polecam samemu wypróbować i zdecydować. Tym bardziej, że jest dostępna pełnowartościowa, darmowa wersja do 5 osób.

Podsumowanie

W dzisiejszym wpisie dowiedzieliśmy się, w jaki sposób użyć Test & Feedback w trybie Connected, który pozwala nam na tworzenie jeszcze bardziej pełnych sesji eksploracyjnych. Zachęcam do spróbowania.

Jeżeli macie jakieś pytania zachęcam do kontaktu kontakt@testingplus.me.

 

Testing Parrot #1 – Podcast dotyczący testowania oprogramowania.

Testing Parrot – nowa idea podcastu związanego z testowaniem.

W dzisiejszym wpisie chce przedstawić Wam nasz (PTaQ.org) podcast, który skupiać będzie się na testowaniu oprogramowania, i tematach, które powiązane są w mniejszym lub większym stopniu. Pierwszy z naszych odcinków dotyczy:

  • Historii tego jak powstał PTaQ?
  • Rady dla osób, które myślą o założeniu swojego meetupu
  • Co zyskujemy, gdy prowadzimy własny meetup oraz dlaczego warto brać udział w meetupach.

 

Mamy już dwóch umówionych gości, więc zachęcamy do subskrypcji naszego podcastu na iTunes lub innym narzędziu do podcastów.

 

 

 

 

 

Test & Feedback przydatne narzędzie do testów eksploracyjnych część 1.

W dzisiejszym wpisie chce przedstawić wam narzędzie Test & Feedback, które przydaje się podczas sesji eksploracyjnych i uważam, że jest jednym z najlepszych narzędzi tego typu i do tego jest jeszcze bezpłatne.

Czym jest Test & Feedback?

Jest to aplikacja w formie pluginu do przeglądarki, pomagająca śledzić proces testowania eksploracyjnego naszych aplikacji www.  Wspieranymi przeglądarkami są:

  • Chrome
  • Firefox

Edge ma planowane wsparcie.

Przeglądarki Chrome lub Firefox :

Mamy dwie możliwości na uruchamianie Test & Feedback

  • Connected – Gdy chcemy podłączyć się do istniejącego konta Visual Studio Team Services warto, jeżeli korzystacie z niego w zespole, jeżeli nie, polecam tryb Standalone.
  • Stadalone – Opcja dla osób, które nie korzystają z Visual Studio Team Services. Gdzie po sesji eksploracyjnej tworzony jest raport htmlowy, który możemy dodać do naszego ticketu np. w Jirze. Opcja zawiera ograniczenia, ale możliwe tworzenie jest raportu htmlu z testów, który możemy załączyć.

Jakie plusy ma Test & Feedback?

Moim zdaniem znacznie wspiera nasze skupienie, podczas testów eksploracyjnych. Dodatkowo pozwala robić szybkie screenshoty wraz z podpisem co jest nie tak i generować raport z naszej sesji eksploracyjnej. Tworzony jest jasny raport z naszych testów (Wiem, że często może być to bolączka podczas testów eksploracyjnych, a są organizacje, które potrzebują mieć bardziej standaryzowany proces, więc to narzędzie może być odpowiedzią na to).

Czego nie zawiera tryb Standalone?

Nie mamy możliwości nagrywania video podczas testów:

Wiem, że nie wszyscy są wielkimi zwolennikami video z testu, czasami może to pomóc programiście uchwycić dany problem. Z drugiej strony dobrze udokumentowane screenshoty mogą pomóc jeszcze bardziej. W trybie Connected długość video maksymalnie może wynosić 10 minut.

Możliwości tworzenia test caseów, zadań podczas sesji eksploracyjnej:

Podczas naszej sesji w szybki sposób możemy dodać zadanie powiązane z naszą sesją eksploracyjną. Jeszcze bardziej przydatną opcją jest tworzenie test caseów z sesji eksploracyjnej, które mogą być w przyszłości używane do testów regresji i być zautomatyzowane.

Kolejną różnicą jest to, że w trybie connected mamy możliwość załączenia naszego raportu z testów do danego ticketu. W trybie standalone, jeżeli nie korzystamy z TFS Services możemy to zrobić poprzez załączenie naszego raportu w htmlu do ticketu w jirze lub innym narzędziu do prowadzenia projektów.

Brak możliwości załączenia czasu ładowania strony

Podczas testów możemy dodać informacje z przeglądarki o tym jak długo nasza strona ładowała się. Przydatne do szybkiego spojrzenia na wydajność. W trybie Standalone tej opcji nie mamy.

 

Dziś zaczniemy od opcji „standalone”, która potrafi mniej niż connected, ale nie wymusza na nas używania VSTS (Visual Studio Team Services).

Jak korzystać z Test & Feedback?

Udajemy się w naszej przeglądarce na stronę, która chcemy testować. W moim przypadku jest to jakiś czas temu postawiony testowy blog https://courseofautomationtesting.wordpress.com.

Następnie klikamy na plugin Test & Feedback.

W tym momencie nasza sesja testowa rozpoczeła się. Podczas, której możemy dodawać notatki pomiędzy poszczególnymi krokami.

Jak dodać notatki?

Dodawanie notatek podczas sesji.

Jak dodać błąd?

Dodawanie błędów polega robimy poprzez kliknięcie w  ikonę:Następnie w menu „Create bug”

Tworzenie błędu w Test & Feedback.

 

Jak dodać screenshot?

Sprawa jest prosta. Znowu rozpoczynamy naszą sesję testową klikając w przycisk „play”. Następnie klikamy w ikonę znajdującą się obok „Play”. Podczas nagrywania mamy kilka opcji dodawania screensotów:

  • Screenshot z przeglądarki
  • Screenshot z ekranu (nie tylko przeglądarka)
  • Screenshot z aplikacji
Narzędzie do testów eksploracynych

Dodawanie screenshota (Przeglądarki, Ekranu, Aplikacji).

Kilka opcji, które umożliwiają nam opisać w lepszy sposób screenshot.

Do screenshota mamy kilka opcji edycji go przed dodaniem do raportu.

Gdy zatrzymamy naszą sesję testową zostanie utworzony raport w htmlu z podsumowanie naszych testów.

 

Przykładowy raport

Przykładowy raport z Test & Feedback (tryb standalone).

Podsumowanie

Dzisiaj poznaliśmy narzędzie Test & Feedback, które rozwijane jest przez Microsoft. Poznaliśmy tryb Standalone dla osób, które nie korzystają z technologii Visual Studio Team Services. Również pokaże wam w jednym z następnych wpisów jak używać wersji connected i co ona zawiera.

 

 

Konferencja BeIT. Zapraszam na ciekawą konferencje w Gdańsku!

Zachęcam Was do uczestnictwa w konferencji organizowanej przez Koło Naukowe Zarządzanie IT, które działa przy politechnice Gdańskiej. Jakiś czas temu zaprosili mnie do zorganizowania warsztatów. Z tego powodu chce Was zaprosić do wzięcia udziału w moich warsztatach. Również zachęcam do innych ciekawie zapowiadających się prelekcji oraz warsztatów. Wydarzenie trwa aż 3 dni, więc jest wiele ciekawych wykładów, co ważne od praktyków.

Wstęp na wykłady jest darmowy. Jednak warsztaty są płatne. Koszt biletu wstępu wynosi 69zł dla studentów, dla pozostałych uczestników 129zł. Jest to kwota, która ma pokryć noclegi i podróż prelegentów.

Jeżeli jesteście z Gdańska lub termin Wam odpowiada – to zachęcam😊. Będzie szansa również porozmawiać w kuluarach. Jeżeli będziecie chcieli o coś spytać, zachęcam do podejścia. Możemy również umówić się mailowo na rozmowę.

Plan warsztatów:

  • Moje warsztaty będą od podstaw.
  • Chcę pokazać Selenium WebDrivera wraz z użyciem SpecFlow, a na koniec zintegrujemy nasz kod z build serwerem (CI).
  • Warsztaty będą w formie praktycznej szybkie wprowadzenie do potrzebnej teorii, następnie na kilku przykładach będziemy kroku po kroku ulepszać nasz kod.

Wymagania:

  • Podstawy C# – warto, żeby wiedzieć, czym jest Visual Studio.
  • Znać podstawowe konstrukcje programistyczne.

Link do wydarzenia

http://konferencjabeit.pl/

 

MŚ.

 

Applitools – Visual Regression Testing pierwsze narzędzie

W dzisiejszym wpisie chcę rozpocząć serię narzędzi, które pomagają w znajdywaniu regresji w obszarze wizualnym naszej aplikacji www. Czy zdarzyło się wam mieć sytuacje, że określony element źle wyświetlił się na produkcji? Im większymi aplikacjami się zajmujemy to takie sytuacje stają się częstsze. Przedstawię wam Applitools pierwszą aplikację z cyklu Visual Regression Testing.

Czy testy manualne nie wystarczą?

Nasze aplikacje www składają się często ze znaczącej liczby elementów tych, które są ważne dla biznesu. Narzędzia do regresji wizualnej mogą wspomóc testerów w procesie testowania. Trzeba również pamiętać, że te narzędzia porównują piksel po pikselu stronę, więc niektóre przesunięcia elementu mogą być trudne do zauważenia przez testera. Zauważmy również, że gdy zmieniamy znacznie layout strony to wyzwanie spada po części na barki testera. Narzędzie tego typu może mu pomóc. Testerzy mogą skupić się na bardziej przyjemnych i kreatywnych testach eksploracyjnych niż testy wizualnej regresji.

 

Applitools-Czym jest?

Jest to aplikacja, która pozwala nam wychwytywać regresję naszej strony dzięki ulepszeniu naszych testów funkcjonalnych w Selenium WebDriverze. Praktycznie w dowolnej technologii (Java, Appium, Python, Ruby, .NET, JavaScript). Oczywiście możemy sami tworzyć wiele asercji i porównywać jak nasza strona docelowa powinna wyglądać. Jednak w narzędziach do visual regression np. takim jak Applitools szybciej zrobimy to, zamiast tworzyć koło na nowo. Applitools (jako firma) wspiera wiele wydarzeń związanych z Selenium np. SeleniumConf.

Zalety

  • Możliwość integracji z praktycznie wszystkimi technologiami Integracja naszych dotychczasowych testów raz z Applitolsem zajmuje nie wiele czasu
  • Możliwość dokonywania screenshotów całych stron, nawet jeżeli strona zawiera bardzo długie artykuły, wpisy.
  • Szukanie wizualnej regresji w pomiędzy przeglądarkami.

Wady

  • Cena-Applitools jest dość, drogi, ale pozwala wykonać 100 testów w miesiącu za darmo oraz wspiera aplikacje Open Source.
  • Również wspierają startupy, więc posiadacie lub pracujecie w mniejszej firmie warto odezwać się do nich jest szansa, że będziecie mogli korzystać za darmo. Jest to jego największa wada.
  • W przyszłych częściach tej serii pokażę darmowe utrzymywane alternatywy.

Zaczynamy

Napiszemy prosty test w SpecFlow oraz Selenium WebDriver, który pokażę wam możliwości Applitoolsa.

Czego potrzebujemy?

  • Standardowo Visual Studio 2017
  • Kod znajdziecie na GitHubie link. Jedyną rzeczą, którą trzeba do niego dodać jest secret key z Applitools’a.
  • Założyć konto na applitools.com.

Zaczynamy od rejestracji na stronie applitools.com. Po rejstracji i zalogowaniu naszym oczom powinien ukazać się taki ekran

applitools

Dashboard Applitools

Przechodzimy do Visual Studio 2017

Tworzymy projekt typu Class Library. Następnie dodajemy potrzebne pakiety do NuGet’a.

  • SpecFlow
  • NUnit
  • Eyes
  • Selenium WebDriver
  • Chrome Driver

 

Następnie przechodzimy do naszego scenariusza. Scenariusz jest prosty składa się tylko z jednego kroku. Nie chce zaciemniać więc przykład jest zwięzły.

applitools

Scenariusz CheckVisualRegression.feature

Scenariusz polega na wejściu na stronę bloga. Przyjmujemy, że mamy dwa środowiska naszego bloga (Aby jak najbardziej odzwierciedlić komercyjną sytuację). Są to dwa testowe blogi, które mają wgrany ten sam motyw.

TestSettings wraz z dwoma URLami staging oraz production

 

SeleniumHooks wraz z metodami BeforeScenario oraz AfterScenario.

SeleniumHooks zawiera konstruktor przez, który wstrzykujemy obiekt typu IObjectContainer. Następnie korzystamy z metody BeforeScenario(), która zawiera ApiKey do Applitoolsa, który możemy wziąć z ustawień naszego konta.

My API Key

następnię definiujemy obiekty typu Eyes oraz IWebDriver do kontenera. W metodzie AfterScenario() usuwamy obiekty po scenariuszu.

Przechodzimy do klasy VisualRegressionSteps.cs

Klasa VisualRegressionSteps

Klasa ma zdefiniowane pole dla IWebDrivera, które pobiera obiekt z kontenera. W konstruktor wstrzykujemy obiekt typu IObjectContainer aby mieć dostęp do zarejestrowanych obiektów.

Metoda GivenIEnterToBlog(string envType)

Wyrażenie regularne dla metody GivenIEnterToBlog

Nad metodą korzystamy z zapisu (staging|production) to pozwala uniknąć błędu, jaki by mógł się zdarzyć poprzez np. pomylenie nazwy czy wpisaniu danej nazwy ze spacją. Następnie przechodzimy do  skorzystania z metody Eyes.Open jest to metoda, która przyjmuje obiekt Drivera, jaki mamy, nazwę testu, oraz to, w jakiej rozdzielczości chcemy zrobić nasz test.

Kolejnym krokiem jest sprawdzenie jakie środowisko jest obecnie w testach i ten adres przypisujemy do Driver.Url.

Metoda Eyes.CheckWindow(„Name of snapshot”) – dokonuje screenshota z określoną nazwą całego okna aplikacji, którą testujemy.

Eyes.CheckElement(By) – pozwala zrobić snapshot elementu z określonym selectorem. Pozwala nam to na wzięcie pod uwagę najważniejszy elementów i dzięki temu możemy szybko wyłapać ew. regresję.

Po dodaniu tego kroku przechodzimy do uruchomienia testów, a w zasadzie dwóch testów, bo korzystamy z Scenario Outline: i Examples:, które pozwalają przekazywać kolejne parametry i tworzyć kolejny test case.

Po uruchomieniu widzimy, że nasze testy zakończyły się błędem. Jest to spowodowane tym, że obie strony różnią się wizualnie.

Błąd zawiera link do testu.

Jak to możemy sprawdzić?

Przechodzimy do naszego dashboardu Applitoolsa. Lub poprzez link, który dostaliśmy w błędzie naszego testu.

Applitools dashboard

Aplikacja prezentuje nam ekran wraz z ostatnio uruchomionymi testami. W naszym przypadku są to dwa testy. Na fioletowo mamy zaznaczone różnice, które applitools znalazł pomiędzy obrazami. Oczywiście sami możemy definiować, jaką chcemy tolerancję procentową różnic akceptować.

Po wejściu w test mamy kilka ciekawych możliwości:

 

 

Po kliknięciu

Opcja pozwalająca podkreślić różnice wizualne.

 

Widzimy jeszcze bardziej podkreślone, które elementy różnią się pomiędzy stronami.

Widzimy również od razu, na jakim systemie został przeprowadzony test.

Ta opcja pozwala nam porównać różnice (jeżeli jakieś są) pomiędzy screenshotami tych samych elementów, ale pomiędzy innymi wersjami strony.

Przykład:

Dzięki temu od razu widzimy różnice pomiędzy stanami wizualnymi obu tych elementów.

Po wykonanym teście stan był „Unresolved” jednak były podkreślone różnice pomiędzy screenshotami. Oprócz automatycznego sprawdzania pomiędzy stronami. Sami dokonujemy approve lub nie dla danej różnicy wyglądu. Pozwala to potwierdzić czy aby na pewno zmiana wizualna, która się zadziała  jest regresją lub błędem.

 

Jakie zastosowania mogą być dla Visual Regression Testing?

  • Gdy chcemy porównać wygląd pomiędzy branchami. Pozwoli to uniknąć błędu takie jak zniknięcia jakiegoś przycisku.
  • Możliwość utworzenia testów, które będą sprawdzały najważniejsze elementy pomiędzy stagingiem oraz produkcją, czy aby wszystkie, które mają być na miejscu.
  • Również Applitools pozwala tworzyć screenshot całego ekranu, gdy skorzystam z opcji ForceFullScreenshot.

 

Podsumowanie

W dzisiejszym wpisie pokazałem wam, czym jest Applitools. Ten wpis ma rozpocząć serie pokazania kilku narzędzi tego typu. Jest to kolejny etap, który może pomóc nam wychwycić defekt przed klientem.

Zachęcam do spróbowania, również możliwość jest zintegrowania Applitoolsa z naszym procesem budowania aplikacji. W następnym wpisie opowiem o BackStopJS jednym z najlepiej rozwijanych frameworków do regresji wyglądu strony (visual regression testing).

 

Selenium WebDriver dodawanie pluginów na przykładzie AdBlocka

Selenium WebDriver dodawanie pluginów na przykładzie AdBlocka

Czy mieliście kiedyś wyzywanie sprawdzenia jak wasza strona, zachowuje się z np. AdBlockiem? Dziś chce wam pokazać, że dodanie tej wtyczki jest bardzo proste i praktycznie od zaraz możecie uruchomić z nią wasze testy.

Zaczynamy!

Czego potrzebujemy?

  • Visual Studio 2017
  • Chrome
  • Zainstalowany AdBlock w Chrome

Zaczynamy od znalezienia na naszym dysku AdBlocka. Powinien być on w takiej ścieżce:

C:\\Users\\<NameOfUser>\\AppData\\Local\\Google\\Chrome\\User Data\\Default\\Extensions\\<StringOfExtensions>\\<version>

  • <NameOfUser> – Nazwa waszego użytkownika
  • <StringOfExtensions> – ID interesującego nas pluginu
  • <version> – wersja interesującego nas pluginu

Pamiętajcie, że wersja pluginu, jeżeli macie ustawione  aktualizowanie  może się zmieniać i trzeba pamiętać o tym przy projektowaniu testów.

Jak poznać nazwę interesującego nas pluginu do w Chrome?

Jeżeli mamy zainstalowany dany dodatek jest to prosta sprawa.

Wpisujemy w pasek adresu  – chrome://extensions/

Zaznaczamy  checkbox „Developer mode”

 DeveloperMode dla pluginów Chrome

DeveloperMode dla pluginów Chrome

Dzięki temu zacznie być widoczne ID danego dodatku. Dla AdBlocka jest to:

DeveloperMode dla pluginów Chrome

ID (string) pluginu

Przechodzimy do Visual Studio

Stworzyłem projekt typu Class Library.

Dodawanie interesującego nas pluginu na przykładzie AdBlocka

Dodawanie interesującego nas pluginu na przykładzie AdBlocka

Zaczynamy od utworzenia obiektu typu ChromeOptions. Jest to klasa, która pozwala dodawać nam ustawienia, które chcemy dla uruchamianego przez nas ChromeDrivera.

Metoda AddArguments pozwala dodać  listę argumentów, które będą wczytywane wraz z załadowaniem Chrome.exe.  Używamy flagi load-extensions, która pozwala nam załadować plugin, który nas interesuje i nasza przeglądarka zostanie uruchomiona wraz z nim.

Po stworzeniu obiektu klasy ChromeOptions() przekazujemy go do naszego obiektu ChromeDrivera().

Następnie przechodzimy do zarejestrowania naszego obiektu w prostym kontenerze DI dla SpecFlow, nie jest to niezbędne, ale wiem, że często poszukujecie bardziej realnych przykładów na Context Injection w SpecFlow więc ten przykład również może pomóc wam zrozumieć idee.

Dodałem również klasę SeleniumHelper, która zawiera przydatną metodę CloseSecondTabFromPlugin(). AdBlock po dodaniu prezentuje swoją stroną na, które możemy dokonać dotacji dla nich. Potrzebujemy zamknać tą stronę.

W linijce [18] korzystamy z klasy WaitHelper, która ma zaimplementowane dynamiczne czekanie na zadany element dlatego, że korzysta z klasy WebDriverWait.

W tym przypadku czekamy maksymalnie 15 sekund (lub mniej, jeżeli jest element możliwy do znalezienia w krótszym czasie), na wczytanie się właściwości driver.WindowsHandles, która przechowuje informacje o oknach ChromeDriver’a.

Klasa WaitHelper z metodę Wait(), która zwraca obiekt typu WebDriverWait

 

ChromeDriver wraz z AdBlockiem

ChromeDriver wraz z AdBlockiem

Przykład również dostępny jest na moim GitHubie:

https://github.com/testingplusme/AddAdblockExampleToChromeDriver

Podsumowanie

Jak widzie w kilka minut jesteśmy w stanie uruchomić naszego ChromeDrivera z dodanym pluginem – takim jakim chcemy. Może być to dla was przydatne dla sprawdzenia, czy wszystkie elementy na stronie zachowują się prawidłowo również z dodanym AdBlockiem. Zdarza się, że AdBlock źle sklasyfikuje określony elementem. Innym scenariuszem jest sprawdzenie, jeżeli jesteście np. wydawcą treści czy skrypt, która macie do blokowania AdBlocka wyświetla się zawsze, wtedy kiedy powinien.

 

SpecFlow + Mailosaur = Łatwiejsze testowanie maili

Testowanie maili z SpecFlow i Mailosaur

Cześć, dawno mnie tu nie było. Pisałem ostatnio kilka wpisów dla testuj.pl również będą się tam pojawiać od czasu do czasu moje wpisy, więc zachęcam was do sprawdzania serii o SpecFlow (link).

Dzisiaj zajmiemy się tematem – testowaniem treści mail. Tworząc test automatyzujący akcje, które musielibyśmy zrobić.

Jak podejść do testowania automatycznego maili, które przychodzą na skrzynkę mailową?

W czystym Selenium jest to możliwe jednak nie, jest to proste jak z narzędziem, które pokażę wam dzisiaj.  Z pomocą przychodzi nam Maliosaur. Nie użyjemy dziś Selenium więc nasz test będzie testował funkcjonalne, ale poprzez dostęp do API Mailosaura, które ma napisanego klienta dla .NET-u (Stworzony został wrapper API dla .NET-u)

Testowanie automatyczne zapomnianego hasła lub innych mail z systemu? 

Naprawdę może być prostsze.

… 

 

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.