正式使用 Protractor 和 angular

Question

我在 angular 中有一个使用 formly 表单的项目 http://angular-formly.com/#/ and want to add some end to end testing using Protractor.

我不能 select 模型的元素，因为表单字段是在代码中定义的，而不是在模板中定义的，当它们被渲染时，它们会得到不同的 ng-model，我不想添加特定的类因为我的表格很大。

有没有办法做到这一点并测试 Formly 呈现的表单？

Answer 1

一种选择是查找所有形式为 input 的元素，evaluate the model value and filter:

var formlyInputs = $$("input");

var desiredModel = "modelName";
var desiredInput = formlyInputs.filter(function (input) {
    return input.evaluate("model[options.key]").then(function (model) {
        return model === desiredModel; 
    });
}).first();

desiredInput.sendKeys("some text");

您可能需要对其进行扩展以不仅支持 input 元素，还支持表单可能具有的其他表单元素。

另一个解决方案是依赖输入的前面的标签：

var label = "Text";

var desiredInput = element(by.xpath("//label[normalize-space(.) = '" + label + "']/following-sibling::input"));
desiredInput.sendKeys("some text");

正式使用 Protractor 和 angular

Using Protractor with angular formly

angularjs

protractor

angular-formly