UnknownServerException：元素在点（X，Y）不可点击

Question

我正在为使用 Yii Framework 2.0. I'm using Codeception and Selenium software 创建的应用程序编写验收测试。

问题如下

页面上有一个 div，如果单击它 - 旁边会出现一个菜单。在那个菜单中有一个我需要的link。

那是 html 代码的一部分：

<div class="nav_panel">
    <div class="menuButton" id="np1" title="Menu"><b>Main menu</b><i></i><i></i><i></i></div>
            <div class="np np5" id="np5" title="Tree" onclick="window.location.href = '/roles/controllermodule/tree'">
            <span class="glyphicon glyphicon-tree-deciduous"></span>
        </div>
        <div id="scrollUp" class="npt glyphicon glyphicon-circle-arrow-up" title="Up"></div>
            <div class="np np6" id="np6" title="TestIt" onclick="window.location.href = '/gtest/gtest/index'">
        <span class="glyphicon glyphicon-wrench"></span></div>
                <div class="np np7" id="np7" title="Clear DB Cache" onclick="$.ajax({type: 'GET',url: '/roles/role/schemarefresh'});">
        <span class="glyphicon glyphicon-refresh"></span></div>
            <div class="np np1" id="np2" title="Reports"><span class="glyphicon glyphicon-file"></span></div>
    <div class="np np2" id="np3" title="Documents"><span class="glyphicon glyphicon-envelope"></span></div>
    <div class="np np3" id="np4" title="Profile"><span class="glyphicon glyphicon-user"></span></div>
  </div>

这是我要点击的 div：

  <div class="np np3" id="np4" title="Profile"><span class="glyphicon glyphicon-user"></span></div>

在测试中我可以看到 div:

$I->seeElement(['xpath' => './/div[@id="np4"]']);

但是当我尝试模拟点击它时 - 测试失败并出现错误：

[37;41m
[39;49m [37;41m [UnknownServerException] unknown error: Element is not clickable at point (21, 729). Other element would receive the click: (Session info: chrome=50.0.2661.102) (Driver info: chromedriver=2.21.371459 (36d3d07f660ff2bc1bf28a75d1cdabed0983e7c4),platform=Windows NT 10.0 x86_64) (WARNING: The server did not provide any stacktrace information) Command duration or timeout: 27 milliseconds Build info: version: '2.53.0', revision: '35ae25b', time: '2016-03-15 17:00:58' System info: host: 'DESKTOP-Q4B9M7G', ip: '.....', os.name: 'Windows 8.1', os.arch: 'amd64', os.version: '6.3', java.version: '1.7.0_79' Session ID: ... Driver info: org.openqa.selenium.chrome.ChromeDriver Capabilities [{platform=WIN8_1, acceptSslCerts=true, javascriptEnabled=true, browserName=chrome, chrome={userDataDir=C:...\scoped_dir11496_1013, chromedriverVersion=2.21.371459 (36d3d07f660ff2bc1bf28a75d1cdabed0983e7c4)}, rotatable=false, locationContextEnabled=true, mobileEmulationEnabled=false, version=50.0.2661.102, takesHeapSnapshot=true, cssSelectorsEnabled=true, databaseEnabled=false, handlesAlerts=true, browserConnectionEnabled=false, webStorageEnabled=true, nativeEvents=true, hasTouchScreen=false, applicationCacheEnabled=false, takesScreenshot=true}] [39;49m [37;41m
[39;49m [33m Scenario Steps: [39m [1m 36. $I->click(".//div[@id="np4"]")[22m at [32mcodeception\acceptance\LoginCept.php:51[39m 35. $I->seeElement({"xpath":".//div[@id="np4"]"}) at [32mcodeception\acceptance\LoginCept.php:50[39m

我建议图像 glyphicon-user 可能与 div 元素重叠并尝试在测试中将其删除：

$I->executeJS('$(".glyphicon-user").remove();');

但是没有用。

如何使用 Codeсeption 模拟点击 div？

Answer 1

这就是帮助我的原因。

我如下所示删除了标签 span 并添加了延迟：

$I->executeJS('$(".glyphicon-user").remove();');
$I->wait(10);

$I->click('div.np.np3#np4[title=\'Profile\']');
$I->wait(5);

现在一切正常。

您可能还需要调用 ng-click 操作。例如，对于按钮如：

<button 
 type="button" 
 ng-click="addNewBlock(model.Languages)" 
 ng-hide="model.Languages.elem.length == model.Languages.max"   
 class="">Add</button>

此按钮动态地向页面添加块。要调用 ng-click 你可以这样写：

$I->executeJS('$(\'button[ng-click="addNewBlock(model.Languages)"]\').click();');

如果按钮位于屏幕底部，您可能希望在那里执行滚动：

$I->executeJS('window.scrollTo(0, document.body.scrollHeight);');

分散在大页面上的复选框会产生这样的问题。解决方法是将当前元素滚动到浏览器可见区域window:

$I->executeJS('document.getElementById("some-id").scrollIntoView();'); 
$I->click('//*[@id="some-id"]');

UnknownServerException：元素在点（X，Y）不可点击

UnknownServerException: Element is not clickable at point (X, Y)

selenium-webdriver

codeception

acceptance-testing