硒:单击烤面包机问题 [英] Selenium: Clicking on toaster issues

问题描述

我正在尝试单击页面上的元素；该元素在屏幕上清晰可见.有一个可能会弹出的烤面包机，所以我要写一个辩护:如果该烤面包机在屏幕上，请先关闭该烤面包机，然后继续单击以转到下一页.我正在使用PageFactory，所以我有一个元素来包含烤面包机，一个元素用于烤面包机的关闭按钮.我的烤面包机交易"方法如下:

I'm trying to click on an element on a page; the element is clearly visible on screen. There is a toaster that might pop up, so I'm trying to write a defense: if the toaster is on screen, close the toaster first, then continue clicking through to the next page. I am using PageFactory, so I have an element to contain the toaster and one for the close button for the toaster. My "deal with toaster" method is as follows:

if (driver.findElements(By.cssSelector("#toaster")).size() > 0 
    && toaster.isDisplayed()) {
    toasterClose.click();
}

但是，当我在Chrome中执行此操作时，我会得到org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (994, 758)

When I do this in chrome, however, I'm getting org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (994, 758)

暂停测试执行，我无法在屏幕上看到烤面包机.我认为开发人员必须通过使其在遥不可及的不可滚动位置进行渲染来隐藏它.因此，作为权宜之计，我添加了一个条件，如果x坐标大于800，则不要单击.有了这个，我得到:

Pausing the test execution, I cannot see the toaster on the screen. I figure the devs must be hiding it by making it render in a far away, unscrollable location. So as a stopgap measure, I added a condition that if the x coordinate was greater than 800, don't click. With that in place, I get:

org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (547, 725). Other element would receive the click: <div id="toaster">...</div>

这是怎么回事?烤面包机如何无法点击，但仍会以某种方式获得点击?不管有没有800像素的解决方案，Firefox都可以很好地处理测试.只有Chrome出现此问题.

What's going on? How can the toaster not be clickable but would somehow receive the click anyway? Firefox can handle the test just fine, with or without the 800 pixel workaround; it's only Chrome having this issue.

为澄清起见:该测试的目的不是单击烤面包机.目的是单击页面上的另一个元素.该测试报告说有一个烤面包机在挡，因此，我尝试编写一个步骤关闭该烤面包机(如果显示的话).我还没看过这台烤面包机，所以我不确定它是什么，但是chrome一直在报告它的运行方式.我们所有站点上的烤面包机都使用一个包含关闭按钮的基本模板，以便用户可以关闭烤面包机，这就是我要单击的内容. Firefox从来没有这个问题，并且不报告任何烤面包机的存在.

For Clarification: The goal of the test is NOT to click the toaster. The goal is to click another element on the page. The test reported that a toaster was in the way, so I attempted to write a step to close the toaster if it is displayed. I have not seen this toaster, so I'm not exactly sure what it is, but chrome keeps reporting that it's in the way. All our toasters site-wide use a basic template that includes a close button so the user can close the toaster, which is what I'm trying to click. Firefox never has this issue and does not report the existence of any toasters.

我之所以称它为烤面包机，是因为这是我们网站所称的，因为在我们从jQuery UI?Backbone?得到的任何框架中，这就是它的称呼.如果我暂停执行，在测试的这一点上我看不到任何烤面包机，但是jQuery告诉我它已经存在并且可见.但是，使用jQuery找到的元素只是我们的烤面包机设置的默认部分:一个div，应该在其中放置消息的空div和关闭按钮.显然，这并不打算在此时渲染，但Chrome认为它会妨碍渲染.

I'm calling it a toaster because that's what our site calls it, because that's what it's called in whatever framework we got it from (jQuery UI? Backbone?). If I pause execution, I cannot see any toasters at this point in the test, but jQuery tells me it exists and is visible. However, the element found with jQuery has just the default pieces of our toaster setup: a div, an empty div where the message should be, and the close button. Clearly it's not meant to be rendered at this time, but Chrome thinks it's in the way.

推荐答案

似乎烤面包机已部分渲染并固定在屏幕底部边缘下方的DOM上，使用position:fixed使其停止显示直到出现准备向其中填充数据并在屏幕上显示动画.当chrome尝试点击屏幕底部边缘下方的链接时，它预测它会碰到烤面包机，而实际上并没有打扰滚动.

It seems the toaster was partially rendered and fixed to the DOM just below the bottom edge of the screen, using position:fixed to stop it from showing up until it's ready to be populated with data and animated onto the screen. When chrome tried to click on links that were below the bottom edge of the screen, it predicted that it'd hit the toaster and didn't actually bother scrolling.

在谷歌搜索后，我添加了以下实用程序功能:

After some googling, I added the following utility function:

public static void ScrollElementIntoView(WebDriver driver, WebElement element) {
    ((JavascriptExecutor) driver).executeScript("arguments[0].scrollIntoView(true);", element);
}

然后，在单击该页面上的任何链接之前，我先调用此方法，瞧，再也没有烤面包机问题了！

Then I call this method before clicking any link on that page, and voila, no more toaster problems!

这篇关于硒:单击烤面包机问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！