使用Angular UI日期選擇器進行E2E測試

第一篇文章。我有一種情況，我正在使用jQuery UI的datepicker來設置模型屬性。這是用Angular UI完成的，似乎運行良好，但我很難在E2E方案中測試它。使用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測試中如何去做，或者直接設置模型屬性，我也不知道該怎麼做。

任何人都可以提供任何見解嗎？謝謝。

來源

2013-04-01 user2233487

首先加入您的描述功能：

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

（從How to execute jQuery from Angular e2e test scope?拍攝）

然後打開並選擇日期用途：

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

哪裏datepickerElementId是日期選擇器的ID元素在你的HTML /模板中。

來源

2013-10-08 07:26:57 gnom1gnom

對我來說，element(selector, label).{method}(value)工作。

在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-23 16:09:06 csikosjanos

使用Angular UI日期選擇器進行E2E測試

回答

相關問題