protractor 'ElementNotVisibleError' on link with div inside

问题

I'm using AngularJS 1.2.2 and I'm trying to use protractor (version: 2.1.0) to click on a link by it's ID with the following spec;

  it 'allows adding levels', ->
    element(By.id("add_level")).click()

If I use the test with the following I get an error

<a id="add_level" ng-click="add_level()"><div class="secondary_btn">Add Level</div></a>

ERROR:

     ElementNotVisibleError: element not visible
  (Session info: chrome=41.0.2272.89)
  (Driver info: chromedriver=2.15.322448 (52179c1b310fec1797c81ea9a20326839860b7d3),platform=Linux 3.16.0-0.bpo.4-amd64 x86_64) (WARNING: The server did not provide any stacktrace information)
Command duration or timeout: 14 milliseconds
Build info: version: '2.45.0', revision: '5017cb8', time: '2015-02-26 23:59:50'
System info: host: 'ltsp', ip: '127.0.1.1', os.name: 'Linux', os.arch: 'amd64', os.version: '3.16.0-0.bpo.4-amd64', java.version: '1.7.0_65'
Session ID: f89f610e73e47854057e98c324a71e38
Driver info: org.openqa.selenium.chrome.ChromeDriver
Capabilities [{platform=LINUX, acceptSslCerts=true, javascriptEnabled=true, browserName=chrome, chrome={userDataDir=/tmp/.com.google.Chrome.sOTsvG}, rotatable=false, locationContextEnabled=true, mobileEmulationEnabled=false, version=41.0.2272.89, takesHeapSnapshot=true, cssSelectorsEnabled=true, databaseEnabled=false, handlesAlerts=true, browserConnectionEnabled=false, webStorageEnabled=true, nativeEvents=true, applicationCacheEnabled=false, takesScreenshot=true}]

However if I don't use an internal div then it works fine, except I loose my styling.

<a id="add_level" ng-click="add_level()">Add Level</a>

UPDATE

I've found a good work around, by moving the id to the inside div then my tests will work.

<a ng-click="add_level()"><div id="add_level" class="secondary_btn">Add Level</div></a>

回答1:

You can always locate the button by text:

element(by.xpath("//*[. = 'Add level']")).click();

or, if it's a link:

element(by.linkText("Add level")).click();

来源：https://stackoverflow.com/questions/31779071/protractor-elementnotvisibleerror-on-link-with-div-inside

标签

javascript

angularjs

protractor