无法单击元素

时间:2015-10-20 20:15:39

标签: angularjs selenium-webdriver automated-tests protractor

我有一个元素,我已经尝试了每个已知的方式点击这里是一些:

var areaMap = $('[data-bind="click: campusMap"]');
var areaMap = browser.driver.findElement(By.cssSelector("div.campus-map.panel > div.panel-footer > button.btn.btn-browse")).click();
var areaMap = element(by.cssContainingText('button.btn', "View Area Map"));

//and this way too

browser.executeScript('arguments[0].click()', areaMap.getWebElement()); 
browser.actions().mouseMove(areaMap).click().perform();

我不知道如何使这个元素可以互动。

HTML看起来像这样:



<div class="campus-map panel" data-bind="click: campusMap">
  <div class="title">Area Map</div>
  <div class="panel-content">
    <div id="googleContainer" style="position: relative; background-color: rgb(229, 227, 223); overflow: hidden;">
      <div class="gm-style" style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0;">
        <div style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0; cursor: pointer;">
          <div style="margin-left: 5px; margin-right: 5px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;">
            <div class="gmnoprint" style="z-index: 1000001; position: absolute; right: 166px; bottom: 0px; width: 121px;">
              <div style="background-color: white; padding: 15px 21px; border: 1px solid rgb(171, 171, 171); font-family: Roboto,Arial,sans-serif; color: rgb(34, 34, 34); box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.2); z-index: 10000002; display: none; width: 256px; height: 118px; position: absolute; left: 36px; top: 5px;">
                <div class="gmnoscreen" style="position: absolute; right: 0px; bottom: 0px;">
                  <div class="gmnoprint gm-style-cc" style="z-index: 1000001; position: absolute; -moz-user-select: none; right: 95px; bottom: 0px;" draggable="false">
                    <div class="svg-controls" style="z-index: 0; position: absolute; bottom: 13px; right: 0px;">
                      <div class="gm-style-cc" draggable="false" style="-moz-user-select: none; position: absolute; right: 0px; bottom: 0px;">
                      </div>
                    </div>
                  </div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您的示例代码包含html示例中不存在的元素...所以我不能100%确定您要点击的内容。但假设它是第一个div,并假设它是可见,这个选择器应该可以工作:

var areaMap = $('div.campus-map.panel');

或者如果那不可见,也许这个(因为标题应该是可见的):

var areaMap = $('div.campus-map.panel div.title');

或使用文字:

var areaMap = element(by.cssContainingText('div.title', "Area Map"));