Ajax unit test using Jasmine "TypeError: Cannot read property 'done' of undefined"
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function download() {
     $.ajax({
        method: 'GET',
        url: 'http://jsonplaceholder.typicode.com/posts',
    }).done(function(data) {
         //processJasonData(data)
    }).fail(function () {
         //$fail();
    })
}</code></pre>
</div>
</div>
</p>

<p>Im trying to make unit test with Jasmine using ajax but i get "TypeError: Cannot read property 'done' of undefined".</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>describe('AJAX check', function () {
    var url = "http://jsonplaceholder.typicode.com/posts";

    it('test1', function () {
        spyOn($, "ajax");
        download(url);
        expect($.ajax).toHaveBeenCalled();
    });

});</code></pre>
</div>
</div>

Anyone know how to resolve this problem ? And how to check when ajax is done?
I think I should use promises and deferred in this case, so can someone explain them to me?
(I`m using jQuery > 1.5)</p>

<p>rest code : </p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function download(url) {
     $.ajax({
        method: 'GET',
        url: url,
    }).done(function(data) {
         processJasonData(data)
    }).fail(function () {
         $fail();
    })
}

function $fail() {
    var error_msg_1 = '&lt;div class="jumbotron text-center"&gt;&lt;h1 style="size: 10px;color: red"&gt; Faill &lt;/h1&gt;&lt;/div&gt;';
    $('.tresc').html(error_msg_1);
}
function processJasonData(data) {
    var _data = $('.panel-group');
    var dataTemplate = $('#item_tmp').html();
     $.each(data, function (i, item) {
        _data.append(Mustache.render(dataTemplate, item));
    });
}</code></pre>
</div>
</div>
</p>