如何处理量角器中的模态对话框？

Question

我正在尝试在 this website. This dialog box appears after clicking Sign In button. I cannot seem to find any way to switch focus on the box. See the gist

的模态对话框上使用 sendKeys()

我尝试在

中使用 browser.driver.switchTo().activeElement();

InvalidLogInUnSuccess: {
        get: function () {
            this.loginButton.click();
            browser.driver.switchTo().activeElement();
            this.email.sendKeys("Test");
        }
    }

运气不好并抛出 ElementNotVisibleError

Message: ElementNotVisibleError: element not visible (Session info: chrome=41.0.2272.101) (Driver info: chromedriver=2.14.313457 (3d645c400edf2e2c500566c9aa096063e707c9cf),platform=Windows NT 6.3 x86_64) Stacktrace: ElementNotVisibleError: element not visible

Answer 1

当使用 动画效果 打开弹出窗口时测试内部应用程序时我遇到了类似的问题（我认为这是罪魁祸首）这让我想到关于等待弹出窗口中的元素变得可见。

visibilityOf expected condition 在这种情况下对我有用：

var email = element(by.css('.container.login.ng-scope #email'));
browser.wait(EC.visibilityOf(email), 5000);

email.sendKeys('test');

其中 EC 是我通常在 onPrepare():

中全局定义的内容

onPrepare: function () {
    ...

    global.EC = protractor.ExpectedConditions;
},

附带说明一下，我认为定位器可以在此处进行改进：

ng-scope 不是我会依赖的东西
在email字段上定义了一个model，怎么样：
```
element(by.model('email'));
```

仅供参考，我执行的完整规范：

"use strict";

describe("gifteng test", function () {
    var scope = {};

    beforeEach(function () {
        browser.get("http://www.gifteng.com/?login");
        browser.waitForAngular();
    });

    describe("Logging in", function () {
        it("should send keys to email", function () {
            var email = element(by.css('.container.login.ng-scope #email'));
            browser.wait(EC.visibilityOf(email), 5000);

            email.sendKeys('test');
        });

    });
});

Answer 2

Protractor 使用你应该写的 promise :

  InvalidLogInUnSuccess: {
            get:  async() => {
                await this.loginButton.click();
                await browser.driver.switchTo().activeElement();
                await this.email.sendKeys("Test");

只需在量角器代码之前应用 Promises。我删除了函数并写了异步。所以我申请了 async/await.

参考：Link

如何处理量角器中的模态对话框？

How to handle modal-dialog box in Protractor?

selenium

modal-dialog

angularjs

protractor