2009-02-06 6 views

ответ

49

Для насмешливый Ajax запросов, вы можете попробовать что-то вроде этого ...

Вот функция, которую вы хотите проверить:

var functionToTest = function() { 
     $.ajax({ 
      url: 'someUrl', 
      type: 'POST', 
      dataType: 'json', 
      data: 'foo=1&foo=2&foo=3', 
      success: function (data) { 
       $('#main').html(data.someProp); 
      } 
     }); 
    }; 

Вот тестовый пример:

test('ajax mock test', function() { 
     var options = null; 
     jQuery.ajax = function (param) { 
      options = param; 
     }; 
     functionToTest(); 
     options.success({ 
      someProp: 'bar' 
     }); 
     same(options.data, 'foo=1&foo=2&foo=3'); 
     same($('#main').html(), 'bar'); 
    }); 

Это по существу переопределение функции ajax jQuery, а затем проверяет следующее 2 вещи: - значение, которое передается функции AJAX - вызывает обратный вызов и утверждает, что он сделал то, что он должен был сделать

+4

меня ушел около получаса, чтобы получить функцию (пары) {опции = пары;}, но затем он ударил меня .. . Очень круто. –

+0

Nice. Действительно мило. – StuperUser

+0

Если вы тестировали вложенные вызовы, лучше ли сохранить эти параметры в массиве и для каждого вызова .push() объектов объектов в этот массив? – StuperUser

5

Я только начал использовать Sinon.JS, что позволяет насмехаться над XMLHttpRequests, а также предлагает простой API фальшивого сервера. Действительно прост в использовании! Он также предлагает интеграцию с qunit.

15

Вместо того, чтобы переопределять функцию AJAX jQuery, вы также можете использовать плагин jQuery Mockjax, разработанный .appendTo. Этот плагин, по сути, делает то, что предлагает другой ответ, но он позволяет гораздо более изощренно высмеивать. Например, если у вас есть функция:

$.ajax({ 
    url:"/api/user", 
    type:"GET", 
    dataType:"json", 
    data:'{"uid":"foobar"}', 
    success:function(data){ 
     console.log("Success!"); 
    }, 
    error:function(data){ 
     console.log("Error!"); 
    } 
}); 

Вы можете дразнить его с mockjax просто вызвав функцию mockjax, которая автоматически включается в JQuery:

$.mockjax({ 
    url:"/api/user", 
    type:"GET", 
    response:function(requestData){ 
     //handle the mock response in here 
     this.responseText = '{"fullname":"Mr. Foo Bar"}'; 
    } 
}); 

Вторая функция насмешливый может быть включена во внешнем файле JavaScript, скажем, «mocks.js», и единственное, что нужно сделать, это включить библиотеку mockjax (которую можно найти по адресу https://github.com/appendto/jquery-mockjax/). Единственное, о чем нужно помнить, это то, что это будет только издеваться над jQuery ajax-вызовами, а не ко всем XMLHttpRequests. Если вы хотите это сделать, следуйте советам @ bertvh и используйте Sinon.js.

+1

+1 для использования mockjax. Я только начал использовать его, и это очень хорошо для модульного тестирования, а также фиктивных данных для разработки экрана. Единственная проблема, с которой я столкнулся, - это файлы данных json, которые кэшируются браузером Chrome. При очистке кеша исправлены все проблемы с устаревшим файлом. – Evildonald

Смежные вопросы