2

第一篇文章。我有一种情况,我使用 jQuery UI 的 datepicker 来设置模型属性。这是使用 Angular UI 完成的,并且似乎运行良好,但我很难在 E2E 场景中对其进行测试。

这是html:

<form ng-submit="submitForm(request)">
    <input ng-model="request.startDate" ui-date placeholder="Start Date" />
</form>

这是控制器:

$scope.submitForm = function(request) {
    var startDateStr = $filter('date')(request.startDate, dateFilterFormat);
    // Do something with startDateStr.

    var startYear = request.startDate.getFullYear();
    var startMonth = request.startDate.getMonth(); // 0-based.
    var startDayOfMonth = request.startDate.getDate();
    // Do something with date fields.
}

我试图在我的 E2E 测试中设置输入字段,但似乎没有设置日期选择器。当我尝试访问模型时,我得到的是预期的字符串,而不是像使用 Angular UI 那样的日期对象。我最初的想法是要么通过 jquery 设置 datepicker,但我不确定我将如何在 E2E 测试中执行此操作,或者直接设置模型属性,我也不知道该怎么做。

任何人都可以提供任何见解吗?谢谢。

4

2 回答 2

1

首先添加您的描述功能:

angular.scenario.dsl('jQueryFunction', function() {
    return function(selector, functionName /*, args */ ) {
        var args = Array.prototype.slice.call(arguments, 2);
        return this.addFutureAction(functionName, function($window, $document, done) {
            var $ = $window.$; // jQuery inside the iframe
            var elem = $(selector);
            if (!elem.length) {
                return done('Selector ' + selector + ' did not match any elements.');
            }
            done(null, elem[functionName].apply(elem, args));
        });
    };
});

(取自如何从 Angular e2e 测试范围执行 jQuery?

然后打开并选择日期使用:

jQueryFunction('#datepickerElementId', "focus");
jQueryFunction('ul.dropdown-menu span:contains("07")', "click");

其中 datepickerElementId 是 html/模板中 datepicker 元素的 id。

于 2013-10-08T07:26:57.003 回答
0

对我来说,元素(选择器,标签)。{方法}(值)正在工作。

在coffeescript中我做了一个小帮手:

@UiDateHelper =
  selectCalendarDay: (day) ->
    element("[ui-date] a:contains('#{day}')").click()

  selectCalendarYear: (year) ->
    element('[data-handler="selectYear"]').val(year)

  selectCalendarMonth: (month) ->
    element('[data-handler="selectMonth"]').val(month - 1)

  selectDate: (date) ->
    year = date.substr(0, 4)
    month = date.substr(5, 2)
    day = date.substr(8, 2)
    @selectCalendarYear(year)
    @selectCalendarMonth(month)
    @selectCalendarDay(day)

UiDateHelper.selectDate('2014-01-21')

希望这很有用。

于 2014-01-23T16:09:06.003 回答