Sinon Fakeserver тестирует другой компонент/файл — нет запросов?

Я тестирую компонент React, используя Mocha/Chai/Sinon, и вызываю запрос AJAX в другом файле, используя что-то вроде renderedComponent.getTodos(callback). Я передаю обратный вызов, аналогичный этому руководству по Sinon FakeServer. Однако я получаю странную синтаксическую ошибку, из-за которой обратный вызов не вызывается, и поэтому server.requests пуст.

Я знаю, что задавал аналогичный вопрос здесь, однако здесь проблема другая. что я вызываю запрос AJAX в другом файле, а не в том же файле, и теперь решение, которое работало раньше, больше не работает. Я не уверен, почему. В общем, мой вопрос таков: Есть ли что-то в включении функции в другой файл, что приводит к сбою загрузки Sinon в моем экземпляре JSDOM?

Для справки, вот моя инициализация renderedComponent и код FakeServer, находящиеся в моем тестовом файле:

test.js

renderedComponent = ReactTestUtils.renderIntoDocument(
      <Component...>
        <p>Drag &amp; drop files here or click here to browse for files.</p>
      </Component> 


... 

describe('Testing', function(){
    var server;

    before(function () { server = sinon.fakeServer.create(); });
    after(function () { server.restore(); });

    it("calls callback with deserialized data", function () {
        var callback = sinon.spy();
        renderedComponent.getTodos(callback);

        // This is part of the FakeXMLHttpRequest API
        server.requests[0].respond(
            200,
            { "Content-Type": "application/json" },
            JSON.stringify([{ id: 1, text: "Provide examples", done: true }])
        );

        assert(callback.calledOnce);
    });

А вот функция serverRequest в renderedComponent, которая является компонентом React в другом файле, который я пытаюсь протестировать:

Component.js

var Component = React.createClass({

...

    function getTodoscallback) {
        $.ajax({
             url: "/todo/items",
             success: function (data) {
                 // Node-style CPS: callback(err, data)
                 callback(null, data);
             }
        });
    }
}

Добавление параметра error к запросу AJAX выявляет синтаксическую ошибку модуля узла jsdom, пытающегося выполнить urlObj = new URL(uri, documentBaseURLSerialized(this._ownerDocument));

Я предполагаю, что это связано с тем, что JSDom загружает jQuery и Sinon, но кроме этого я понятия не имею - буду признателен за любую помощь.


reactjs unit-testing jquery mocha.js sinon
person frogbandit    schedule 21.06.2016    source источник
comment
Непонятно что в каком файле. Фактически, вы должны отредактировать свой вопрос, чтобы сделать его минимально воспроизводимым примером, чтобы люди могли воспроизвести ошибку, которую вы получаем. Детали того, как все различные части соотносятся друг с другом, очень важны.   -  person Louis    schedule 21.06.2016
comment
@Louis Я пытался объяснить, что в каком файле. Пожалуйста, дайте мне знать, если есть что-то еще, что я могу сделать.   -  person frogbandit    schedule 21.06.2016

Ответы (1)


arrow_upward
0
arrow_downward

Ну, мне удалось решить это с помощью этой настройки:

import jsdom from 'jsdom';
import _$ from 'jquery';

global.jsdom = jsdom.jsdom;
global.document = global.jsdom('<!doctype html><html><body></body></html>');
global.window = global.document.defaultView;
global.XMLHttpRequest = global.window.XMLHttpRequest;
global.navigator = window.navigator;

global.sinon = require('sinon');
global.sinon.useFakeXMLHttpRequest();

global.window.XMLHttpRequest = global.XMLHttpRequest;
global.$ = _$(global.window);

Похоже, проблема в том, что мне нужно было установить jQuery и sinon в качестве глобальных переменных. Все еще не совсем уверен, но благодарен, что это работает.

person frogbandit    schedule 21.06.2016