穿过田野在角形式循环使用量角器测试输入验证？ [英] Looping through fields in an Angular form and testing input validations using Protractor?

问题描述

我是个初学者和放大器;我通过在角形式的所有字段试图循环，并测试该输入验证工作，用量角器。到目前为止，我没有草草收场。我的伪code是如下：

  //伪code对于测试过程：
// ------------------------------
// 1.对于每个字段需要验证
// 2.Reset测试环境
//以虚拟数据3.Populate场
// 4.Get结果
// 5.Evaluate结果与期望的测试类型
// 6.Pass测试描述＆放大器;测试结果（真/假），以量角器打印到命令行
 

在code我写如下。这不是很大，我甚至不知道是否有可能实现我的目标，而无需为每个字段每个验证测试指定单独的测试。我在做什么错了/什么是正确的做法？

 描述（'样品形式'，函数（）{//领域受到输入验证
  变种的userName =元件（by.model（'user.name'））; // 必填项目
  变种userSurname =元件（by.model（'user.surname'））; // 必填项目
  VAR用户id =元素（by.model（'user.id'））; // 必填项目//测试人口
  VAR fieldsRequired = [用户名，userSurname，用户id] //字段待测试//辅助函数来检查类指定元素 - ＆GT; NG-有效/ NG-无效等。
  VAR hasClass =功能（元素，CLS）{
    返回element.getAttribute（类）。然后（函数（类）{
      返回classes.split（''）.indexOf（CLS）== -1！;
    }）;
  };//测试功能
  功能testRequired（fieldsRequired）{
    // 1。在各字段循环
      对于（VAR I = 0; I＆LT; fieldsRequired.length;我++）{      // 2。重置前的每个测试页
        browser.get（的http：//sometestlink.html'）;      // 3。填充字段以虚拟数据
        fieldsRequired [I] .sendkeys（）;      // 4,5和放大器; 6.量角器测试
        它（'应该失败时验证'+ fieldsRequired [I] +'丢失'，期待（hasClass（fieldsRequired [我]，'NG-有效'））toEqual（假）。）;
      }
  }
}）;
 

解决方案

有在code的几个问题：

1. 您是块将永远不会因为你没有调用 testRequired 函数中执行


2. 的SendKeys（）应的SendKeys（），并且没有发送任何文字，它是空

您可以尝试实现你的这个描述的内容：

 描述（'样品形式'，函数（）{    //辅助函数来检查类指定元素 - ＆GT; NG-有效/ NG-无效等。
    VAR hasClass =功能（元素，CLS）{
        返回element.getAttribute（类）。然后（函数（类）{
            返回classes.split（''）.indexOf（CLS）== -1！;
        }）;
    };    VAR栏= {
        用户名：元素（by.model（user.name））
        'userSurname'：元件（by.model（'user.surname'）），
        '用户id'：元素（by.model（'user.id'））
    };    对于（田间VAR场）{
        （函数（场）{
            +现场+'缺失'，它的功能（时应验证失败'（）{
                browser.get（的http：//sometestlink.html'）;
                场[现场] .sendKeys（'dummy_data'）;
                期待（hasClass（场[现场]，'NG-有效'））toEqual（假）。
            }）;
        }）（领域）;
    };
}）;
 

I'm a beginner & am trying to loop through all the fields in an Angular form, and test that the input validation is working, using Protractor. So far I'm failing miserably. My pseudo code is as follows:

//PSEUDO CODE FOR TEST PROCESS:
//------------------------------
// 1.For each field requiring validation
// 2.Reset test environment
// 3.Populate field with dummy data
// 4.Get result
// 5.Evaluate result versus expectation for test type
// 6.Pass test description & test result (true/false) to Protractor to print to command line

The code I've written is below. It's not great, and I'm not even sure if it's possible to achieve my objective without specifying individual tests for each validation test for each field. What am I doing wrong / what is the correct approach?

describe('Sample form', function() {

// Fields subject to input validation
  var userName          = element(by.model('user.name'));           // required field
  var userSurname       = element(by.model('user.surname'));        // required field
  var userId            = element(by.model('user.id'));             // required field

// Test population
  var fieldsRequired    = [userName, userSurname, userId];          // fields to be tested

// helper function to check class of a specified element --> ng-valid / ng-invalid etc.
  var hasClass = function (element, cls) {
    return element.getAttribute('class').then(function (classes) {
      return classes.split(' ').indexOf(cls) !== -1;
    });
  };

// The testing function
  function testRequired(fieldsRequired) {
    //1. loop through each field
      for (var i = 0; i < fieldsRequired.length; i++) {

      //2. Reset page  prior to each test
        browser.get('http://sometestlink.html');      

      //3. Populate field with dummy data
        fieldsRequired[i].sendkeys();  

      //4,5 & 6. Protractor test
        it('should fail validation when ' + fieldsRequired[i] + ' is missing', expect(hasClass(fieldsRequired[i],'ng-valid')).toEqual(false));
      }
  }
});

解决方案

There are a few issues in your code:

1. Your it block will never be executed because you are not calling the testRequired function
2. sendkeys() should be sendKeys(), and you are not sending any text, it's empty

You could try achieve what you described with this:

describe('Sample form', function() {

    // helper function to check class of a specified element --> ng-valid / ng-invalid etc.
    var hasClass = function (element, cls) {
        return element.getAttribute('class').then(function (classes) {
            return classes.split(' ').indexOf(cls) !== -1;
        });
    };

    var fields = {
        'userName': element(by.model('user.name')),
        'userSurname': element(by.model('user.surname')),
        'userId': element(by.model('user.id'))
    };

    for(var field in fields) {
        (function(field) {                
            it('should fail validation when ' + field + ' is missing', function () {
                browser.get('http://sometestlink.html');
                fields[field].sendKeys('dummy_data');
                expect(hasClass(fields[field], 'ng-valid')).toEqual(false);
            });
        })(field);
    };
});

这篇关于穿过田野在角形式循环使用量角器测试输入验证？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！