E2E-тестирование с помощью средства выбора даты Angular UI

Первый пост. У меня есть ситуация, когда я использую средство выбора даты пользовательского интерфейса jQuery для установки атрибутов модели. Это делается с помощью пользовательского интерфейса Angular и, кажется, работает хорошо, но мне трудно протестировать его в сценариях 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. Мои первоначальные мысли состояли в том, чтобы либо установить средство выбора даты через jquery, но я не уверен, как я буду делать это в тесте E2E, либо напрямую установить атрибут модели, что я также не знаю, как это сделать.

Может ли кто-нибудь дать представление, пожалуйста? Спасибо.


integration-testing angularjs angular-ui jquery-ui-datepicker
person user2233487    schedule 01.04.2013    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Сначала добавьте в свою функцию описания:

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));
        });
    };
});

(взято из Как выполнить jQuery из области тестирования Angular e2e? < /а>)

Затем, чтобы открыть и выбрать дату, используйте:

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

Где datepickerElementId — это идентификатор элемента datepicker в вашем html/template.

person gnom1gnom    schedule 08.10.2013

arrow_upward
0
arrow_downward

Для меня элемент (селектор, метка).{метод}(значение) работал.

В 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')

Надеюсь, это было полезно.

person csikosjanos    schedule 23.01.2014