Выделение элементов в WebDriver во время выполнения

Ответ 1

Невозможно сделать это в WebDriver (начиная с версии 2.2.0.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];

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

Ответ 2

В webdriver
Создайте класс для элемента highligh 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"));)

Ответ 3

JavaScript: Найдите Xpath и нарисуйте вокруг него границу,

с помощью метода styleObj. setProperty (CSS propertyName, CSS propertyValue, priority). element_node.style.setProperty ("background-color", "green", null);

test js-code на этом сайте: 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');
}

Селен

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

Ответ 4

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

Класс WebDriverBackedSelenium выглядит так, будто он содержит большую часть RC api, к которой вы привыкли включать getEval

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

WebDriverBackedSelenium wdbs = new WebDriverBackedSelenium(driver, "http://www.google.com");

Ответ 5

Я использую ниже код для выделения в моем java-коде webdriver с помощью javascript-executer:

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

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

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

Ответ 6

Здесь приведен код для выделения элемента в селене: Сначала создайте класс:

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

Ответ 7

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

    }
}