JestJs認爲阿賈克斯不叫

我有很多麻煩得到一個簡單的笑話測試工作。笑話堅持說我的Ajax調用沒有發生，並顯示錯誤消息：JestJs認爲阿賈克斯不叫

FAIL authTest.js (1.828s) 
● Authentication: Logging In › it Doesn't currently have a logged in user 
    - Expected Function to be called with { url : 'api/loggedin', type : 'GET', error :  <jasmine.any(function Function() { [native code] })>, success : <jasmine.any(function Function() { [native code] })> }. 
    at Spec.<anonymous> (/Users/ritmatter/reps/spec/authTest.js:13:20) 
    at Timer.listOnTimeout [as ontimeout] (timers.js:110:15)

的代碼被測試是在一個名爲auth.jsx文件，它看起來像這樣：

loggedIn: function() { 
    return $.ajax({ 
    url: 'api/loggedin', 
    type: 'GET', 
    error: function(xhr, status, err) { 
     return false; 
    }.bind(this), 
    success: function(data) { 
     return true; 
    }.bind(this), 
    }); 
},

測試看起來像這樣：

/** @jsx React.DOM */ 
"use strict"; 
var React = require('react/addons'); 
var TestUtils = React.addons.TestUtils; 

describe('Authentication: Logging In', function() { 
    it('Doesn\'t currently have a logged in user', function() { 
    var $ = require('jquery'); 
    jest.dontMock('../js/auth.jsx'); 
    var auth = require('../js/auth.jsx'); 
    auth.loggedIn(); 
    expect($.ajax).toBeCalledWith({ 
     url: 'api/loggedin', 
     type: 'GET', 
     error: jasmine.any(Function), 
     success: jasmine.any(Function) 
    }); 
    }); 
});

任何想法爲什麼開玩笑會認爲這沒有被調用？我一直在環顧四周，似乎有一些關於dontMock（）和mock（）的錯誤。

來源

2014-10-07 ritmatter

您不能從反應組件外部調用react組件方法，除非它們位於'statics：{}'對象中。儘管靜態方法不能訪問組件的實例。 – 2014-10-07 09:07:03

Auth是一個普通的javascript對象，而不是一個反應組件，所以我不認爲這應該是一個問題。該文件在此處緊密模擬教程：http://facebook.github.io/jest/docs/tutorial.html#content，但auth是.jsx文件而不是.js文件。 – ritmatter 2014-10-07 14:40:01

是的，它是一個.jsx文件令人困惑，因爲爲什麼一個無反應的組件類方法會在.jsx而不是.js中？ – 2014-10-07 15:51:18

我在初始化時調用ajax的React組件有類似的問題。我發現expect在$只有在it方法以外需要jquery纔有效。

我的陣營組件和測試用例是這樣的（他們是ES6但你可以得到的想法）

import React from 'react' 
import $ from 'jquery' 

export default class MyComponent extends React.Component { 

    constructor(props) { 
    super(props); 
    this.state = {things:[]}; 
    } 

    componentWillMount() { 
    $.ajax({ 
     url: 'http://localhost:3000/things', 
     success: (result) => this.setState(result), 
     error: (ex) => console.log(ex) 
    }) 
    } 

    render() { 
    //stuff 
    } 
}

和測試

jest.dontMock('../components/MyComponent') 

import React from 'react' 
import TestUtils from 'react-addons-test-utils' 
import $ from 'jquery' 

const Wall = require('../components/MyComponent'); 

describe('MyComponent',() => { 

    it('calls the things end point',() => { 
    const myComp = TestUtils.renderIntoDocument(<MyComponent />) 

    expect($.ajax).toBeCalledWith({ 
     url: 'http://localhost:3000/things', 
     success: jasmine.any(Function), 
     error: jasmine.any(Function) 
    }) 
    }); 
});

來源

2015-10-30 11:43:06

正如瓦格納所說，你需要導入的jQuery全球範圍內，在您的測試之外。您的組件使用的是全局版本$，所以添加var $ = require('jquery')對於將全局變量$添加到jquery中並沒有做任何事情。

你也沒有模擬ajax調用。

當測試反應，我避免裝載jQuery的問題，通過簡單地重新定義$：

window.$ = {ajax: jest.genMockFunction()}

所以，只要你不需要爲別的除了Ajax調用jQuery的，這一個行會模擬jquery根並模擬ajax調用。

來源

2015-12-18 15:22:34

JestJs認爲阿賈克斯不叫

回答

相關問題