Selenium-WebDriver如何使用javascript和firefox浏览器突出显示元素

时间:2016-08-17 10:26:09

标签: javascript node.js firefox selenium-webdriver highlight

我在创建有效功能方面存在问题,该功能将突出显示网页上的某些已定义元素。请注意,我是编码初学者,问题可能是简单的环境设置问题,或者缺乏对javascript / selenium功能的主要了解。

我在Eclipse Neon中创建了我的脚本。要设置一个环境,我已经安装了node.js和geckodriver,以便能够在firefox浏览器上运行。我的脚本的开头是:

var webdriver = require('selenium-webdriver'),
    By = webdriver.By

var driver = new webdriver.Builder().forBrowser('firefox').build();

我使用driver.get();打开网页,然后我只使用xPath ex。来定义元素位置:

var element = driver.findElement(By.xpath("xPath goes here"));

现在问题开始了,我该怎么做才能让WebDriver用ex来突出显示这个指定的元素。红色边框?在浏览Stack和其他类似页面时,我发现的唯一答案是在Java语法中使用JavaScript Executor,或使用

的一些webdriver函数。
element.style.backgroundColor = 'red'

但是我得到了控制台错误,style或语法的其他部分不是函数。在这一点上,我没有解决方案如何实现这一点,我慢慢地怀疑,我将能够在没有html5 / java知识的情况下完成这项任务。也许有人遇到过这样的困难并且会分享线索吗?

https://jsfiddle.net/osav574j/< - 我已经编写了简单版本的脚本,可能会让您了解我的完整代码的样子。突出部分可能是错误的,它只是向您展示,我认为它可能如何完成,但这是纯粹的假设。

干杯! Perkele

3 个答案:

答案 0 :(得分:2)

您应该尝试使用executeScript(),如下所示: -

var element = driver.findElement(By.xpath("xPath goes here"));
driver.executeScrip‌t("arguments[0].style.backgroundColor = 'red'", element);

答案 1 :(得分:0)

这是突出显示元素的Javascript代码。 Selenium没有任何本地方法可以突出显示,因此唯一的出路是使用类似于此的代码:

JavascriptExecutor js=(JavascriptExecutor)driver;
js.executeScript("arguments[0].setAttribute('style,'border: solid 2px red'')", username);

此处用户名是webelement的名称。

答案 2 :(得分:0)

这是一个使元素闪烁的解决方案,其中一个示例是使google搜索输入字段闪烁。您可以参数化眨眼样式以及时间间隔/频率。

const browsertype = 'chrome';
//const browsertype = 'firefox';
const { Builder, By, Key, until} = require('selenium-webdriver');
require( browsertype + 'driver' );
//require('selenium-webdriver/' + browsertype);
const link = 'https://www.google.hu/';
const btx = '//input[@name="q"]';

var browser = new Builder().forBrowser( browsertype ).build();

browser.navigate().to( link );
//browser.get( link );

var element = browser.findElement( By.xpath( btx ) );

blink( browser, element );

async function blink( browser, element ) {
  var i, 
  blink = { wait: 500,
            duration: 3000,
            //on: "arguments[0].style.backgroundColor = 'purple'",
            //off: "arguments[0].style.backgroundColor = 'white'",
            on: "arguments[0].setAttribute('style','border: solid 2px yellow;')",
            off: "arguments[0].setAttribute('style','border: solid 0px white;')"
          }
  blink.loop = Math.floor( blink.duration / blink.wait );
  blink.loop += blink.loop % 2;
  for(i=0;i<blink.loop;i++){

    await browser
    .executeScript( blink[ i%2==0 ? "on" : "off"], 
                    element );

    await browser.sleep( blink.wait );

  }

}

//driver.quit();