жасминовый тест запускается еще до того, как сработает .click()

Я просто играю с базовым рубиновым приложением, которое изменяет атрибут направления html при нажатии кнопки. Он отлично работает на стороне JQuery, но в моем тестовом примере работает, даже когда срабатывает .click(). Вот мои файлы.

display.html.erb

<p>
<%= button_tag 'Convert', id: 'test', remote: 'true' %>
</p>

Jquery: конвертация.js

$(document).ready(function(){
  $('#test').on('click', setHtmlStyle);
});
var setHtmlStyle = function(){
var $style = $('html');
$style.attr('dir', $style.attr('dir') === 'rtl' ? 'ltr' : 'rtl');
};

Спецификация: convert_spec.js

describe('#test', function (){
  beforeEach(function(){
    loadFixtures('conversion.html');
  });
  describe('Clicking test button', function(){
    it('should have an attribute', function(){
      $('#test').click();
      expect($('html').attr('dir')).toBe('rtl');
    });
  });

Крепление: convert.html

<html>
<input type='button' name='Convert' id='test'>
</html>

Вот сообщение об ошибке, когда я запускаю свои тесты:

Failure/Error: Expected 'ltr' to be 'rtl'.

Любая помощь или предложения будут по-настоящему оценены. Спасибо.


javascript jquery jasmine jasmine-jquery
person Teja    schedule 24.05.2015    source источник
comment
вход id='rtl' должен быть id='test' правильно?   -  person Hacketo    schedule 25.05.2015
comment
Да, отредактировал его для моего вопроса. Спасибо.   -  person Teja    schedule 25.05.2015
comment
Я не очень хорошо знаю Жасмин. Но пытались ли вы выполнить асинхронное ожидание?   -  person João Mosmann    schedule 25.05.2015
comment
Я только начала работать с жасмином. Я не уверен, что async expect сделал бы. Не могли бы вы уточнить?   -  person Teja    schedule 25.05.2015
comment
в принятом ответе есть пример ожидание не работает внутри асинхронного обратного вызова"> stackoverflow.com/questions/15141834/   -  person João Mosmann    schedule 25.05.2015
comment
@JoãoMosmann Попытался использовать пример из jasmine.github.io/2.0/ но так и не решил свою проблему.   -  person Teja    schedule 25.05.2015

Ответы (3)


arrow_upward
1
arrow_downward

Я изменил свой код, чтобы убедиться, что функция .click() работает.

$(document).ready(function(){
  $(document).on('click', '#test', setHtmlStyle);
});

var setHtmlStyle = function(){
  var $style = $('html');
  $style.attr('dir', $style.attr('dir') === 'rtl' ? 'ltr' : 'rtl');
};
person Teja    schedule 04.06.2015

arrow_upward
0
arrow_downward

Проблема в том, что attr('dir') не определен, его значение равно 'undefined', если вы явно установите для атрибута тега значение 'rlt' или 'ltr', он будет иметь строковое значение, которое вы установили.

$style.attr('dir', $style.attr('dir') === 'rtl' && typeof $style.attr('dir') !== "undefined" ? 'ltr' : 'rtl');

неопределенный

person Ghazi Triki    schedule 25.05.2015
comment
Это все еще не решает мою проблему. Я изменил сценарий и запустил тест, но все равно показывает то же сообщение об ошибке. - person Teja; 25.05.2015

arrow_upward
0
arrow_downward

Я только что попробовал ваш код и заставил его работать со следующей простой модификацией (в дополнение к реализации быстрого обходного пути для драгоценного камня jasmine-jquery-rails для загрузки приборов):

$('#test').click();

меняется на

setHtmlStyle();

Это заставило тест работать правильно.

Jasmine — это инструмент для модульного тестирования низкоуровневого кода JavaScript, в котором элементы DOM скрыты от просмотра во время выполнения. Таким образом, выполнение click() с jQuery не имеет никакого эффекта.

Это означает, что в отличие от Selenium или Capybara, цель Jasmine — помочь разработчику в тестировании/тестировании низкоуровневых логических модулей JavaScript, таких как вычисления и некоторые легкие манипуляции с DOM.

Быстрый вывод из этого заключается в том, что вы пишете свои тесты для низкоуровневых методов JavaScript, которые выполняют работу для взаимодействия с пользователем, но не для методов, включающих click() и тому подобное. Это поможет вам получить быструю обратную связь при тестировании небольших функций. Другими словами, это относится к фазе «внутри» тестирования BDD снаружи-внутри.

Фаза «out» должна быть решена с помощью интеграционного тестирования (полное сквозное сквозное тестирование) с использованием таких инструментов, как Selenium, Capybara и Cucumber.

Я надеюсь, что вы найдете это полезным. Если у вас есть дополнительные вопросы, дайте мне знать в комментариях.

Вот хорошая дополнительная презентация по этой теме, которая раскрывает разницу между сквозной интеграцией и тестированием, ориентированным на просмотр JavaScript: BDD с JS

Тем не менее, я настоятельно рекомендую поговорить с опытным разработчиком о Outside-In BDD и о том, как он разбивает процесс на сквозные интеграционные тесты (Cucumber), модульные тесты браузера JavaScript (Jasmine) и низкоуровневый серверный модуль. тесты (например, RSpec).

person Andy Maleh    schedule 27.05.2015