2013-07-17 3 views
3

У меня есть приложение angular.js, которое должно установить фокус на определенный элемент при выполнении чего-либо (т. Е. Установить фокус на недопустимое поле формы, чтобы пользователь мог исправить ошибку).Угловые тесты e2e: Как проверить, получил ли элемент фокус?

Я пытаюсь проверить это поведение в тесте углового э2э:

it('should set the focus to the invalid field', function() { 
    input('email').enter('foo'); // this is not a valid email address 
    element(/* submit button */).click(); // try to submit the form 

    // How do I do this? 
    expect(element(/* email input element */)).toHaveTheFocus(); 
}); 

Как я могу ожидать некоторый элемент к (не) имеет фокус? я уже попробовал «: фокус» селектор

expect(element('input[id="..."]:focus').count()).toBe(1); 

, но не успех (вдохновленный Testing whether certain elements are visible or not).

Чтобы установить фокус, я использую идею How to set focus on input field?

Я также пишу тесты для этого и в конечном итоге с помощью шпиона на функцию DOM фокусировки() (который, насколько я знаю, не представляется возможным/желательным для тестов e2e).

+0

у меня была такая же проблема при попытке проверить настройка фокуса на вход. Попробуйте вставить тестовый элемент в DOM (но это мне не помогло). –

+0

Я использую директиву, которая добавляет всплывающую подсказку в DOM, когда установлен фокус. Поэтому я могу проверить правильность фокуса, проверяя правильность всплывающей подсказки. 'expect (element ('input [id =" myInput "] + div.tooltip'). count()). toBe (/ * 0 (без фокуса) или 1 (фокус) * /)' Довольно хакерский :-(, но работает как минимум. –

+0

Этот взгляд перспективен: http://stackoverflow.com/questions/5318415/which-browsers-support-document-activeelement Возможно, есть способ добавить новый совпадение, в котором используется элемент и document.activeElement. –

ответ

0

Здесь я вижу два варианта. Первый, который я действительно рекомендую, особенно на тестах E2E, заключается в использовании Jasmine-jQuery, который предоставляет сопряжение toBeFocused, которое имеет дело с этим.

Если вы не хотите включать Жасмин-JQuery, потому что это слишком большой или потому, что вам не нравится, то у вас есть два варианта:

  • Сравните кнопку с активным элементом документа, может доступ к нему с: document.activeElement
  • Сравнить кнопку с активным элементом документа, загрузив ее с самого элемента (это путь жасмин-JQuery делает это) с: DOMELEMENT.ownerDocument.activeElement
Смежные вопросы