在Jasmine测试中处理WebSocket连接

Question

我有我的test.login.js:

it('calls login when there's a username present', () => {
    React.findDOMNode(LoginElement.refs.username).value = 'foo';
    TestUtils.Simulate.submit(form);
    expect(LoginElement.state.errored).toEqual(false);
});

通过提交表单，它调用登录方法:

login() {
    let typedUsername = React.findDOMNode(this.refs.username).value;
    if (!typedUsername) {
        return this.setState({
            errored: true
        });
    }
    // we don't actually send the request from here, but set the username on the AuthModel and call the `login` method below
    AuthModel.set('username', typedUsername);
    AuthModel.login();
},

所以我试图测试Login.jsx的功能，而不是AuthModel.js，但是通过调用AuthModel.login()，它通过WebSocket发送消息。然而，问题是，在我的实际应用程序中，我不加载任何东西，直到WebSocket已经连接(我触发一个事件，然后渲染React应用程序)，然而在我的茉莉测试，我不等待这个事件，所以我收到:

ERROR: null, DOMException{stack: 'Error: Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.

我的测试失败了，它不应该失败，因为它的封装功能做了我想要的。它只是在依赖树的更上层出错。

我最好的方法是围绕这个工作，或者减轻WebSocket试图在我的测试环境中连接?(我对测试非常陌生，所以这些概念现在对我来说非常陌生)

Answer 1

我不会假装知道很多关于这一点，但你不能依赖注入AuthModel所以如何，然后模拟它在你的测试?对不起，这不是一个完整的答案，这只是我的第一直觉。

如果你需要一个库来帮助你，angular/di(来自angular2)是非常好的选择。

Answer 2

您可以使用Sinon JS模拟/存根服务器请求。——http://sinonjs.org/

如果你只是想知道Auth。Login向服务器发出请求，使用sinon。存根(http://sinonjs.org/docs/#stubs)，例如

var stub = sinon.stub($, 'ajax');
//Do something that calls $.ajax
//Check stub was called and arguments of first call: 
console.log(stub.called)
console.log(stub.args[0])
stub.restore();

如果你的代码需要一个响应，使用sinon的假服务器(http://sinonjs.org/docs/#server):

)

var server = sinon.fakeServer.create(),
    myResults = [1, 2, 3];
//Set-up server response with correct selected tags
server.respondWith('POST', url, [200, {
        'Content-Type': 'application/json'
    },
    JSON.stringify({
        response: myResults
    })
]);
//Do something which posts to the server...
sendToServer('abc').done(function(results) {
    console.log('checking for results ', results);
})
server.restore();

你可以得到更复杂的服务器响应-使用函数等来处理多种请求类型，例如

function initServer(respondOk) {
    var server = sinon.fakeServer.create();
    server.respondWith('POST', /.*/endpoint/.*/, function(request) {
        var header = { 'Content-Type': 'application/json' };
        if(!respondOk) {
            var response = JSON.stringify([{
                'error_code': '500',
                'message': 'Internal server error'
            }]);
            request.respond(500, header, response);
        } else {
            var code = 200,
                resources = JSON.parse(request.requestBody),
                result = JSON.stringify({ customer: resources });
            request.respond(code, header, result);
        }
    });
    return server;
});