Question

我正在使用Nunit在Webdriver C＃中编写测试。我有一个搜索结果页面，其中包含带有图像的产品列表。我想点击结果中的第一张图片。

我尝试过使用Xpath（我使用firepath获取此值）

[FindsBy(How = How.XPath, Using = "html/body/form/div[2]/div[4]/div/div[2]/p")] 
private IWebElement ProductImage_xpath {get; set; }

运行时说：

无法通过XPath找到元素。

我想尽可能使用CSS选择器，因为这比通过Xpath查找更快。

我可以使用什么语法从下面剪切的代码中找到图像？注意：超链接是动态的，我不想使用href。

public SearchResultsPage clickProduct_Image()
{            
    ProductImage_xpath.Click();
    Console.Out.WriteLine("ProductImage = " + ProductImage_xpath.Text);
    return new SearchResultsPage(Driver);
}

代码段：

<div id="main" class="nav_redesign s-left-nav-rib-redesign" data-page-construction="aui" skeleton-key="results--searchTemplate listLayout so_gb_en --left-nav--shopping-engine">
  <div id="topStatic">
    <div id="top">
      <div id="topAmabot"> </div>
      <div id="searchTemplate" class="searchTemplate listLayout so_gb_en ">
        <div id="topDynamicContent">
          <div id="rightContainerATF">
            <div id="rightResultsATF">
              <div id="widthPreserver"></div>
              <div id="centerPlus">
               <div id="rhsAjax"></div>
               <div id="resultsCol" class="">
                 <div id="centerMinus" class="">
                  <div id="atfResults" class="list results apsList">
                   <div id="result_0" class="fstRow prod celwidget" name="1780974728">
                    <div class="linePlaceholder"></div>
                    <div class="image imageContainer">
                      <a href="http://testerServer1co.uk/SpaceExplorer/dp/1780974728/ref=sr_1_1?ie=UTF8&qid=1409311161&sr=8-1&keywords=planets+1">
                      <div class="imageBox">
                        <img class="productImage cfMarker" alt="Product Details" src="http://ecx.images-test.com/images/I/51iYWWt1BqL._SL160_PIsitb-sticker-arrow-dp,TopRight,12,-18_SH30_OU02_AA160_.jpg" onload="viewCompleteImageLoaded(this, new Date().getTime(), 16, false);">
                      </div>

Answer 1

Xpath是在页面上找到元素的非常糟糕的选择=）。正如你所说的更好用css选择器。我不知道你的图像在页面上的呈现方式，但我会写出可能的变体，选择最好的变体。因此，使用css选择器来查找图像：

1. You can find any element using it's class

//will find "div class="image imageContainer""
driver.findElement(By.Css(".imageContainer"))

2. Combine searching by class and find first "a" child in that div

driver.findElement(By.css(".imageContainer > a"))

3.Find element using known attribute

driver.findElement(By.css("img[alt='Product Details']"))

4. Find element by ID

driver.findElement(By.Css("#atfResults"));
//or
driver.findElement(By.Id("atfResults"));

嗯，我认为这对你来说已经足够了。如果您有任何疑问，欢迎您。

如何单击搜索结果页面中的图像

1 个答案: