2016-11-04 12 views
1

私はここから来ています:How to make an AJAX call without jQuery?JasmineとPromiseで行われるVanilla JS Ajaxの呼び出しをどのようにテストしますか?

プロミス、AJAXコール、またはその両方をモックするのは難しいです。

これまでのところ、jasmine-ajaxで試してみましたが、bug ...のように見えますが、明らかに「ブラウザ環境のみ」です。

私はXMLHttpRequestオブジェクトをモックしようとしましたが、成功しませんでした。

だから、私は私のオプションはここにいるのかわからないよ:XMLHttpRequestをを嘲笑する方法概念の

function get(url) { 
    return new Promise((resolve, reject) => { 
    const req = new XMLHttpRequest(); 
    req.open('GET', url); 
    req.onload =() => req.status === 200 ? resolve(req.response) : reject(Error(req.statusText)); 
    req.onerror = (e) => reject(Error(`Network Error: ${e}`)); 
    req.send(); 
    }); 
} 

答えて

0

証明

function get(url) { 
 
    return new Promise((resolve, reject) => { 
 
    const req = new XMLHttpRequest(); 
 
    req.open('GET', url); 
 
    req.onload =() => req.status === 200 ? resolve(req.response) : reject(Error(req.statusText)); 
 
    req.onerror = (e) => reject(Error(`Network Error: ${e}`)); 
 
    req.send(); 
 
    }); 
 
} 
 

 
describe('XMLHttpRequest', function() { 
 
    var xhr 
 
    var urls 
 

 
    beforeEach(() => { 
 
    xhr = { 
 
     open: (_type_, _url_) => { 
 
     xhr.status = urls[_url_].status 
 
     xhr.response = urls[_url_].response 
 
     xhr.statusText = urls[_url_].statusText 
 
     }, 
 
     send:() => { 
 
     setTimeout(xhr.onload, 1) 
 
     } 
 
    } 
 

 
    XMLHttpRequest = jasmine.createSpy(xhr).and.returnValue(xhr) 
 
    }) 
 

 
    it('resolves query with `response`', function(done) { 
 
    urls = { 
 
     'http://foo/bar': { 
 
     response: 'some other value', 
 
     status: 200 
 
     } 
 
    }; 
 

 
    get('http://foo/bar') 
 
    .then(r => expect(r).toBe('some other value'), e => expect(e).toBe(undefined)) 
 
     .then(done) 
 
    }) 
 

 
    it('rejects query with `statusText`', function(done) { 
 
    urls = { 
 
     'http://baz/quux': { 
 
     response: 'some other value', 
 
     status: 500, 
 
     statusText: 'some error' 
 
     } 
 
    }; 
 

 
    get('http://baz/quux') 
 
    .then(r => expect(r).toBe(undefined), e => expect(e.message).toBe('some error')) 
 
     .then(done) 
 
    }) 
 
})
<script src="https://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script> 
 
<link href="https://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet" />

+0

それは非常にいいです、もののテストを実行すると "[SyntaxError]"という警告が表示されます。注意:私はnpmからジャスミンを使用しています。 – gugol

関連する問題