Question

我正在为我公司维护的内部框架编写测试。其中有一个方法等同于jQuery的$(document).ready(handler)方法。该方法如下所示：

export function $ready(fn) {
    document.readyState === 'complete' ?
        $exec(fn) :
        document.addEventListener('DOMContentLoaded', function() {
            $exec(fn);
        });
}

我希望能够编写一个执行事件监听器回调而不是立即执行fn的测试，但是我不知道在readyState之前让我的测试执行的方法设置为complete，我也不知道重新触发DOMContentLoaded事件的方法。任何建议将不胜感激。

Answer 1

重新触发DOMContentLoaded

// Create the event.
var event = document.createEvent('Event');

// Define that the event name is 'DOMContentLoaded'.
event.initEvent('DOMContentLoaded', true, true);

window.document.dispatchEvent(event);

然后你可以测试它

describe('Some feature', function() {
  it('should increase the number of div', function(){
    expect(document.querySelector('div')).to.equal(10);
    // retrigger DOMContentLoaded event here
    expect(document.querySelector('div')).to.equal(15);
  });
});

createEvent API

Karma-Mocha - 如何测试侦听DOMContentLoaded事件的方法

1 个答案: