Selenium element positioning learning notes

Selenium element positioning

Summary of element positioning methods

Locate using ID

We take Baidu website as an example:

We conduct Baidu search test.

    @Test
    public void idTest() {
        //Use ID to locate, locate the input box, and enter Baidu.
        driver.findElement(By.id("kw")).sendKeys("Baidu once");
        //Locate with ID and click
        driver.findElement(By.id("su")).click();
    }

In the code, driver Findelement (by.id ("kw")) uses ID positioning, and "kw" is ID. sendKeys("...") is an input method that allows you to enter information into the input box.

click() method to simulate user clicking.

Locate using name

@Test
public void nameTest() {
    //Use name to locate, locate the input box, and enter Baidu.
    driver.findElement(By.name("wd")).sendKeys("Baidu once");
    
    //Locate with id and click
    driver.findElement(By.id("su")).click();
}

Use all linked text positioning

We use baidu home page to find the true question of the college entrance examination for testing, positioning and clicking.

@Test
public void linkTextTest() {
    //Use linkText to locate and click
    driver.findElement(By.linkText("True questions of college entrance examination")).click();
}

Use partial text positioning of links

@Test
public void linkTextTest() {
    //Use linkText to locate and click
    driver.findElement(By.partialLinkText("True topic")).click();
}

Locate using tag name

We locate the div tag output.

Because there are multiple div tags, you can use list to save them. And note: an s is added to findElements to locate multiple.

Use Class positioning

@Test
public void classTest() {
    driver.findElement(By.className("s_ipt")).sendKeys("Test test");
    //Locate with id and click
    driver.findElement(By.id("su")).click();

}

Locating using Xpath

Xpath positioning, the most commonly used positioning, is also a very powerful positioning.

Now let me try his magic.

Use absolute paths to locate elements

We continue to locate Baidu's input box, analyze the code, and use absolute positioning to test in the browser:

Code implementation:

@Test
public void xpathTest01() {
    driver.findElement(By.xpath("/html/body/div/div/div[5]/div/div/form/span/input")).sendKeys("Test test");
    //Locate with id and click
    driver.findElement(By.id("su")).click();

}

As you can see, it is troublesome to use absolute positioning, but sometimes it is very useful. Let's use relative positioning to test.

Use relative paths to locate elements

Relative paths use//

It can be found that we can write a lot less with the double slash, which is really convenient.

@Test
public void xpathTest01() {
    driver.findElement(By.xpath("//Form/span/input "). Sendkeys (" test test ");
    //Locate with id and click
    driver.findElement(By.id("su")).click();

}

//In fact, the expression means to search at all levels of the HTML document, so you can directly locate the form.

We can also optimize:

We know that we want to locate the input box directly. We locate the input box relatively. We select it through []. If a number is written, it is the positioning method of the index. Using the @ symbol, we can select its attribute, which is attribute positioning. For example, there are many class attributes in a tag, so using relative paths has great advantages.

For example, our positioning news:

Is it located?

Of course, we have located it. But don't worry. There are 6 in the lower right corner, which means that we have located the same 6 elements. We want to select the first news. We use the index mentioned above to locate it.

Let's first look at the code of relative positioning:

@Test
public void xpathTest02() {
    driver.findElement(By.xpath("//A[@class='mnav c-font-normal c-color-t'] "). Sendkeys (" test test ");
    //Locate with id and click
    driver.findElement(By.id("su")).click();

}

Use attribute positioning

Driver The @ symbol in findelement (by.xpath ("//a[@class='mnav c-font-normal c-color-t '])) uses attributes to locate.

It can be understood from the figures found elsewhere:

Use index positioning

In the positioning news above, driver Findelement (by.xpath ("//a[@class='mnav c-font-normal c-color-t '])) finds 6 elements. We can add [] numbers to achieve index positioning:

//a[@class='mnav c-font-normal c-color-t'][1]

It should be noted that the index does not start from 0, but from 1.

Use fuzzy attributes to locate elements

Fuzzy attributes use two functions:

starts-with()

//Img[starts with (@alt, 'div1')] means to find the element in the picture where the start position of the alt attribute contains the div1 keyword.

contains()

//img[contains(@alt, 'div1')] means to find the element in the picture where the alt attribute contains the div1 keyword.

@Test
public void xpathTest02() {
    driver.findElement(By.xpath("//img[contains(@alt,'div1')]"));
}

Element positioning using the Xpath Axis

xpath axis positioning is based on the relative position of elements in the document tree.

As shown in the figure.

Use the text of a page element to locate the element

//a[text() = 'news'] refers to the link element for finding news.

//a[contains(text(), 'Baidu')] means to find link elements containing news.

In xpath positioning, various methods can be combined.

Positioning using CSS

If you master xpath, you can skip this step.

Locate using JQuery

If you master xpath, you can skip this step.

Tags: Java

Posted by tomhilton on Mon, 30 May 2022 09:47:48 +0530