Вопрос по selenium, java, webdriver – Подсвечивать элементы в WebDriver во время выполнения

15

Может кто-нибудь, пожалуйста, помогите!

Как выделить все веб-элементы в следующем классе во время выполнения теста в WebDriver? С Selenium RC все было довольно просто, но с WebDriver я борюсь.

Я был бы признателен, если кто-нибудь может предоставить мне некоторый код, который я могу попробовать, а также где этот код вписывается в класс ниже & # x2014; извините, мои навыки Java не так уж и хороши.

package hisScripts;
import java.util.concurrent.TimeUnit;
import org.testng.annotations.*;
import org.testng.Assert;
import static org.testng.Assert.fail;
import org.openqa.selenium.*;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.ie.InternetExplorerDriver;
import org.openqa.selenium.interactions.Actions;


public class R_LHAS_Only_Account_Verification extends HIS_Login_Logout{
    public WebDriver driver;
    public String baseUrl;
    public int exeMonth;
    private StringBuffer verificationErrors = new StringBuffer();

    @BeforeClass
    @Parameters ({"browser1", "url", "executionMonth"})
    public void setUp(String browser1, String url, int executionMonth) throws Exception {
        exeMonth = executionMonth;
        baseUrl = url;

        if (browser1.equals("FF")) {
            driver = new FirefoxDriver();
        } else if (browser1.equals("IE")){
            driver = new InternetExplorerDriver();
        }       
        driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);    
    }       

    @Test
    public void R_LHAS_Reports() throws Exception {
        R_LHAS_Only_Login(baseUrl, driver);
        Assert.assertEquals("Kingston upon Thames (RB)", driver.findElement(By.xpath("//html/body/div[9]/div/div[3]/div/div/div")).getText());
        Assert.assertEquals("Average price", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr/td")).getText());
        Assert.assertEquals("% price change", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[2]/td")).getText());
        Assert.assertEquals("Lower quartile price", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[3]/td")).getText());
        Assert.assertEquals("Time to sell (weeks)", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[4]/td")).getText());
        Assert.assertEquals("% asking price achieved", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[5]/td")).getText());
        Assert.assertEquals("House price to earnings ratio", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[6]/td")).getText());
        Assert.assertEquals("Cost of buying outright - LQ 2 bed £pw", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[7]/td")).getText());
        Assert.assertEquals("Private rent 2 bed £pw", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[8]/td")).getText());
        Assert.assertEquals("80% private rent 2 bed £pw", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[9]/td")).getText());
        Assert.assertEquals("Social rent 2 bed £pw", driver.findElement(By.xpath("//table[@id='tableId']/tbody/tr[10]/td")).getText());                 
        R_LHAS_Only_Logout(baseUrl,driver);
    }

    @AfterClass(alwaysRun=true)
    public void tearDown() throws Exception {
        driver.quit();
        String verificationErrorString = verificationErrors.toString();
        if (! "".equals(verificationErrorString)) {
            fail(verificationErrorString);
        }
    }   
}
В основном, когда тесты запущены, я хочу, чтобы элементы были проверены, подтверждены и т. Д. Проще говоря, я ищу эквивалент веб-драйвера для этого: selenium.getEval (& selen.browserbot.setShouldHighlightElement (true) & quot;); Это из селена RC, но я перенес свои тестовые сценарии на веб-драйвер. user929258
Без проблем. Когда вы говорите, выделите элемент, вы хотите имитировать пользователя, удерживающего мышь и фактически выделяющего этот элемент? AndyPerfect

Ваш Ответ

8   ответов
23

WebDriver (по состоянию на v2.21.0). Вы можете попробовать заменить обычныйfindElement(By) Метод с настроенным, который использует JavaScript для выделения найденного элемента:

// Draws a red border around the found element. Does not set it back anyhow.
public WebElement findElement(By by) {
    WebElement elem = driver.findElement(by);
    // draw a border around the found element
    if (driver instanceof JavascriptExecutor) {
        ((JavascriptExecutor)driver).executeScript("arguments[0].style.border='3px solid red'", elem);
    }
    return elem;
}

Теперь, когда у вас есть идея, есть улучшенная версия, которая восстанавливает оригинальнуюborder последнего элемента, когда новый найден и выделен:

// assuming JS is enabled
private JavascriptExecutor js = (JavascriptExecutor)driver;
private WebElement lastElem = null;
private String lastBorder = null;

private static final String SCRIPT_GET_ELEMENT_BORDER;
private static final String SCRIPT_UNHIGHLIGHT_ELEMENT;

void highlightElement(WebElement elem) {
    unhighlightLast();

    // remember the new element
    lastElem = elem;
    lastBorder = (String)(js.executeScript(SCRIPT_GET_ELEMENT_BORDER, elem));
}

void unhighlightLast() {
    if (lastElem != null) {
        try {
            // if there already is a highlighted element, unhighlight it
            js.executeScript(SCRIPT_UNHIGHLIGHT_ELEMENT, lastElem, lastBorder);
        } catch (StaleElementReferenceException ignored) {
            // the page got reloaded, the element isn't there
        } finally {
            // element either restored or wasn't valid, nullify in both cases
            lastElem = null;
        }
    }
}

И сценарии! Я загружаю их из файла, используяFileUtils.readFileToString().

SCRIPT_GET_ELEMENT_BORDER (IE дружественная версия взята с этого сайта), было бы намного короче, если бы он использовал выделение путем изменения цвета фона, скажем, только нижней границы. Но это самый хороший :).

/*
 * Returns all border properties of the specified element as String,
 * in order of "width style color" delimited by ';' (semicolon) in the form of:
 * 
 * "2px inset #000000;2px inset #000000;2px inset #000000;2px inset #000000"
 * "medium none #ccc;medium none #ccc;1px solid #e5e5e5;medium none #ccc"
 * etc.
 */
var elem = arguments[0]; 
if (elem.currentStyle) {
    // Branch for IE 6,7,8. No idea how this works on IE9, but the script
    // should take care of it.
    var style = elem.currentStyle;
    var border = style['borderTopWidth']
            + ' ' + style['borderTopStyle']
            + ' ' + style['borderTopColor']
            + ';' + style['borderRightWidth']
            + ' ' + style['borderRightStyle']
            + ' ' + style['borderRightColor']
            + ';' + style['borderBottomWidth']
            + ' ' + style['borderBottomStyle']
            + ' ' + style['borderBottomColor']
            + ';' + style['borderLeftWidth']
            + ' ' + style['borderLeftStyle']
            + ' ' + style['borderLeftColor'];
} else if (window.getComputedStyle) {
    // Branch for FF, Chrome, Opera
    var style = document.defaultView.getComputedStyle(elem);
    var border = style.getPropertyValue('border-top-width')
            + ' ' + style.getPropertyValue('border-top-style')
            + ' ' + style.getPropertyValue('border-top-color')
            + ';' + style.getPropertyValue('border-right-width')
            + ' ' + style.getPropertyValue('border-right-style')
            + ' ' + style.getPropertyValue('border-right-color')
            + ';' + style.getPropertyValue('border-bottom-width')
            + ' ' + style.getPropertyValue('border-bottom-style')
            + ' ' + style.getPropertyValue('border-bottom-color')
            + ';' + style.getPropertyValue('border-left-width')
            + ' ' + style.getPropertyValue('border-left-style')
            + ' ' + style.getPropertyValue('border-left-color');
}
// highlight the element
elem.style.border = '2px solid red';
return border;

SCRIPT_UNHIGHLIGHT_ELEMENT

var elem = arguments[0];
var borders = arguments[1].split(';');
elem.style.borderTop = borders[0];
elem.style.borderRight = borders[1];
elem.style.borderBottom = borders[2];
elem.style.borderLeft = borders[3];

Любые вопросы, замечания, пожелания и улучшения приветствуются!

Хорошо, теперь метод сохраняет исходное значение границы найденного элемента и восстанавливает его, когда новый элемент подсвечивается. Надеюсь, я наконец-то закончил с правками (как я не могу придумать никаких других улучшений) :).
Спасибо, Сленс, я попробую, когда завтра вернусь на работу. Действительно ценю союзника за усилия по доработке сценария :) user929258
@Slance - Спасибо за это! Извините за мое невежество, но где бы я назвал приведенный выше код в моем классе? user929258
... написано через две недели или около того. Я закончил тем, что использовал это, таким образом, я настраивал это все больше и больше, и это наконец стало этим. Он был стабильным в течение недели, и никаких дальнейших улучшений на данный момент не планируется, поэтому я публикую его для будущих читателей и для надежного использования :).
Вместоdriver.findElement()можно просто позвонитьfindElement() Теперь, если вы добавите это в свой класс. Или назовите это любым другим подходящим способом :).
0

представленный ранее в этой теме.

public static WebDriver HighlightElement(WebDriver driver, WebElement element){ 
    if (driver instanceof JavascriptExecutor) {
        ((JavascriptExecutor)driver).executeScript("arguments[0].style.border='3px solid red'", element);
    }
    return driver;
}
public static WebDriver UnhighlightElement(WebDriver driver, WebElement element){   
    if (driver instanceof JavascriptExecutor) {    
        ((JavascriptExecutor)driver).executeScript("arguments[0].style.border=''", element);
    }
    return driver;  
}

Вызовите эти две функции один раз, чтобы выделить, и один раз, чтобы выделить

5

В вебдрайвере
Создать класс для элемента подсветкиHighlightElement

HighlightElement.java

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebElement;

import com.project.setup.WebDriverManager;

public class HighlightElement {

    public static void highlightElement(WebElement element) {
        for (int i = 0; i <2; i++) {
            JavascriptExecutor js = (JavascriptExecutor) WebDriverManager.driver;
            js.executeScript("arguments[0].setAttribute('style', arguments[1]);", element, "color: yellow; border: 2px solid yellow;");
            js.executeScript("arguments[0].setAttribute('style', arguments[1]);", element, "");
            }
        }
}

Ты можешь использовать

HighlightElement.highlightElement(driver.findElement(By.xpath("blaah blaah"));)

выделить WebElement с помощью xpath & quot;blaah blaah& Quot; в вашем тесте.

Спасибо за ваш пример кода! Но я получаю сообщение об ошибке, включая WebDriverManager через maven3:[ERROR] /home/leder/Projekt/Selenide/google_test/src/test/java/de/auticon/selenide/google_test/HighlightElement.java:[17,74] cannot find symbol [ERROR] symbol: variable driver [ERROR] location: class io.github.bonigarcia.wdm.WebDriverManager
0

айвера с использованием javascript:

// Я делаю вызов ниже функции & quot; flash & quot;

    public static void flash(WebElement element, WebDriver driver) {
        JavascriptExecutor js = ((JavascriptExecutor) driver);
        String bgcolor  = element.getCssValue("backgroundColor");
        for (int i = 0; i <  3; i++) {
            changeColor("rgb(0,200,0)", element, js);
            changeColor(bgcolor, element, js);
        }
    }
    public static void changeColor(String color, WebElement element,  JavascriptExecutor js) {
        js.executeScript("arguments[0].style.backgroundColor = '"+color+"'",  element);

        try {
            Thread.sleep(20);
        }  catch (InterruptedException e) {
        }
     }

Надеюсь, что помогло :)

2

JavaScript : Find Xpath изэлемент и нарисуйте границу вокруг него,

using styleObj.SetPropertyМетод CSS propertyName, CSS propertyValue, priority. element_node.style.setProperty ("background-color", "green", null);

test js-code on this site : https://developer.chrome.com/devtools/docs/console

var xpath = '//html/body/div/main/article/nav';
if (document.evaluate){
var element_node = document.evaluate(xpath, window.document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ).singleNodeValue;
element_node.style.setProperty ('border', '3px solid green', 'important');

alert('Working Fine in this browser version');
}else{
alert('document.evaluate is Not supported by Internet Explorer');
}

Selenium

public static void drawBorder(WebDriver driver, String xpath){
        WebElement element_node = driver.findElement(By.xpath(xpath));
        JavascriptExecutor jse = (JavascriptExecutor) driver;
        jse.executeScript("arguments[0].style.border='3px solid red'", element_node);
    }
1

Сначала создайте класс:

package com.demo.misc.function;

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;

public class Miscellaneous 
{
    public static void highLight(WebElement element, WebDriver driver)
    {
        for (int i = 0; i <2; i++) 
        {
            try {
                JavascriptExecutor js = (JavascriptExecutor) driver;
                js.executeScript("arguments[0].setAttribute('style', arguments[1]);", element, "color: black; border: 4px solid red;");
                Thread.sleep(500);
                js.executeScript("arguments[0].setAttribute('style', arguments[1]);", element, "");
                Thread.sleep(500);
            } catch (InterruptedException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }

        }

    }

}

И тогда вы можете позвонить по этому адресу:

driver.get(baseUrl);
            Thread.sleep(2000);
            WebElement lnkREGISTER = driver.findElement(By.linkText("REGISTER"));
            Miscellaneous.highLight(lnkREGISTER, driver);
            lnkREGISTER.click();
0

но похоже, что в Selenium WebDriver существует класс, который должен предоставить вам доступ к большинству, если не ко всем, RC API. Я не знаю, как на самом деле сделать это с помощью WebDriver.

КлассWebDriverBackedSelenium похоже, он содержит большую часть RC API, к которому вы привыкли включатьgetEval

Чтобы создать объект типаWebDriverBackedSeleniumпросто укажите драйвер, который вы уже использовали, в дополнение к базовому URL вашего сайта тестирования

WebDriverBackedSelenium wdbs = new WebDriverBackedSelenium(driver, "http://www.google.com");
Да, на данный момент нет такой возможности с использованием WebDriver без какого-либо JavaScript. Тем не менее, это может просто работать как задумано.
Обратите внимание, что этот ответ является временным. Я буду продолжать осматриваться, чтобы увидеть, возможно ли это с использованием строго WebDriver
-1
public class JavaExecutor {

public static void highlighElement(WebDriver driver,WebElement element)
{
    JavascriptExecutor js=(JavascriptExecutor)driver; 
    js.executeScript("arguments[0].setAttribute('style', 'background: yellow; border: 2px solid red;');", element);

    try 
    {
    Thread.sleep(1000);
    } 
    catch (InterruptedException e) {

    System.out.println(e.getMessage());
    } 

    js.executeScript("arguments[0].setAttribute('style','border: solid 2px white');", element); 

    }
}

Похожие вопросы