如何測試茉莉花中的範圍對象？

Question

我正在寫一個關於Range對象的測試。我的代碼類似於以下內容。

Test = function() {}; 

Test.prototype.test = function() { 
    if (window.getSelection) { 
    var sel = window.getSelection(); 
    var range = sel.getRangeAt(0); 
    // then some code; 
    } else if (document.selection) { 
    range = document.selection.createRange(); 
    //then some code; 
    return 'haha'; 
} 

it('should create range object', function() { 
    var myTest, result; 
    myTest = new Test(); 
    spyOn(myTest, 'test').andReturn('haha'); 
    result = myTest.test(); 
    expect(result).toEqual('haha');  
}); 

當我運行測試，它拋出一個錯誤：INDEX_SIZE_ERR: INDEX_SIZE_ERR: DOM Exception 1

但我的代碼工作以及在瀏覽器中。

然後我發現了一些關於getRangeAt和rangeCount。

Before the user has clicked a freshly loaded page, the rangeCount is 0.

然後我嘗試添加像$(document).click();的代碼中，rangeCount仍然是0 ...

，它仍然拋出INDEX_SIZE_ERR: INDEX_SIZE_ERR: DOM Exception 1

所以，問題是：如何能正常測試範圍在茉莉花中的對象？

Answer 1

您必須模擬window.getSelection或document.selection.createRange，以便原始方法不會被調用。

it('should create range object', function() { 
    var myTest, result; 
    myTest = new Test(); 
    //mock the select function so that it will return "haha" when getRangeAt is called 
    var range = 'haha'; 
    var rangeObject = { 
    getRangeAt: function(){return range} 
    }; 
    spyOn(window, 'getSelection').andReturn(rangeObject) 
    spyOn(myTest, 'test').andReturn('haha'); 
    result = myTest.test(); 
    expect(result).toEqual('haha');  
});