13

我有类似这样的代码：

ExamPage.prototype.enterDetailsInputData = function (modifier) {
    page.sendKeys(this.modalExamName, 'Test Exam ' + modifier);
    page.sendKeys(this.modalExamVersionId, 'Test exam version ' + modifier);
    page.sendKeys(this.modalExamProductVersionId, 'Test exam product version ' + modifier);
    page.sendKeys(this.modalExamAudienceId, 'Test exam audience ' + modifier);
    page.sendKeys(this.modalExamPublishedId, '2014-06-1' + modifier);
    page.sendKeys(this.modalExamPriceId, '100' + modifier);
    page.sendKeys(this.modalExamDurationId, '6' + modifier);
};

这是 page.sendKeys 函数。请注意，目前这并没有做任何承诺的回报或类似的事情。如果函数编码不好，欢迎评论：

// page.sendkeys function
sendKeys(id: string, text: string) {
    element(by.id(id)).sendKeys(text);
}

我看着它慢慢地填满我屏幕上的每个字段，然后在接下来的更多测试中一次又一次地重复它。

有什么办法可以优化它，还是我必须等待一个又一个字段填充，并且必须忍受需要很长时间才能运行的测试？

我假设 sendKeys 是基于承诺的。例如，我可以使用AngularJS $q同时发出所有的 sendKey，然后使用 $q 等待它们完成吗？

4

5 回答 5

11

潜在的解决方案我认为无论您如何优化它都至少需要一点hackery - 量角器不会给您开箱即用的功能。但是，像这样的小助手功能会满足您的需求吗？你还需要什么来加速边text inputs 和ng-models？

function setNgModelToString(element, value) {
    return element.getAttribute('ng-model').then(function (ngModel) {
        element.evaluate('$eval("' + ngModel + ' = \'' + value + '\'") && $digest()');
    });
}

解决方案示例：

describe('angularjs homepage', function() {
  it('should have a title', function() {
    browser.get('http://juliemr.github.io/protractor-demo/');

    var inputString1 = '';
    var inputString2 = '';
    for (var i = 0; i < 1000; i++) {
        inputString1 += '1';
        inputString2 += '2';
    }

    /* Uncomment this to see it runs much much slower when you enter each key. */
    //element(by.model('second')).sendKeys(inputString1);   

    setNgModelToString(element(by.model('second')), inputString2);

    expect(element(by.model('second')).getAttribute('value')).toEqual(inputString2);
  });
});

为什么解决方案有效？

您需要使用$eval来包装分配，而不仅仅是分配，因为evaluate它不会评估副作用（嵌套评估，虽然......呵呵）。假设这在角度表达式中$digest()是真实的，那么从&&;调用 这会导致摘要发生，您需要更新所有内容，因为您从摘要周期之外设置了一个值。

关于解决方案的想法：

E2E 测试背后的整个想法是“模拟”最终用户使用您的应用程序。可以说，这与逐个发送键或复制和粘贴（因为粘贴到元素中是输入输入的有效方式；由于闪存等原因很难设置）一样，都没有做到这一点。 ， 见下文）。

其他潜在解决方案：

  • 复制和粘贴：创建一个元素，输入文本，复制它，将发送 Ctrl + V 的文本粘贴到目标元素。这可能需要做一些花哨的动作，比如使用 Flash（暴露系统剪贴板是一种安全风险）并让“复制它”单击一个不可见的 Flash 播放器。请参阅executeScript评估目标上的函数，以便您可以访问需要的变量window。

  • 并行化你的测试。在此处 阅读官方文档并搜索“shard”，然后搜索“multiple”。如果您主要担心整个测试集合的持续时间而不是单个测试，那么扩展您的浏览器数量可能是要走的路。但是，您很有可能正在使用 TDD 或其他东西，因此需要每个测试运行得更快。

于 2014-09-09T08:40:13.137 回答
3

您可以执行以下操作 -

ExamPage.prototype.enterDetailsInputData = function (modifier) {
var arr=[
{id:this.modalExamName, text:'Test Exam ' + modifier},
{id:this.modalExamVersionId, text:'Test exam version ' + modifier },
{id:this.modalExamProductVersionId, text:'Test exam product version ' + modifier},
{id:this.modalExamAudienceId,text:'Test exam audience ' + modifier},
{id:this.modalExamPublishedId, text:'2014-06-1' + modifier},
{id:this.modalExamPriceId, text:'100' + modifier},
{this.modalExamDurationId, text:'6' + modifier}
];
var Q = require('q'),
    promises = [];
for (var i = 0; i < arr.length; i++) {
    promises.push(page.sendKeys(arr[i].id, arr[i].text));
}

Q.all(promises).done(function () {
    //do here whatever you want
});

};

sendKeys 默认返回承诺。见这里 - https://github.com/angular/protractor/blob/master/docs/api.md#api-webdriver-webelement-prototype-sendkeys

sendKeys(id: string, text: string) {
    return element(by.id(id)).sendKeys(text);
}
于 2014-09-07T18:39:33.037 回答
2

如果您真的想以任何方式（包括填写数据表单）加速操作 DOM 的过程，可以考虑的一个选项是使用：browser.executeScript或browser.executeAsyncScript. 在这种情况下，webdriver让浏览器自己执行脚本——唯一的开销是将脚本正文发送到浏览器，所以我认为可能没有更快的方法。

从我所见，您可以通过ids 识别 DOM 元素，因此它应该可以顺利地使用我提出的方法。

这是它的一个脚手架——经过测试，它工作正常：

browser.get('someUrlToBeTested');
browser.waitForAngular();
browser.executeScript(function(param1, param2, param3){

        // form doc: arguments may be a boolean, number, string, or webdriver.WebElement
        // here all are strings: param1 = "someClass", param2 = "someId", param3 = "someModifier"
        var el1 = document.getElementsByClassName(param1)[0];
        var el2 = document.getElementById(param2);

        el1.setAttribute('value', 'yoohoo ' + param3);
        el2.setAttribute('value', 'hooyoo ' + param3);

        // depending on your context it will probably
        // be needed to manually digest the changes
        window.angular.element(el1).scope().$apply();


},'someClass', 'someId', 'someModifier')

小评论：如果您将webdriver.WebElement其作为参数之一传递，它将被转换为相应的DOM element。

于 2014-09-09T10:53:39.297 回答
0

我也用过browser.executeScript。但我不需要使用 $applywaitForAngular

我在 E2E 测试运行时添加了一个脚本，并将一个函数放在全局范围内，不用担心它只是在 E2E 测试期间，如果你愿意，你可以命名空间。

'use strict';
function fastSendKeys(testId, value) {
    //test id is just an attribute we add in our elements
    //you can use whatever selector you want, test-id is just easy and repeatable
    var element = jQuery('[test-id=' + '"' + testId + '"' + ']');
    element.val(value);
    element.trigger('input');
}

然后在量角器中测试类似这样的内容（在页面对象中）：

this.enterText = function (testId, value) {
        var call = 'fastSendKeys(' + '"' + testId + '"' + ',' + '"' + value + '"' + ')';
        console.log('call is ', call);
        browser.executeScript(call);
    };
于 2015-08-04T22:09:58.510 回答
0

在测试 Angular 2 应用程序时，以下内容对我有用

await browser.executeScript("arguments[0].value='" + inputText + "';", await element.by.css("#cssID"))

灵感来自https://stackoverflow.com/a/43404924/6018757

于 2021-01-18T11:32:42.317 回答