无法为量角器中的日期选择器提供日期值

Question

我使用 angular 4 和量角器 5.2.2 和黄瓜 3.2.0 我的 HTML 代码如下所示

<div _ngcontent-c2="" class="row">
                        <div _ngcontent-c2="" class="col-md-6">
                            <label _ngcontent-c2="" class="form-control-label frx-label" for="normal-field" id="lblDOB">
                                DOB </label>
                            <span _ngcontent-c2="">
                                <b _ngcontent-c2="">:</b>
                            </span>
                        </div>

                        <div _ngcontent-c2="" class="col-md-6">
                            <ng-datepicker _ngcontent-c2="" class="frx-ng2-date-picker ng-untouched ng-pristine ng-valid" _nghost-c3="" ng-reflect-options="[object Object]" ng-reflect-model="Fri Jan 12 2018 12:09:37 GMT+0"><div _ngcontent-c3="" class="ngx-datepicker-container"> <!--bindings={
"ng-reflect-ng-if": "true"
}--><input _ngcontent-c3="" class="ngx-datepicker-input ng-pristine ng-valid ng-touched" readonly="readonly" type="text" ng-reflect-model="01-12-2018">  <!--bindings={
 "ng-reflect-ng-if": "false"
}--> </div> </ng-datepicker>

                        </div>
                    </div>

我无法通过使用给出日期值

element(by.css(".ngx-datepicker-container input")).sendKeys("08-02-1990");

但是当我尝试点击同一个元素时，日期选择器弹出窗口将打开。 有什么想法吗？

Answer 1

因为输入设置为readonly="readonly"，所以sendKeys不能输入任何单词。

选项1）执行javascript设置输入值：

var inputEle = element(by.css(".ngx-datepicker-container input"));
var inputValue = '08-02-1990';
browser.executeScript('arguments[0].value=arguments[1]', 
                      inputEle.getWebElement(), 
                      inputValue);
// Click on the input box of Date to make application can detect the changes
// on input
inputEle.click(); // open date picker pop-up <br>
inputEle.click(); // close date picker pop-up <br>

选项 2) 执行 javascript 更改 Angular 模型

前提条件：
1.你的应用是Angularjs App
2.您知道存储输入值的模型名称（如果不知道请咨询开发人员）

我会用https://angularjs.org/上的例子来说明：

var modelEle = element(by.xxx) //elemnt binded the model name; 
// please find out which element binded the model name to store the date input by user
var modelName = '';

var modelValue = '08-02-1990';

var script = 'angular.element(arguments[0]).scope()' + 
             '.$apply(function(scope){scope[arguments[1]] = arguments[2]})';

browser.executeScript(script, 
                      modelEle.getWebElement(),
                      modelName,
                      modelValue);