Menu

Jak obsługiwać pasek przewijania w programie Selenium Webdriver

  • Główny
  • Inny
  • Jak obsługiwać pasek przewijania w programie Selenium Webdriver

how handle scroll bar selenium webdriver

Wypróbuj Nasz Instrument Do Eliminowania Problemów

Ten samouczek wyjaśnia paski przewijania, typy pasków przewijania i sposób obsługi paska przewijania w Selenium:

Pasek przewijania to cienka, długa sekcja na krawędzi wyświetlacza komputera. Korzystając z paska przewijania możemy przeglądać całą zawartość lub przeglądać całą stronę, przewijając myszką góra-dół lub lewo-prawo.

Najpierw zrozumiemy niektóre terminy, takie jak pokrętło, ścieżka i przyciski, które są używane w odniesieniu do pasków przewijania.

=> Sprawdź WSZYSTKIE samouczki dotyczące Selenium tutaj

jak usunąć element z tablicy w java

Obsługa paska przewijania w Selenium

W tym samouczku poznamy typy pasków przewijania. Przyjrzymy się również paskowi przewijania w HTML, zrozumiemy implementację kodu do obsługi paska przewijania w Selenium i wreszcie poznamy przykłady / aplikacje, w których paski przewijania są powszechnie używane.

Czego się nauczysz:

Zrozumienie pasków przewijania

Poniższy obraz przedstawia 2 rodzaje pasków przewijania:

typy pasków przewijania

Co to są pokrętła, ścieżki i przyciski

Paski przewijania mają guziki na obu końcach paska, którym może być przycisk do przodu i przycisk do tyłu dla poziomego paska przewijania oraz przycisk w górę i w dół dla pionowego paska przewijania.

Pokrętło to ruchoma część paska przewijania. Można go przesuwać w lewo-w prawo w przypadku poziomego paska przewijania oraz w górę iw dół w przypadku pionowego paska przewijania.

Tor to sekcja paska przewijania, po której można przesuwać pokrętło, aby wyświetlić całą zawartość.

Poniższy obraz jasno wyjaśnia koncepcję:

Pokrętło, ścieżka i przyciski

(wizerunek źródło )

Rodzaje pasków przewijania

rodzaje pasków przewijania

Zasadniczo istnieją 2 typy:

  • Poziomy pasek przewijania
  • Pionowy pasek przewijania

# 1) Poziomy pasek przewijania

Poziomy pasek przewijania umożliwia użytkownikowi przewijanie w lewo lub w prawo, aby wyświetlić całą zawartość okna.

poziomy pasek przewijania

Powyższy obrazek przedstawia poziomy pasek przewijania podświetlony na czerwono. Widzimy, że pasek przewijania można przesunąć od lewej do prawej lub odwrotnie, aby wyświetlić całą zawartość wyświetlaną na ekranie.

# 2) Pionowy pasek przewijania

Pionowy pasek przewijania umożliwia użytkownikowi przewijanie w górę iw dół lub odwrotnie, aby wyświetlić całą zawartość w oknie.

pionowy pasek przewijania

Powyższy obrazek przedstawia pionowy pasek przewijania podświetlony na czerwono. Widzimy, że pasek przewijania można przesuwać z góry na dół lub odwrotnie, aby wyświetlić całą zawartość wyświetlaną na ekranie.

Zwykle strony internetowe zawierają dużo treści i są dobrym przykładem pionowych pasków przewijania.

Pasek przewijania w HTML

Jest bardzo często używany w różnych witrynach internetowych, aplikacjach systemowych i prawie wszędzie. Umożliwia użytkownikom pełne przeglądanie zawartości strony poprzez przewijanie w górę-w dół lub w lewo-w prawo.

Poniższy obraz jest jednym z takich przykładów utworzonych w HTML:

scrollhtml

Zobacz poniższy kod HTML dla powyższego obrazu:

Scroll Bar #text { width: 200px; height: 200px; border: 1px solid; font-size: 30px; overflow: scroll; text-align: center; } Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World! Hello World!

W ten sposób możemy zobaczyć stronę Html, która podczas przewijania w dół i w górę za pomocą pionowego paska przewijania jest widoczna w całości.

Kod do obsługi paska przewijania w selenie

Selen obsługuje przewijanie na różne sposoby. Różne metody są następujące:

# 1) Korzystanie z wbudowanej opcji przewijania LUB przy użyciu klasy Actions

Przewijanie może być obsługiwane w Selenium za pomocą wbudowanej opcji przewijania, jak pokazano w poniższym kodzie implementacji:

Składnia paska przewijania przy użyciu wbudowanych opcji przewijania:

Actions act = new Actions(driver); //Object of Actions class act.sendKeys(Keys. PAGE_DOWN ).build().perform(); //Page Down act.sendKeys(Keys. PAGE_UP ).build().perform(); //Page Up

Kod do obsługi paska przewijania za pomocą wbudowanej opcji przewijania.

