Wybierz mnie, wybierz mnie! Czyli testy automatyczne aplikacji WWW. Część 2.

Wybierz mnie, wybierz mnie! Czyli testy automatyczne aplikacji WWW. Część 2.

W pierwszym poście z tej serii pokazaliśmy podstawowe możliwości Selenium WebDriver skupiając się głównie na wyszukaniu interesującego nas elementu i kliknięciu go bądź wpisania tekstu. Dzisiaj skupimy się na często używanych kontrolkach wyboru

W pierwszym poście z tej serii pokazaliśmy podstawowe możliwości Selenium WebDriver skupiając się głównie na wyszukaniu interesującego nas elementu i kliknięciu go bądź wpisania tekstu. Dzisiaj skupimy się na często używanych kontrolkach wyboru opcji. Demo przykładów HTML znajdziecie tutaj. Jedziemy!

Checkbox i Radio Button

W przypadku checkboxów i radiobuttonów robimy to analogicznie do poprzednio omówionych przykładów. Poszukujemy elementy za pomocą metody findElement(By by), a następnie najzwyczajniej w niego klikamy wołając metodę click(). Natomiast może nas interesować czy w ogóle taka akcja się powiodła. Posłuży nam do tego metoda isSelected(), która odpowiednio zwraca wartość logiczną TRUE lub FALSE.

Wybór z listy – Select

Jeśli naszym celem jest wybór opcji z listy, która jest zbudowana za pomocą zwykłego tagu select możemy wykorzystać funkcję dostarczaną przez Selenium, czyli obiekt klasy Select. Załóżmy, że mamy fragment HTML jak poniżej:

Do wybrania ineteresującej nas opcji będzie potrzebny nam tylko jeden lokalizator wskazujący na element select, a następnie na przykład widoczny tekst jednej z opcji.

Znajdujemy tutaj element select posługując się lokalizatorem będącym nazwą tagu. W kolejnym kroku tworzymy obiekt klasy Select, gdzie w konstruktorze podajemy nasz element. W tym momencie mamy dostęp do opcji, które zawiera. Wybór opcji odbywa się za pomocą metody selectByVisibleText(“Opel”), w której podajemy widoczny tekst danej opcji. To co możemy dalej sprawdzić to czy faktycznie wybraliśmy to, co chcieliśmy. Tutaj wykorzystamy metodę getFirstSelectedOption(), która pobiera pierwszą wybraną opcję – a dokładniej zwraca nam WebElement, z którego dalej możemy pobrać tekst.
Wyboru opcji możemy dokonać również za pomocą atrybutu value oraz jeśli znamy pozycję opcji na liście, za pomocą indeksu.

Wybór z listy – Dropdown

A co w sytuacji, gdy lista opcji nie jest zbudowany za pomocą tagu select? Może tak być w przypadku wykorzystania frameworka Bootstrap, gdzie do tworzenia odpowiednich kontrolek wykorzystywane są wbudowane style i JavaScript, na przykład:

Załóżmy, że będziemy chcieli wybrać opcję “Python”. Wykorzystując Selenium pobierzemy ten element metodą findElement(By by) i w niego klikniemy:

Niestety wykonanie takiej akcji zakończy się niepowodzeniem. Co prawda uda nam się odnaleźć wybraną opcję i utworzyć obiekt pythonOption natomiast w trakcie wykonania akcji kliknij zostanie rzucony wyjątek ElementNotVisibleException. Dzieje się tak, ponieważ tworząc test Selenium WebDriver powinien on być wykonywany wedle tych samych kroków, co w przypadku testu manualnego. Innymi słowy, element, który chcemy kliknąć musi być widoczny. Stąd też najpierw należy znaleźć i kliknąć przycisk do rozwinięcia listy, a dopiero później wybraną opcję. Temat możliwych wyjątków zostanie umówiony szerzej w innym poście.

Drag and Drop

Wybór opcji może odbywać się również przy pomocy dwóch list, gdzie z jednej na drugą przeciągamy interesujący nas element. W takim wypadku będziemy mogli wykorzystać gotową funckjonalność Selenium WebDriver. Jest to klasa Actions. Umożliwia ona między innymi wywołanie akcji podwójnego kliknięcia, przytrzymania kliknięcia,symulowania akcji klawiatury czy przesuwania elementów HTML. Nasz fragment strony to:

Naszym celem jest przeciągnać element z id draggable na element z id droppable. Wyszukujemy oba elementy posługując się ich identyfikatorami:

Teraz inicjalizujemy obiekt klasy Actions i wykonujemy kolejno metody:

  • dragAndDrop(element źródłowy, element docelowy) – metoda do wykonania akcji przeciągnij i upuść
  • build() – zbudowanie akcji
  • perform() – wykonanie akcji

Co dalej?

Przedstawione rozwiązania będą oczywiście działać przy założeniu, że elementy na listach są dostępne w kodzie źródłowym od razu po załadowaniu strony, lub ich ładowanie nie będzie trwać dłużej niż zdeklarowany czas w ustawieniach implicitWait dla WebDrivera. Innym ograniczeniem może być to, że listy są na tyle duże, że kolejne opcje doładowywane są dynamicznie, a same listy wymagają przewijania. Do obsługi tego typu list wykorzystuje się między innymi warunkowe oczekiwania na elementy lub wywołania JavaScript. Oba te dwa tematy wymagają jednak osobnego omówienia – a to już wkrótce 😉

author-image

Przemysław Górski

Automatyk testów aplikacji frontendowych. Obecnie odpowiedzialny za testy automatyczne aplikacji mobilnej jednego z największych banków w Polsce. Sympatyk technologii javowych. W wolnych chwilach szarpie struny gitary i bawi się muzyką.