如何從html的下拉菜單中讀取元素？

Question

我正在通過Selenium FirefoxDriver解析以下html-

      <div id="primaryNav" style='background: url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/primaryNavBackground._V161555288_.gif") repeat-x bottom;'> 
       <div id="menuh">
        <ul>
            <li style="visibility:hidden; 
        height:24px"/>


               <li style='background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-right._V161557413_.gif") no-repeat right top;'>
                    <a href="/gp/associates/promo/buildlinks.html" style='float:left;background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-left._V161554471_.gif") no-repeat left top;'>Links & Banners<span class="droparrow">&#x25BC;</span></a>

    <div class="parent">
        <div class="dropdownlinks">
            <div class="subitem"><a href="/gp/associates/network/build-links/individual/main.html">Product Links</a></div><div class="subitem"><a href="/gp/associates/network/build-links/banner/main.html">Banner Links</a></div><div class="subitem"><a href="/gp/associates/network/build-links/text/main.html">Link to Any Page</a></div><div class="subitem"><a href="/gp/associates/network/tools/link-checker/main.html">Link Checker</a></div>
        </div>
    </div>

                </li>


                <li style='background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-right._V161557413_.gif") no-repeat right top;'>
                    <a href="http://widgets.amazon.in/?_encoding=UTF8&amp;store=httpswwwvanta-21&amp;tag=httpswwwvanta-21" style='float:left;background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-left._V161554471_.gif") no-repeat left top;'>Widgets</a>
                </li>


                <li style='background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-right._V161557413_.gif") no-repeat right top;'>
                    <a href="/gp/advertising/api/detail/main.html" style='float:left;background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-left._V161554471_.gif") no-repeat left top;'>Product Advertising API</a>
                </li>


                <li style='background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-right._V161557413_.gif") no-repeat right top;'>
                    <a href="/gp/associates/network/reports/main.html" style='float:left;background:url("https://images-na.ssl-images-amazon.com/images/G/31/associates/network/08-ui-elements/tab-unslected-left._V161554471_.gif") no-repeat left top;'>Reports<span class="droparrow">&#x25BC;</span></a>


    <div class="parent"><div class="dropdownlinks">

    <div class="subitem"><a href="/gp/associates/network/reports/report.html?ie=UTF8&amp;reportType=earningsReport" >Earnings Report</a>
</div><div class="subitem"><a href="/gp/associates/network/reports/report.html?ie=UTF8&amp;reportType=ordersReport" >Orders Report</a>
</div><div class="subitem"><a href="/gp/associates/network/reports/report.html?ie=UTF8&amp;reportType=linkTypeReport" >Link-Type Report</a>
</div><div class="subitem"><a href="/gp/associates/network/reports/report.html?ie=UTF8&amp;reportType=trendsReport" >Daily Trends</a>
</div><div class="subitem"><a href="/gp/associates/network/reports/report.html?ie=UTF8&amp;reportType=tagsReport" >Tracking ID Summary Report</a>
</div>
</div>
</div>
                </li>
        </ul>
       </div>
      </div>

我正在嘗試從下拉菜單中選擇“收入報告”。 我嘗試過這樣-

dropDownButton: WebElement = driver.findElement(By.xpath(".//a[@href='https://affiliate-program.amazon.in/gp/associates/network/reports/report.html?ie=UTF8&reportType=earningsReport']"))
dropDownButton.click()

我也這樣嘗試過

val dropDownButton = driver.findElement(By.linkText("Earnings Report"))
dropDownButton.click()

在這兩種情況下，僅當我將鼠標懸停在下拉菜單上時，代碼才會運行。 無需手動單擊。

我也嘗試了以下代碼，我不確定是否正確-

     import scala.collection.JavaConversions._
      def selectValueFromDropdown( value: String) = {
      var options = driver.findElements(By.id("menuh"));
      for(option <- options) {
            if (value.equals(option.getText())) {
                option.click()
            }
        }

      }

selectValueFromDropdown("Earnings Report")

我有點迷路了。 請提出使用Java或Scala的解決方案。

編輯：從主頁登錄后，我進入此頁面。 可以嗎？

Answer 1

請嘗試以下方法：

• 首先選擇下拉菜單，然后按值或索引-

Select drpdown = new Select(driver.findElement(By.xpath("Locator of the dropdown")); drpdown.SelectByValue("Earning Report");

• 如果“收入報告”是可見的文本，則-

drpdown.selectByVisibleText("Earning Report");

Answer 2

如前所述，您必須將鼠標懸停在下拉菜單上才能正常工作。 您的菜單也有子菜單。 因此，在單擊鏈接之前，您需要使用“操作”的“執行”方法。 通過這種方式，Selenium可以在按住菜單的同時發現特定的子菜單。 該代碼是：

val menuElement = driver.findElement(By.id("menuh"))
/* If the css selector used below does not match the element that
*  fires the hover action then check which element fires it and update
*  the selector */
val subMenuElement = driver.findElement(By.cssSelector("#menuh li:nth-child(5)"))
val earningsReportElement = driver.findElement(By.linkText("Earnings Report"))
val action = new Actions(driver)

action.moveToElement(menuElement).perform()
action.moveToElement(subMenuElement).perform()
action.moveToElement(earningsReportElement)
action.click()
action.perform()

Answer 3

嘗試這個-

 driver.findElement(
            By.xpath("//a[contains(@href,'earningsReport')]"))
            .click();

Answer 4

@Dagojvg提供的解決方案在重新排列了表達式后起作用。

import org.openqa.selenium.interactions.Actions
val action = new Actions(driver)
val menuElement = driver.findElement(By.id("menuh"))
action.moveToElement(menuElement).perform()

val subMenuElement = driver.findElement(By.cssSelector("#menuh li:nth-child(5)"))
action.moveToElement(subMenuElement).perform()

val earningsReportElement = driver.findElement(By.linkText("Earnings Report"))
action.moveToElement(earningsReportElement)

action.click()
action.perform()