package SeleniumPrograms; import org.openqa.selenium.By; import org.openqa.selenium.Keys; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import org.openqa.selenium.interactions.Actions; public class Scroll { public static void main(String() args) throws InterruptedException { WebDriver dr = new FirefoxDriver(); dr.manage().window().maximize(); dr.get('https://opensource-demo.orangehrmlive.com/'); //testing webpage WebElement uname = dr.findElement(By.id('txtUsername')); //username uname.sendKeys('Admin'); WebElement pwd = dr.findElement(By.name('txtPassword')); //password pwd.sendKeys('admin123'); WebElement login_button = dr.findElement(By.xpath('//input(@id='btnLogin')')); login_button.click(); //login button WebElement admin = dr.findElement(By.id('menu_admin_viewAdminModule')); admin.click(); WebElement job = dr.findElement(By.id('menu_admin_Job')); job.click(); WebElement jobtitle_link = dr.findElement(By.linkText('Job Titles')); jobtitle_link.click(); Actions act = new Actions(dr); act.sendKeys(Keys.PAGE_DOWN).build().perform(); //Page Down System.out.println('Scroll down perfomed'); Thread.sleep(3000); act.sendKeys(Keys.PAGE_UP).build().perform(); //Page Up System.out.println('Scroll up perfomed'); Thread.sleep(3000); } }

W powyższym kodzie programu przewijanie jest obsługiwane w Selenium przy użyciu działania klasa. Odbywa się to poprzez utworzenie obiektu klasy Actions przez przekazanie sterownika. Widzieliśmy również użycie wbudowanej opcji przewijania do przewijania w górę, a także do przewijania w dół.

Wyjście powyższego kodu:

scrolldown1

(wizerunek źródło )

jak stworzyć pulpit nawigacyjny Jira

przewiń do góry

W ten sposób możemy zobaczyć operacje przewijania w dół i przewijania w górę wykonywane za pomocą Selenium Webdriver przy użyciu wbudowanej opcji przewijania LUB za pomocą działania metoda klasowa.

# 2) Korzystanie z JavascriptExecutor LUB przez Pixel

Ta metoda pomaga w przewijaniu strony internetowej, podając liczbę pikseli, o którą chcemy przewijać w górę lub w dół. Poniżej znajduje się kod implementacji Scrolling by Pixel lub przy użyciu JavascriptExecutor.

package SeleniumPrograms; import org.openqa.selenium.By; import org.openqa.selenium.JavascriptExecutor; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; public class ScrollBar { public static void main(String() args) throws InterruptedException { WebDriver dr = new FirefoxDriver(); dr.manage().window().maximize(); dr.get('https://opensource-demo.orangehrmlive.com/'); //testing webpage WebElement uname = dr.findElement(By.id('txtUsername')); //username uname.sendKeys('Admin'); WebElement pwd = dr.findElement(By.name('txtPassword')); //password pwd.sendKeys('admin123'); WebElement login_button = dr.findElement(By.xpath('//input(@id='btnLogin')')); login_button.click(); //loginbutton JavascriptExecutor js = (JavascriptExecutor)dr; js.executeScript('window.scrollBy(0,70)'); //Scroll Down(+ve) Thread.sleep(3000); System.out.println('Scrolled down..'); js.executeScript('window.scrollBy(0,-50)'); //Scroll Up (-ve) Thread.sleep(3000); System.out.println('Scrolled up..'); } }

Wyjście powyższego kodu:

scroll_down2

Powyższy obraz pokazuje przewijanie w dół wykonywane według wartości piksela, jak wspomniano w powyższym kodzie, o 70 (w dół). W ten sam sposób operacja przewijania w górę jest następnie wykonywana przez podanie wartości piksela = -50 (tj. W górę).

Poniższy obraz przedstawia przewijanie w górę (o 50):

scroll_up2

Dlatego w tej metodzie użyliśmy JavascriptExecutor i wykonaliśmy przewijanie w górę iw dół, podając wartości pikseli.

Przykłady / zastosowania

Istnieje wiele zastosowań lub przykładów pasków przewijania. Niewiele z nich jest takich, jak opisano poniżej:

# 1) Paski przewijania w plikach Excel:

Jak wiemy, pliki Excela zawierają ogromną ilość danych. Trudno jest wyświetlić całą zawartość na jednej stronie. W związku z tym przewijanie może pomóc użytkownikowi wyświetlić dane, których nie ma na bieżącym ekranie.

c pytania do wywiadu wraz z odpowiedziami pdf

pliki example_excel

# 2) Przewijanie w Notatniku

example_notepad

Na powyższym obrazku paski przewijania można zobaczyć poziomo i pionowo, zapewniając pełną widoczność danych w notatniku.

# 3) Korzystanie z paska przewijania w przeglądarkach

przykładowe_przeglądarki
Podczas odczytu danych na ekranie przeglądarki widzimy tylko połowę danych. Przewijanie pomaga poruszać się do przodu-do tyłu i do góry-w dół, aby uzyskać cały widok. W związku z tym, korzystając z poziomych i pionowych pasków przewijania, można wyświetlić całą zawartość ekranu przeglądarki.

Takich przykładów, które pomagają użytkownikom przeglądać pełne dane wyświetlane na ekranie, jest znacznie więcej.

Wniosek

W tym samouczku poznaliśmy paski przewijania, ich typy. Widzieliśmy również tworzenie i używanie paska przewijania w HTML Page

Zrozumieliśmy metody implementacji kodu obsługującego paski przewijania przy użyciu Selenium, tj. Wbudowaną opcję przewijania / użycie klasy akcji oraz wykorzystanie JavascriptExecutor / by Pixel i przeszliśmy przez kilka aplikacji, w których paski przewijania są powszechnie używane.

=> Przeczytaj cały przewodnik po Selenium

rekomendowane lektury

^