等到元素变得可见,使用selenium-webdriver和PjantomJS

时间:2015-09-01 10:39:03

标签: javascript selenium-webdriver phantomjs mocha

我正在使用selenium-webdriver,phantomJS和mocha编写自动化测试脚本。

我的脚本文件本质上是javascript文件。

我想等到元素(<a>)变得完全可见。在它变得可见之后,将点击该元素。

让我详细解释一下:

有一些菜单和子菜单。菜单本质上是可折叠的。当我单击菜单时,会显示相应的子菜单。

我的以下脚本首先通过菜单迭代(并单击),然后迭代并显示子菜单状态。

for(var iMajor = 2; iMajor <= majorLinkLast ; iMajor++)
{   
    majorMenuXPath = "//ul[contains(@id, 'side-menu')]/li["+iMajor+"]/a";
    if(iMajor != 2)
    {
        driver.findElement(By.xpath(majorMenuXPath)).click();
        driver.manage().timeouts().implicitlyWait(30 * 10000);
    }   
    for(var iMinor = 1; iMinor <= minorSize[iMajor] ; iMinor++)
    {   
        minorMenuXPath = "//ul[contains(@id, 'side-menu')]/li["+iMajor+"]/ul/li["+iMinor+"]/a";
        driver.findElement(By.xpath(minorMenuXPath)).isDisplayed().then(function(elem){
        console.log(elem);
    });
}

以上代码显示子菜单的状态,如:

true
true
true
true
true
true
true
false
true
false
true
false
true
false
false
true
true
true
true
true
true
true
true
true
true

我使用隐式方法让驱动程序等待。但仍有一些子菜单显示为false(表示它们不可见)。单击父菜单后,它们应该可见。

我需要一些关于以下方面的帮助:

  1. 我怎么能等到子菜单可见?每个子菜单后 变得可见,我需要执行一些操作。

  2. 或者,如何在特定时间后显示子菜单。

  3. 这是我的HTML:

    <ul id="side-menu" class="nav">
        <li class="nav-header">
        <img class="logo" alt="Track Revenue" src="/images/3c4939d.png">
        <div class="logo-element"> TR </div>
        </li>
        <li class="">
        <a href="#home">
        <i class="fa fa-bolt"></i>
        <span class="nav-label">Tr Admin Menu</span>
        <span class="fa arrow"></span>
        </a>
        <ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
            <li>
            <a href="/admin/user/">All Users</a>
            </li>
            <li>
            <a href="/admin/company/">All Companies</a>
            </li>
            <li>
            <a href="/admin/device/">Devices</a>
            </li>
            <li>
            <a href="/admin/email/">Send Email</a>
            </li>
            <li>
            <a href="/admin/impersonate">Impersonate User</a>
            </li>
            <li>
            <a href="/admin/encrypttest">Test Encryption</a>
            </li>
        </ul>
        </li>
        <li class="">
        <a href="#home">
        <i class="fa fa-th-large"></i>
        <span class="nav-label">Campaigns</span>
        <span class="fa arrow"></span>
        </a>
        <ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
        <li>
        <a href="http://demotest.com.co/main/account/campaign_overview.php">Overview</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/campaign_update_cpc.php">CPC Update</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/campaign_update_subids.php">SubID Update</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/campaign_v2.php">Add Campaign</a>
            </li>
        </ul>
        </li>
        <li>
        <a href="#home">
        <i class="fa fa-bar-chart-o"></i>
        <span class="nav-label">Stats</span>
        <span class="fa arrow"></span>
        </a>
        <ul class="nav nav-second-level collapse">
            <li>
            <a href="http://demotest.com.co/main/account/stats_campaign_v2.php">Campaign Stats</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/stats_week_day_v2.php">Week / Day Parting Stats</a>
            </li>
        </ul>
        </li>
        <li>
        <a href="#home">
        <i class="fa fa-files-o"></i>
        <span class="nav-label">Reports</span>
        <span class="fa arrow"></span>
        </a>
        <ul class="nav nav-second-level collapse">
            <li>
            <a href="http://demotest.com.co/main/account/report_custom.php">Custom Data Reports</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/report_subid.php">SubID Analysis Report</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/completed_report.php">Scheduled Reports</a>
            </li>
        </ul>
        </li>
        <li>
        <a href="#home">
        <i class="fa fa-cog"></i>
        <span class="nav-label">Settings</span>
        <span class="fa arrow"></span>
        </a>
        <ul class="nav nav-second-level collapse">
            <li>
            <a href="/profile/">Account</a>
            </li>
            <li>
            <a href="/plan/">Plan Management</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/settings_groups.php">Campaign Groups</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/settings_network.php">Affiliate Networks</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/settings_sources.php">Traffic Source</a>
            </li>
            <li>
            <a href="/manage/user/">Manage Users</a>
            </li>
            <li>
            <a href="/manage/company/">Manage Company</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/settings_rules.php">Blocking & Filter Rules</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/domains.php">Domains</a>
            </li>
            <li>
            <a href="http://demotest.com.co/main/account/campaign_archive.php">Campaign Maintenance</a>
            </li>
        </ul>
        </li>
    </ul>
    

    注意:

    我是硒的新手。我需要javascript程序来解决问题。我不了解JAVA或Python或C#

    有人可以帮帮我吗?

2 个答案:

答案 0 :(得分:1)

原因是看不见的,不是吗?自动执行普通用户所做的任何事情以使该元素可见。有时页面的某些部分是隐藏的,因为它有多个&#34;视图&#34;在一个页面上。用户通常可以通过单击某些内容或填写表单来在这些视图之间导航。您必须自动执行用户所做的相同交互。

答案 1 :(得分:0)

以下代码段有助于显示元素。

minorMenuXPath = "//ul[contains(@id, 'side-menu')]/li["+iMajor+"]/ul/li["+iMinor+"]/a";
//Following snippet is stated for making the driver wait till the element is visble.
driver.wait(function() 
{
   return driver.isElementPresent(By.xpath(minorMenuXPath));
}, 20*1000);
driver.findElement(By.xpath(minorMenuXPath)).then(function(elem)
{
    elem.isDisplayed().then(function(stat){
        console.log(stat);
    });
});