单击模态窗口中的按钮 - 量角器答案

【问题标题】：Click on a button in a Modal Window - Protractor单击模态窗口中的按钮 - 量角器
【发布时间】：2016-10-26 15:18:15
【问题描述】：

我正在为现有应用编写量角器测试。我在模式窗口中有一个名为“拒绝”的按钮，我正在尝试使用以下方法单击它：

element(by.buttonText('Decline')).click();

但我收到以下错误：

UnknownError: unknown error: Element is not clickable at point (,). Other element would receive the click:

可能是因为我在模态窗口外还有另一个名为“拒绝”的按钮？

如何点击模态窗口的拒绝按钮？

发现这是显示这个Decline按钮的js代码。

.....
var content = {
          title: 'Decline',
          htmlBody: '<p>...</p> ',
          okButton: 'Decline',
          onOk: function() {
.....

【问题讨论】：

标签： javascript angularjs protractor modal-window

【解决方案1】：

由于有两个按钮文本为Decline，我们如何识别模态中的一个？

解决此问题的一种方法是改进您的定位器以在模态内容的范围内工作。但是，由于您没有提供模态的 HTML 表示，我无法为您提供具体的答案。以下是您可以改进以适应您的用例的示例：

element(by.css(".modalContent button[ng-click*=ok]")).click();
element(by.css(".modalContent")).element(by.buttonText("Decline")).click();

另一种方法是查找所有带有特定文本的按钮并过滤可见的按钮：

element.all(by.buttonText("Decline")).filter(function (button) {
    return button.isDisplayed().then(function (isDisplayed) {
        return isDisplayed;
    });
}).first().click();

【讨论】：

【解决方案2】：

我的同事推荐了这个并且效果很好：

点击 First Decline 按钮打开一个模式，

睡一会，

现在点击第二个拒绝按钮。

element(by.buttonText('Decline')).click();
browser.sleep(2000);
element(by.cssContainingText('.btn', 'Decline')).click();

感谢您的所有帮助:)

【讨论】：

谢谢！完美运行！
太棒了 :) 很高兴听到这个消息。

【解决方案3】：

编写代码需要在模态窗口下显示，内部表单标签。并将该表单与现有表单序列化。

【讨论】：

【解决方案4】：

只需通过文本搜索按钮并使用函数click。所以对你来说它应该是这样的：

element(by.buttonText('Cancel')).click();

【讨论】：

【解决方案5】：

试试下面的代码，

var DeclineBtn = element(by.buttonText('Decline'));
browser.executeScript("arguments[0].click()",DeclineBtn.getWebElement())

【讨论】：

这是做什么的？可以给个简短的描述吗？由于有两个带有按钮文本 Decline 的按钮，我们如何识别模态中的一个？