Menu

Comment gérer la barre de défilement dans Selenium Webdriver

  • Principal
  • Autre
  • Comment gérer la barre de défilement dans Selenium Webdriver

how handle scroll bar selenium webdriver

Essayez Notre Instrument Pour Éliminer Les Problèmes

Ce didacticiel explique les barres de défilement, les types de barres de défilement et comment gérer la barre de défilement dans Selenium:

La barre de défilement est une section mince et longue au bord de l'écran de l'ordinateur. En utilisant la barre de défilement, nous pouvons voir le contenu entier ou voir la page complète en faisant défiler vers le haut ou vers la gauche à droite à l'aide d'une souris.

Tout d'abord, comprenons certains termes tels que Knob, Track et Buttons qui sont utilisés en référence aux barres de défilement.

=> Consultez TOUS les tutoriels Selenium ici

comment lire un fichier utorrent

Gestion de la barre de défilement dans Selenium

Dans ce didacticiel, nous allons découvrir les types de barres de défilement. Nous allons également examiner la barre de défilement en HTML, comprendre l'implémentation du code pour gérer la barre de défilement dans Selenium, et enfin connaître les exemples / applications où les barres de défilement sont couramment utilisées.

Ce que vous apprendrez:

Comprendre les barres de défilement

L'image ci-dessous montre 2 types de barres de défilement:

types de barres de défilement

Que sont le bouton, la piste et les boutons

Les barres de défilement ont boutons aux deux extrémités de la barre qui peut être un bouton avant et un bouton arrière pour la barre de défilement horizontale et un bouton vers le haut et vers le bas pour la barre de défilement verticale.

Bouton est la partie de la barre de défilement qui est mobile. Il peut être déplacé de gauche à droite pour une barre de défilement horizontale et de haut en bas pour la barre de défilement verticale.

Pister est la section de la barre de défilement sur laquelle le bouton peut être déplacé afin d'afficher le contenu complet.

L'image ci-dessous explique clairement le concept:

Bouton, piste et boutons

(image la source )

Types de barres de défilement

types de barres de défilement

En gros, il existe 2 types:

  • Barre de défilement horizontale
  • Barre de défilement vertical

# 1) Barre de défilement horizontale

Une barre de défilement horizontale permet à l'utilisateur de faire défiler vers la gauche ou la droite pour afficher tout le contenu de la fenêtre.

barre de défilement horizontale

L'image ci-dessus montre une barre de défilement horizontale surlignée en rouge. Nous pouvons voir que la barre de défilement peut être déplacée de gauche à droite ou vice versa pour afficher le contenu complet affiché à l'écran.

# 2) Barre de défilement verticale

Une barre de défilement verticale permet à l'utilisateur de faire défiler vers le haut ou vers le bas ou vice versa pour afficher le contenu complet de la fenêtre.

barre de défilement verticale

L'image ci-dessus montre une barre de défilement verticale surlignée en rouge. Nous pouvons voir que la barre de défilement peut être déplacée de haut en bas ou vice versa pour visualiser le contenu complet affiché à l'écran.

Habituellement, les pages Web ont beaucoup de contenu et sont de bons exemples de barres de défilement verticales.

Barre de défilement en HTML

Il est très couramment utilisé sur différents sites Web, applications système et presque partout. Il permet aux utilisateurs de visualiser entièrement le contenu de la page soit par défilement haut-bas ou gauche-droite.

L'image ci-dessous est un exemple créé en Html:

scrollhtml

Voir le code Html suivant pour l'image ci-dessus:

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!

Ainsi, nous pouvons voir la page Html qui, lorsqu'elle est défilée vers le bas et vers le haut à l'aide d'une barre de défilement verticale, le contenu complet est visible.

Code de gestion de la barre de défilement dans le sélénium

Selenium gère les opérations de défilement de différentes manières. Les différentes méthodes sont les suivantes:

comment démarrer un projet java

# 1) Utilisation de l'option de défilement intégrée OU en utilisant la classe Actions

Le défilement peut être géré dans Selenium à l'aide d'une option de défilement intégrée comme indiqué dans le code d'implémentation ci-dessous:

La syntaxe de la barre de défilement à l'aide des options de défilement intégrées:

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

Code de gestion Barre de défilement utilisant une option de défilement intégrée.

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); } }

Dans le code de programme ci-dessus, le défilement est géré dans Selenium en utilisant Actions classer. Cela se fait en créant un objet de la classe Actions en passant le pilote. En outre, nous avons vu l'utilisation d'une option de défilement intégrée pour le défilement vers le haut ainsi que pour le défilement vers le bas.

La sortie du code ci-dessus:

scrolldown1

(image la source )

faire défiler

Ainsi, nous pouvons voir les opérations de défilement vers le bas et de défilement vers le haut effectuées à l'aide de Selenium Webdriver en utilisant une option de défilement intégrée OU en utilisant le Actions méthode de classe.

# 2) Utilisation de JavascriptExecutor OU par Pixel

Cette méthode aide à faire défiler la page Web en mentionnant le nombre de pixels par lequel nous souhaitons faire défiler vers le haut ou vers le bas. Vous trouverez ci-dessous le code d'implémentation pour Scrolling by Pixel ou en utilisant 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..'); } }

La sortie du code ci-dessus:

scroll_down2

L'image ci-dessus montre un défilement vers le bas effectué par valeur de pixel comme mentionné dans le code ci-dessus de 70 (vers le bas). De la même manière, l'opération de défilement vers le haut est ensuite effectuée en fournissant une valeur de pixel = -50 (c'est-à-dire vers le haut).

L'image ci-dessous montre un défilement vers le haut (par 50):

scroll_up2

Ainsi, dans cette méthode, nous avons utilisé JavascriptExecutor et effectué un défilement vers le haut et vers le bas en fournissant des valeurs de pixels.

Exemples / Applications

Il existe de nombreuses applications ou exemples de barres de défilement. Peu d'entre eux sont décrits ci-dessous:

# 1) Barres de défilement dans les fichiers Excel:

Comme nous le savons, les fichiers Excel contiennent une énorme quantité de données. Il devient difficile de visualiser l'ensemble du contenu sur une seule page. Par conséquent, le défilement peut aider l'utilisateur à afficher les données qui ne sont pas présentes sur l'écran actuel.

qu'est-ce que la planification et la stratégie de test

fichiers example_excel

# 2) Défilement dans le bloc-notes

example_notepad

Dans l'image ci-dessus, les barres de défilement peuvent être vues horizontalement et verticalement, offrant une visibilité complète des données dans le document Bloc-notes.

# 3) Utilisation de la barre de défilement dans les navigateurs

example_browsers
Lors de la lecture des données, nous ne pouvons voir que la moitié des données sur l'écran du navigateur. Le défilement permet de se déplacer d'avant en arrière et de haut en bas pour avoir la vue entière. Par conséquent, en utilisant des barres de défilement horizontales et verticales, le contenu complet de l'écran du navigateur peut être visualisé.

Il existe de nombreux autres exemples qui aident les utilisateurs à visualiser les données complètes affichées à l'écran.

Conclusion

Dans ce didacticiel, nous avons découvert les barres de défilement, leurs types. Nous avons également vu créer et utiliser la barre de défilement dans la page HTML

Nous avons compris les méthodes d'implémentation du code pour gérer les barres de défilement en utilisant Selenium, c'est-à-dire l'option de défilement intégrée / en utilisant la classe d'actions et en utilisant JavascriptExecutor / par Pixel et avons parcouru quelques applications où les barres de défilement sont couramment utilisées.

=> Lisez le guide complet du sélénium

lecture recommandée

^