Как да 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, а просто JavaScsript. Както можете да видите, onload включва добавен слушател на събития към елемент и когато това събитие на мишката се задейства, се извиква функцията myFunction. qunit код, моля.


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 актуализира отговор с пример за qunit за това как това може да работи с помощта на sinon за създаване на шпионин - person tkone; 13.01.2014
comment
готино. никога не съм използвал sinon и не знам дали използването на библиотеката ще работи в този случай. бихте ли показали начин за тестване на замяна? - person jsteinmann; 13.01.2014
comment
Трябва да работи -- sinon е страхотен инструмент за подигравателни цели. Примерът обаче е актуализиран. - person tkone; 14.01.2014
comment
@jsteinmann СИЛНО препоръчвам използването на sinon за това. това е, за което е предназначено. Има дори адаптер за 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. called? Просто ще използвам sinon, ако искате отново да публикувате решението само за sinon. - person jsteinmann; 19.01.2014