Как я могу запустить собственное событие Javascript из теста QUnit?

Question

Я работаю над библиотекой Javascript, которая не зависит от jQuery, хотя у меня есть jQuery и QUnit, доступные в моих тестах. В библиотеке я придаю событие к элементу, как JQuery делает:

if (document.addEventListener) { 
    tab.addEventListener('click', MyModule.show, false); 
} else if (document.attachEvent) { 
    tab.attachEvent('click', MyModule.show); 
} 

Я пытался дозвониться $('#tab').click(); в моем QUnit тесте, но это не вызывает мой обработчик события будет называться.

Answer 1

jQuery имеет собственную систему регистрации событий, которая отделена от регистрации событий DOM. Когда мы вызываем $(something).click(), все зарегистрированные обработчики jQuery и зарегистрированный обработчик onclick будут стрелять, но ничего больше не будет. Например,

document.body.addEventListener('click', function() { alert('event') }, false); 
document.body.onclick = function() { alert('onclick'); };  

$('body').click(); // alerts "onclick" 

Если вы звоните document.body.onclick(), то только второе событие будет стрелять и предупредить «OnClick». Чтобы запустить оба события, создайте объект события и отправьте его для рассматриваемого элемента - тела в этом случае. Вы можете найти пример here. Неудивительно, что IE использует другой механизм, чтобы сделать то же самое, и вам нужно позвонить fireEvent.

Вот не пример кросс-браузер для современных браузеров (взято из статьи MDC выше),

var clickEvent = document.createEvent('MouseEvents'); 
clickEvent.initMouseEvent('click', true, true, window, 
    0, 0, 0, 0, 0, false, false, false, false, 0, null); 

document.body.dispatchEvent(clickEvent); 

Answer 2

(не уверен) jQuery использует собственную систему событий поверх собственной системы событий. $(el).click() вызывается непосредственно в этой системе событий, а не в собственной системе. (/ Не уверен)

document.getElementById('tab').onclick(); 

Является родным эквивалентом, но вы можете проверить, если первый запрос для элемента фактически находит элемент. Вы инициализируете тесты QUnit, когда dom готов?

Кроме того, для attachEvent (IE) вам необходимо префикс событий с 'on'.

tab.attachEvent('onclick', listenerFn); 

пс. на самом деле я считаю, что недостающим префиксом «on» для IE-эквивалента была проблема. Измените его и снова проверьте $(). Click().