Ramki w HTML, oznaczone tagiem iframe, nieco różnią się od takich typowych elementów jak input czy button. Dlaczego? Ponieważ umożliwiają osadzenie jednej strony internetowej wewnątrz innej.
Dzięki iframe mogę na przykład dodać filmy z YouTube’a na testelkowego bloga. Przykład możecie zobaczyć tutaj:
Spis treści
Lokalizacja elementów wewnątrz ramki
W przypadku elementów znajdujących się wewnątrz iframe, aby wejść z nimi w interakcję (np. kliknąć), nie wystarczy zbudować lokatora i wyszukać elementu. Potrzebujemy najpierw przełączyć się do ramki, a następnie z powrotem z niej wyskoczyć, gdy będziemy chcieli wrócić do głównego kontekstu.
Żeby Selenium wiedziało, do jakiej ramki chcemy się przełączyć, musimy jakoś tę ramkę namierzyć. Aby przełączyć się do ramki, możemy użyć takiej kombinacji:
driver.switchTo().frame()Metoda frame() pozwala na przekazanie różnych argumentów do zlokalizowania ramki. Możemy użyć atrybutu name lub id, wtedy przekazujemy po prostu Stringa. Możemy również przekazać indeks lub wyszukać ją jako WebElement i przekazać ten WebElement.
Wyszukiwanie ramki po indeksie
Najpierw skupimy się na wyszukiwaniu po indeksie, czyli określeniu numeru kolejności ramki, którą chcemy znaleźć (pamiętając, że numeracja zaczyna się od zera, czyli pierwsza ramka na stronie ma indeks 0).
driver.switchTo().frame(0);Musimy jednak pamiętać, że to podejście może stworzyć pewien problem: jeśli ramka nadal się ładuje, Selenium nie będzie czekać (ponieważ nie wie, na co ma czekać) i wybierze pierwszą ramkę, którą znajdzie podczas wyszukiwania. W konsekwencji, może to spowodować, że wybierzemy nie tę ramkę, którą chcieliśmy znaleźć.
Wyszukiwanie ramki po stringu
Drugą metodą na namierzenie ramki jest podanie w parametrze metody frame() stringa. Wtedy taki string może się odnosić zarówno do id jak i atrybutu name ramki.
driver.switchTo().frame("id_lub_name_ramki");Z tą metodą jedyny problem jest taki, że nie każda ramka ma atrybut id lub name.
Jednak nie wszystko stracone.
W takim przypadku możemy znaleźć ramkę za pomocą np. selektora CSS i przekazać już znaleziony WebElement do metody frame(). Taki przykład zobaczycie poniżej. Do wykonania testu użyłam aplikacji, którą możecie znaleźć tutaj. Ramki znajdują się w checkoucie, a konkretnie chodzi o pola związane z kartą, którą płacimy. Wszystkie trzy pola są w trzech osobnych ramkach. W tym przykładzie skupię się na polu z numerem karty.
Jednak mamy tutaj kolejny problem – ta ramka nie jest widoczna od razu. Na szczęście jest sposób żeby na tą ramkę poczekać:
Ten wait od razu się przełączy do ramki, więc nie zapomnijcie z niej wyskoczyć zanim zaczniecie wykonywać akcje w głównym kontekście aplikacji. Możecie to zrobić tą metodą:
driver.switchTo().defaultContent()Ramki: kilka słów na koniec
Elementy iframe są całkiem często używane na stronach internetowych, co może wpłynąć na nasze automaty. Wszystkie omówione wyżej metody przełączania się do ramek mają swoje wady i zalety, a wybór metody zależy od konkretnego przypadku. Ważne jest, aby pamiętać, że testowanie elementów iframe wymaga nieco innych rozwiązań niż testowanie np. buttonów.
Mam nadzieję, że któryś z tych sposobów szybko ułatwi Wam pisanie kolejnych automatów. Zdradźcie mi tutaj która metoda poszła na pierwszy ogień. 😈