在使用 Selenium 的嵌入式 hellosign 区域的警报窗口中单击“确定”按钮

Question

我需要使用 Selenium 命令单击警报窗口内的“确定”按钮。警报窗口来自嵌入在 html 页面中的 hellosign.com 页面。请在下面找到我尝试过的 html sn-p 和选项。该页面是用 Angular js 设计的。

HTML

<div class="m-signature-request-preview--test-warning--content"><h3>This is not legally binding</h3><p>This is a mock signature request and has no legal value.</p><button class="m-button bg-cerulean hc-white border-1-cerulean hborder-1-cerulean hbg-cerulean c-white progress-button state-loading" type="button" tabindex="0"><span class="l-nowrap">OK</span></button></div>

这里是按钮的详细信息：

选择器：

#signer-mobile-application > div > div > div > div.m-signature-request-preview--test-warning > div.m-signature-request-preview--test-warning--content > button > span

XPath：

//*[@id="signer-mobile-application"]/div/div/div/div[3]/div[2]/button/span

JS 路径：

document.querySelector("#signer-mobile-application > div > div > div > div.m-signature-request-preview--test-warning > div.m-signature-request-preview--test-warning--content > button > span")

按钮的CSS类是m-button

虽然我尝试自动化的页面无法向公众访问，但流程与下面给出的 hellosign.com 网站上的示例几乎相似。不幸的是，弹出窗口未在以下步骤中显示，但您可以查看嵌入的 hellosign.com 页面以了解 UI 的性质。

1. 点击https://app.hellosign.com/api/embeddedTest
2. 点击“获取示例文档”
3. 点击“启动嵌入页面”
4. 点击弹出窗口（已经自动化）
5. UI 应显示 Hello Sign Agreement
6. 上图中的弹出窗口在此阶段显示。
7. 向下滚动，直到看到点击签名。
8. 单击单击以签署区域。
9. 在创建签名页面，点击“输入”
10. 单击插入。

在我的应用程序中，我在第 5 步之后收到一个弹出窗口，上面的步骤中没有显示。单击弹出窗口后，我需要自动执行上述步骤 9 之前的所有步骤。 hellosign 区域内的任何内容都没有被识别，这是上面的第 7 步、第 8 步。我无法找出嵌入区域的 x 和 y 坐标并利用 Robot() 类单击该按钮。浏览器显示页面周围的坐标，但不在页面内部。看起来它不是嵌入式 iframe ，而是嵌入在 Angular js 页面中的外部源。

我已经分别尝试了以下 23 种替代方法

1) Alert alert = wait.until(ExpectedConditions.alertIsPresent()); driver.switchTo().alert().accept(); 原因 org.openqa.selenium.NoAlertPresentException：没有这样的警报

2)JavascriptExecutor js = (JavascriptExecutor) driver; js.executeScript("document.querySelector('.m-button.bg- cerulean').click()");

3)js.executeScript("document.querySelector('.m-button .bg- cerulean').click()");

4)js.executeScript("document.querySelector('.m-button.bg- cerulean.hc-white.border-1-cerulean.hborder-1-cerulean.hbg- cerulean.c-white.progress-button.state-loading').click()");

5)try{ while(true) { new WebDriverWait(driver, 5) .ignoring(ElementNotVisibleException.class, NoSuchElementException.class)
.until(ExpectedConditions.visibilityOf(driver.findElement( By.cssSelector("button[title*='OK']")))).click(); } } catch (Exception ignored){ }

6) driver.findElement(By.cssSelector( "button[title*='OK']")).click();

7) driver.findElement(By.cssSelector("//button/span[title*='OK']")) .click();

8) driver.findElement(By.cssSelector("//button/span[@title,'OK']")) .click();

9) driver.findElement(By.cssSelector("l-nowrap")).click();

10) driver.findElement(By.xpath("//button/span[contains (@class,'l-nowrap')]")).click();

11) driver.findElement(By.xpath("//button/span[ @class,'l-nowrap']")).click();

12) driver.findElement(By.xpath("//button[ @class,'l-nowrap']")).click();

13) driver.findElement(By.xpath("//button/span[@title,'OK']")) .click();

14) driver.findElement(By.xpath("//button[@title,'OK']")).click();

15) driver.findElement(By.xpath("//button[contains(@title,'OK')]")) .click();

16) driver.findElement(By.cssSelector("m-button")).click();

17) driver.findElement(By.xpath("//button/span[contains( @class,'m-button')]")).click();

18) driver.findElement(By.xpath("//button[ @class,'m-button']")).click();

19) driver.findElement(By.xpath( "//*[@id=\"signer-mobile- application\"]/div/div/div/div[3]/div[2]/button[title*='OK']")) .click();

20) driver.findElement(By.xpath("//*[ @id=\"signer-mobile- application\"]/div/div/div/div[3]/div[2]/button[@title,'OK']")) .click();

21) driver.findElement(By.xpath("//*[@id=\"signer-mobile- application\"]/div/div/div/div[3]/div[2]/button/span [@title,'OK']")) .click();

22) driver.findElement(By.xpath("//*[@id=\"signer-mobile- application\"]/div/div/div/div[3]/div[2]/button/span [@class,'l-nowrap']")).click();

23) driver.findElement(By.cssSelector("//*[@id=\"signer-mobile- application\"]/div/div/div/div[3]/div[2]/button[@title,'OK']")) .click();

Answer 1

最简单的方法是使用XPath Selector 和normalize-space() 函数，例如：

//button[normalize-space()='OK']

演示：

参考资料：

• XPath Tutorial
• XPath Axes
• XPath Operators & Functions

Answer 2

使用WebDriverWait 和elementToBeClickable 并遵循定位器策略。

xpath：

WebDriverWait wait = new WebDriverWait(driver, 30);
WebElement elementBtn = wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//button[contains(@class,'progress-button')]/span[text()='OK']")));
elementBtn.click();

CssSelector：

WebDriverWait wait = new WebDriverWait(driver, 30);
WebElement elementBtn = wait.until(ExpectedConditions.elementToBeClickable(By.cssSelector("button.progress-button span.l-nowrap")));
elementBtn.click();

Answer 3

此问题已解决。

OK 弹出窗口仅针对 hellosign.com 页面的试用版显示，与许可版不显示。这就是为什么上面的手动步骤没有显示它的原因。

虽然无法识别按钮，但单击两个选项卡按钮后弹出窗口会消失。所以这行得通。

Actions action = new Actions(driver); action.sendKeys(Keys.TAB).build().perform(); action.sendKeys(Keys.TAB).build().perform(); Thread.sleep(5000);

Answer 4

String frame2 = "";

List<WebElement> iframes = driver.findElements(By.tagName("iframe"));   
for(int i = 0; i < iframes.size(); i++) {
String frameName = iframes.get(i).getAttribute("name");
System.out.println("attributes name "+ frameName);
frame1 = iframes.get(0).getAttribute("name");
frame2 = iframes.get(1).getAttribute("name");
}

System.out.println("frame 1 " + frame1);

System.out.println("frame 2 " + frame2);

driver.switchTo().defaultContent();


WebElement frameFirst = driver.findElement(By.name(frame1));

driver.switchTo().frame(frameFirst);

driver.switchTo().defaultContent();

WebElement frameSecond = driver.findElement(By.name(frame2));
driver.switchTo().frame(frameSecond);
Thread.sleep(8000);

//Clicks on Ok

driver.findElement(By.xpath("//span[contains(@class,'l-nowrap') and contains(text(), 'OK')]")).click();

System.out.println("Clicked on Ok");

Thread.sleep(8000);