如何定位动态输入字段并在量角器中传递值

时间:2016-07-06 03:29:51

标签: javascript angularjs node.js protractor

请有人帮助我找到动态元素并使用量角器将值发送到该元素。 这是我的purchaseInfo.html代码段,其中输入字段在页面上动态加载:

<div class="row subpage-submit-flow">
  <div class="col-md-12">
    <!-- progress bar -->
    <uib-progressbar value="45" class="in-progress"></uib-progressbar>
    <!-- end progress bar -->
    <div class="page-header">
      <h2 id="purchaseInfo-header" translate="content.PURCHASE_INFO_HEADER"></h2>
      <p id="purchaseInfo-reqFieldLbl" translate="content.PURCHASE_INFO_REQUIRED_FIELD_LABEL"></p>
    </div>
    <div class="row">
      <div class="col-md-12">
        <p ng-show="purchaseInfo.$invalid" class="error-message pull-right">
          *Please complete all required fields.
        </p>
      </div>
    </div>
    <div class="clearfix"></div>
    <div class="row">
      <div ng-class="purchaseInfoCtrl.receiptImage ? 'col-md-6' : 'col-md-12'">
        <form name="purchaseInfo" novalidate>
          <div ng-if="webAttributes" class="row">
              <div ng-repeat="webAttribute in webAttributes track by $index">
                <div class="clearfix" ng-if="$index % 2 == 0"></div>
                 <div ng-class="purchaseInfoCtrl.receiptImage ? 'col-md-12' : 'col-md-6'">
                    <div ng-if="purchaseInfoCtrl.isTextField(webAttribute) || purchaseInfoCtrl.isCurrencyField(webAttribute)"
                        class="form-group">
                      <p class="noMargin"
                          ng-show="purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$viewValue || webAttribute.focused"
                          ng-class="(purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$invalid && purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$dirty) ? 'input-error-label' : (webAttribute.focused) ? 'activeFieldLabel' : 'inactiveFieldLabel'">
                        <span>{{ webAttribute.displayValue }}</span>
                      </p>
                      <input id="{{ webAttribute.name }}" border-color ng-if= "webAttribute.webAttributeType == 'C'" ng-focus="purchaseInfoCtrl.focus($event)"
                          ng-blur="purchaseInfoCtrl.blur($event)"
                          ng-class="purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$dirty && purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$invalid ? 'input-error' : ''"
                          class="noBorderTextBox" type="text" class="form-control noBorderTextBox" name="{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}"
                          ng-model="purchaseInfoCtrl.model.attributes[webAttribute.webAttributeIndex].value"
                          placeholder="{{ webAttribute.displayValue }}"
                          ng-required="webAttribute.mandatory"
                          ng-pattern="/^[^<%>\\\\]+$/">
                      <input id="{{ webAttribute.name }}" border-color ng-if= "webAttribute.webAttributeType == 'P'" ng-focus="purchaseInfoCtrl.focus($event)"
                           ng-blur="purchaseInfoCtrl.blur($event)"
                           ng-class="purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$dirty && purchaseInfo.{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}.$invalid ? 'input-error' : ''"
                           class="noBorderTextBox" type="text" class="form-control noBorderTextBox" name="{{webAttribute.webAttributeType}}{{webAttribute.webAttributeIndex}}"
                           ng-model="purchaseInfoCtrl.model.product.attributes[webAttribute.webAttributeIndex].value"
                           placeholder="{{ webAttribute.displayValue }}"
                           ng-required="webAttribute.mandatory"
                           ng-pattern="/^[^<%>\\\\]+$/">
                    </div>

我正在关注页面对象模式,在我的purchaseInfo-pageObject.js类中,我已经编写了以下函数并从purchaseInfo_spec.j中调用它。令人惊讶的是,sendKeys无法正常工作,但是显示器和发送值正在控制台中打印出来。请帮助我。我会很感激的。提前谢谢。

this.inputFieldsAll = function (){
this.inputElems = element.all(by.repeater('webAttribute in webAttributes track by $index')).get(1);
if (this.inputElems.isDisplayed()){
 this.inputElems.sendKeys('764763688888');
 console.log('dispalyed&sendvalues');
}
this.inputElems.getText().then(function(val){
  console.log('value: ',val);
});

1 个答案:

答案 0 :(得分:1)

首先,您当前的代码存在一个主要问题:

if (this.inputElems.isDisplayed()) {

isDisplayed()返回 promise ,它始终是&#34; truthy&#34;,因此无论实际显示状态如何,条件始终为true。

另一个问题与您尝试将密钥发送到哪个元素有关。目前,您将密钥发送到与转发器匹配的div元素。相反,您需要找到内部input元素:

var inputs = element.all(by.repeater('webAttribute in webAttributes')).get(1).all(by.tagName("input"));
inputs.first().sendKeys("764763688888");