Karma-Mocha - 如何測試偵聽DOMContentLoaded事件的方法

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