sendKeys()仅传递部分值或无法在日期字段中输入日期输入

时间:2018-07-04 05:37:11

标签: protractor

我正在使用量角器版本5.2.2。我的项目中有2个日期字段。我使用以下代码输入日期输入。

element(by.xpath("//*[@id='divContractInfo']/div[1]/div[2]/div/my-date-picker/div/div/input")).sendKeys("01-02-2019");
browser.sleep(5000);
element(by.xpath("//*[@id='divContractInfo']/div[1]/div[3]/div/my-date-picker/div/div/input")).sendKeys("12-02-2020");

使用此代码,只有输入的第一个字符输入第一日期字段,而第二个日期输入则完全输入第二个日期字段。

当我使用了另一个代码(如下所示)时,日期值已完全输入到日期输入框中,但是在输入表单中的其他字段时会出现验证错误,因为``需要日期''。解决方案?

var inputEle = element(by.xpath("//*[@id='divContractInfo']/div[1]/div[2]/div/my-date-picker/div/div/input"));
var inputValue = 04-12-2020;
inputEle.click();
browser.executeScript('arguments[0].value=arguments[1]', 
                  inputEle.getWebElement(), 
                  inputValue); 

UI代码(角度)如下。

<div _ngcontent-c6="" class="frx-form-field-container">
  <label _ngcontent-c6="" class="frx-form-label">Effective Date:</label>
    <div _ngcontent-c6="" class="frx-form-input-field-container-small">
      <my-date-picker _ngcontent-c6="" class="frx-mydatepicker-field ng-pristine ng-valid ng-touched" formcontrolname="effectiveDate" frxconfirmequalvalidator="terminationDate" name="effectiveDate" ng-reflect-frx-confirm-equal-validator="terminationDate" ng-reflect-options="[object Object]" ng-reflect-name="effectiveDate" ng-reflect-frx-validate="[object Object]" ng-reflect-validation-message="" ng-reflect-status="false"><div class="mydp" ng-reflect-ng-style="[object Object]" style="width: 145px;"><!--bindings={
       "ng-reflect-ng-if": "true"                 
       }--><div class="selectiongroup"><!--bindings={
      "ng-reflect-ng-if": "true"
      }--><input autocomplete="off" autocorrect="off" class="selection ng-pristine ng-valid ng-touched" ngtype="text" spellcheck="false" ng-reflect-klass="selection" ng-reflect-ng-class="[object Object]" ng-reflect-ng-style="[object Object]" ng-reflect-is-disabled="false" ng-reflect-model="06-24-2018" aria-label="Date input field" placeholder="" style="height: 28px; font-size: 14px;"><div class="selbtngroup" style="height: 28px;"><!--bindings={
      "ng-reflect-ng-if": "false"
      }--> <!--bindings={
      "ng-reflect-ng-if": "false"
      }--> <!--bindings={
     "ng-reflect-ng-if": "true"
     }--><button class="btnclear btnclearenabled" type="button" ng-reflect-klass="btnclear" ng-reflect-ng-class="[object Object]" aria-label="Clear Date"><span class="mydpicon icon-mydpremove"></span></button> <button class="btnpicker btnpickerenabled" type="button" ng-reflect-klass="btnpicker" ng-reflect-ng-class="[object Object]" aria-label="Open Calendar"><span class="mydpicon icon-mydpcalendar"></span></button></div></div><!--bindings={
     "ng-reflect-ng-if": "false"
     }--></div></my-date-picker>
   </div>
</div>
<div _ngcontent-c6="" class="frx-form-field-container">
  <label _ngcontent-c6="" class="frx-form-label">Termination Date:</label>
    <div _ngcontent-c6="" class="frx-form-input-field-container-small">
      <my-date-picker _ngcontent-c6="" class="frx-mydatepicker-field ng-untouched ng-pristine ng-valid" formcontrolname="terminationDate" frxconfirmequalvalidator="effectiveDate" name="terminationDate" ng-reflect-frx-confirm-equal-validator="effectiveDate" ng-reflect-options="[object Object]" ng-reflect-name="terminationDate" ng-reflect-frx-validate="[object Object]" ng-reflect-validation-message="" ng-reflect-status="false"><div class="mydp" ng-reflect-ng-style="[object Object]" style="width: 145px;"><!--bindings={
      "ng-reflect-ng-if": "true"
      }--><div class="selectiongroup"><!--bindings={
      "ng-reflect-ng-if": "true"
      }--><input autocomplete="off" autocorrect="off" class="selection ng-untouched ng-pristine ng-valid" ngtype="text" spellcheck="false" ng-reflect-klass="selection" ng-reflect-ng-class="[object Object]" ng-reflect-ng-style="[object Object]" ng-reflect-is-disabled="false" ng-reflect-model="06-24-2019" aria-label="Date input field" placeholder="" style="height: 28px; font-size: 14px;"><div class="selbtngroup" style="height: 28px;"><!--bindings={
     "ng-reflect-ng-if": "false"
     }--> <!--bindings={
    "ng-reflect-ng-if": "false"
     }--> <!--bindings={
    "ng-reflect-ng-if": "true"
    }--><button class="btnclear btnclearenabled" type="button" ng-reflect-klass="btnclear" ng-reflect-ng-class="[object Object]" aria-label="Clear Date"><span class="mydpicon icon-mydpremove"></span></button> <button class="btnpicker btnpickerenabled" type="button" ng-reflect-klass="btnpicker" ng-reflect-ng-class="[object Object]" aria-label="Open Calendar"><span class="mydpicon icon-mydpcalendar"></span></button></div></div><!--bindings={
   "ng-reflect-ng-if": "false"
   }--></div></my-date-picker>
 </div>
</div>

我不明白第一次输入日期未完全输入的原因。谢谢。

1 个答案:

答案 0 :(得分:0)

两个日期选择器的

UI代码似乎相同,因此元素选择正确。在输入第一个日期输入之前,请尝试添加sleep