Как привязать тестовую функцию qunit к запускаемому событию

js-файл

window.onload = function() {
    document.getElementById('example').addEventListener('mousedown', myFunction, false);
};

function myFunction(e) {
    x = e.clientX-parseInt(document.getElementById('example').offsetLeft);
    window.addEventListener('mousemove', anotherFunction, true);
}

Пытаюсь выяснить, как тестировать с помощью QUnit. страница не использует jQuery, только JavaScscript. Как видите, onload включает прослушиватель событий, добавляемый к элементу, и когда это событие мыши запускается, вызывается функция myFunction. дайте код пожалуйста.


qunit
person jsteinmann    schedule 11.01.2014    source источник
comment
Вы пытаетесь проверить, запускается ли функция при возникновении события, или вы пытаетесь проверить саму функцию?   -  person tkone    schedule 11.01.2014
comment
Спасибо за вопрос! Я хочу обеспечить покрытие кода для функции, но функция ничего не возвращает, поэтому я предполагаю, что событие должно быть инициировано   -  person jsteinmann    schedule 12.01.2014

Ответы (1)


arrow_upward
0
arrow_downward

На мой взгляд, это должно быть два теста:

Первый: вы хотите проверить, правильно ли подключен прослушиватель событий. Для этого вы можете просто переопределить myFunction (или использовать шпион, например, из sinon). Затем активируйте щелчок мыши (см. MDN для запуска событий). ).

Затем для следующей функции сделайте то же самое, только подключите шпиона или переопределите anotherFunction, а затем просто вызовите свой метод напрямую.

** РЕДАКТИРОВАТЬ ИНФОРМАЦИЮ О ШПИОНАХ **

Если у вас загружен sinon, а myFunction доступна в области действия, вы делаете myFunction шпионом.

Из документации для шпионов и запуск события

test('callback', function(){
    sinon.spy(myFunction);
    // or
    var oldFunc = myFunction;
    myFunction = function(){
        ok(true, true, 'function called');
    }
    var event = new MouseEvent('down', {
        'view': window,
        'bubbles': true,
        'cancelable': true
     });

    // trigger event 
    document.getElementById('example').dispatchEvent(event);

    ok(myFunction.called, true, 'function called');
    myFunction.restore();
    //or
    myFunction = oldFunc;
});
person tkone    schedule 11.01.2014
comment
@jsteinmann обновил ответ с примером того, как это может работать с использованием синона для создания шпиона. - person tkone; 13.01.2014
comment
прохладно. я никогда не использовал sinon и не знаю, сработает ли в этом случае использование библиотеки. не могли бы вы показать способ проверки переопределения? - person jsteinmann; 13.01.2014
comment
Это должно работать — sinon — отличный инструмент для насмешек. Тем не менее, пример обновлен. - person tkone; 14.01.2014
comment
@jsteinmann Я НАСТОЯТЕЛЬНО рекомендую использовать для этого синон. это то, для чего он предназначен. Есть даже адаптер для qunit - person tkone; 14.01.2014
comment
'[object MouseEventConstructor]' не является конструктором (оценка 'new MouseEvent('down', { ›› 'view': window, ›› 'bubbles': true, ›› 'cancelable': true ›› })') ›› TypeError: '[object MouseEventConstructor]' не является конструктором (оценка 'new MouseEvent('down', { - person jsteinmann; 14.01.2014
comment
@jsteinmann ознакомьтесь с документацией MDN для получения дополнительной помощи. - person tkone; 18.01.2014
comment
если тесты выполняются без головы с phantomjs, это решение все еще верно? - person jsteinmann; 19.01.2014
comment
call не определен, так как я могу проверить утверждение на myFunction.call? Я просто использую sinon, если вы хотите снова опубликовать решение sinon. - person jsteinmann; 19.01.2014