Il y a des moments où nous devons accéder à des éléments (généralement des textes) qui se trouvent dans des tableaux HTML. Cependant, il est très rare qu'un concepteur Web fournisse un attribut d'identifiant ou de nom à une certaine cellule du tableau. Par conséquent, nous ne pouvons pas utiliser les méthodes habituelles telles que "By.id ()", "By.name ()" ou "By.cssSelector ()". Dans ce cas, l'option la plus fiable est d'y accéder en utilisant la méthode "By.xpath ()".
Dans ce didacticiel, vous apprendrez-
Comment écrire XPath pour Table
Accéder aux tableaux imbriqués
Utilisation d'attributs comme prédicats
Raccourci: utiliser l'élément Inspect pour accéder aux tableaux dans Selenium
Comment écrire XPath pour Table
Considérez le code HTML ci-dessous.
Nous utiliserons XPath pour obtenir le texte interne de la cellule contenant le texte «quatrième cellule».
Étape 1 - Définir l'élément parent (tableau)
Les localisateurs XPath dans WebDriver commencent toujours par une double barre oblique "//", puis suivie de l'élément parent . Puisque nous avons affaire à des tables, l'élément parent doit toujours être la balise
. La première partie de notre localisateur XPath doit donc commencer par "// table".
Étape 2 - Ajouter les éléments enfants
L'élément immédiatement sous
est
donc nous pouvons dire que
est "l'enfant" de
. Et aussi,
est le "parent" de
. Tous les éléments enfants dans XPath sont placés à droite de leur élément parent, séparés par une barre oblique "/" comme le code ci-dessous.
Étape 3 - Ajouter des prédicats
L'élément
contient deux balises
. On peut maintenant dire que ces deux balises
sont des "enfants" de
. Par conséquent, nous pouvons dire que
est le parent des deux éléments
.
Une autre chose que nous pouvons conclure est que les deux éléments
sont frères. Les frères et sœurs font référence aux éléments enfants ayant le même parent .
Pour accéder au
auquel nous souhaitons accéder (celui avec le texte "quatrième cellule"), il faut d'abord accéder au deuxième
et non au premier. Si nous écrivons simplement "// table / tbody / tr", alors nous accèderons à la première balise
.
Alors, comment accéder au deuxième
alors? La réponse à cela est d'utiliser des prédicats .
Les prédicats sont des nombres ou des attributs HTML entourés d'une paire de crochets "[]" qui distinguent un élément enfant de ses frères . Puisque le
auquel nous devons accéder est le second, nous utiliserons "[2]" comme prédicat.
Si nous n'utilisons aucun prédicat, XPath accédera au premier frère. Par conséquent, nous pouvons accéder au premier
en utilisant l'un de ces codes XPath.
Étape 4 - Ajouter les éléments enfants suivants à l'aide des prédicats appropriés
L'élément suivant auquel nous devons accéder est le deuxième
. En appliquant les principes que nous avons appris des étapes 2 et 3, nous finaliserons notre code XPath pour qu'il ressemble à celui ci-dessous.
Maintenant que nous avons le bon localisateur XPath, nous pouvons déjà accéder à la cellule que nous voulions et obtenir son texte interne en utilisant le code ci-dessous. Il suppose que vous avez enregistré le code HTML ci-dessus sous le nom "newhtml.html" dans votre lecteur C.
Les mêmes principes décrits ci-dessus s'appliquent aux tables imbriquées. Les tables imbriquées sont des tables situées dans une autre table . Un exemple est présenté ci-dessous.
Pour accéder à la cellule avec le texte "4-5-6" en utilisant les concepts "// parent / enfant" et de prédicat de la section précédente, nous devrions être en mesure de trouver le code XPath ci-dessous.
Le code WebDriver ci-dessous devrait pouvoir récupérer le texte interne de la cellule à laquelle nous accédons.
La sortie ci-dessous confirme que l'accès à la table interne a réussi.
Utilisation d'attributs comme prédicats
Si l'élément est écrit profondément dans le code HTML de sorte que le nombre à utiliser pour le prédicat soit très difficile à déterminer, nous pouvons utiliser l'attribut unique de cet élément à la place.
Dans l'exemple ci-dessous, la cellule "New York à Chicago" est située profondément dans le code HTML de la page d'accueil de Mercury Tours.
Dans ce cas, nous pouvons utiliser l'attribut unique de la table (width = "270") comme prédicat. Les attributs sont utilisés comme prédicats en les préfixant avec le symbole @ . Dans l'exemple ci-dessus, la cellule "New York to Chicago" est située dans le premier
du quatrième
, et donc notre XPath doit être comme indiqué ci-dessous.
N'oubliez pas que lorsque nous mettons le code XPath en Java, nous devons utiliser le caractère d'échappement barre oblique inverse "\" pour les guillemets doubles des deux côtés de "270" afin que l'argument chaîne de By.xpath () ne se termine pas prématurément .
Nous sommes maintenant prêts à accéder à cette cellule en utilisant le code ci-dessous.
Raccourci: utiliser l'élément Inspect pour accéder aux tableaux dans Selenium
Si le numéro ou l'attribut d'un élément est extrêmement difficile ou impossible à obtenir, le moyen le plus rapide de générer le code XPath consiste à utiliser Inspecter l'élément.
Prenons l'exemple ci-dessous de la page d'accueil de Mercury Tours.
Étape 1
Utilisez Firebug pour obtenir le code XPath.
Étape 2
Recherchez le premier élément parent "table" et supprimez tout ce qui se trouve à gauche de celui-ci.
Étape 3
Préfixez la partie restante du code avec une double barre oblique "//" et copiez-la dans votre code WebDriver.
Le code WebDriver ci-dessous pourra récupérer avec succès le texte interne de l'élément auquel nous accédons.
By.xpath () est couramment utilisé pour accéder aux éléments de table.
Si l'élément est écrit profondément dans le code HTML de sorte que le nombre à utiliser pour le prédicat soit très difficile à déterminer, nous pouvons utiliser l'attribut unique de cet élément à la place.
Les attributs sont utilisés comme prédicats en les préfixant avec le symbole @.
Utiliser l'élément Inspect pour accéder aux tableaux dans Selenium
