使用Sinon創建document.getSelection的存根

我可以在下面找到的函數使用document.getSelection來獲取屏幕上當前選定的文本。我需要能夠指定document.getSelection的值，以便測試我的功能。使用Sinon創建document.getSelection的存根

我嘗試創建存根像這樣：

document.getSelection = sinon.stub(document, "getSelection", function() { return "Hello world!" }); 

var selection = wysiwyg.getCurrentRange();

然而，它只是讓undefined選擇。有人能告訴我我做錯了什麼嗎？

下面是我測試的方法：

Wysiwyg.prototype.getCurrentRange = function() { 
    var sel, range; 
    if (window.getSelection) { 
     sel = window.getSelection(); 
     if (sel.getRangeAt && sel.rangeCount) { 
      range = sel.getRangeAt(0); 
     } 
    } else if (document.selection) { 
     range = document.selection.createRange(); 
    } 

    return range; 
};

來源

2016-03-01 tylerbhughes

現在問題解決了嗎？ –

是的。感謝您的幫助。 – tylerbhughes

不客氣 –

有4個錯誤，在你的代碼：

第一個是顯而易見的。如果您想爲 window.getSelection創建存根，則應將其應用於window.getSelection （而不是document.getSelection）。
第二個也很明顯。最初的sel和range是undefined。你用一個返回字符串 'Hello world！'的函數替代 document.getSelection。（見＃4行）。因此sel等於 'Hello world！'和sel.getRangeAt連同sel.rangeCount 是undefined。因此，整個表達式sel.getRangeAt && sel.rangeCount爲false和range，您返回的結果爲仍然爲undefined（您得到的確切結果）。
您應該將sinon.stub的結果分配給一個新變量（而不是替代方法）。
始終在測試結束時恢復原始方法。

請注意，如果未定義方法，則不能將存根應用於方法。

考慮到以上所有情況，在您的情況下，沒有存根的解決方案會更好。

要測試的肯定分支可以使用

var getRangeAtResult = 'getRangeAt Expected Result'; 
var getRangeAtSpy = sinon.spy(function() { 
    return getRangeAtResult; 
}); 

var windowGetSelectionBackUp = window.getSelection; 
window.getSelection = function() { 
    return { 
     getRangeAt: getRangeAtSpy, 
     rangeCount: true 
    }; 
}; 

wysiwyg.getCurrentRange().should.be.equal(getRangeAtResult); 

getRangeAtSpy.withArgs(0).called.should.be.equal(true); 
window.getSelection = windowGetSelectionBackUp;

如果您確信document.getSelection定義，你可以使用存根

var getRangeAtResult = 'getRangeAt Expected Result'; 
var getRangeAtSpy = sinon.spy(function() { 
    return getRangeAtResult; 
}); 

var documentGetSelectionStub = sinon.stub(document, 'getSelection', function() { 
    return { 
     getRangeAt: getRangeAtSpy, 
     rangeCount: true 
    }; 
}); 

wysiwyg.getCurrentRange().should.be.equal(getRangeAtResult); 

getRangeAtSpy.withArgs(0).called.should.be.equal(true); 
documentGetSelectionStub.restore();

要測試的否定分支可以使用

var createRangeResult = 'createRange Expected Result'; 
var createRangeSpy = sinon.spy(function() { 
    return createRangeResult; 
}); 

var documentSelectionBackUp = document.selection; 
document.selection = function() { 
    return {createRange: createRangeSpy}; 
}; 

wysiwyg.getCurrentRange().should.be.equal(createRangeResult); 

createRangeSpy.called.should.be.equal(true); 
document.selection = documentSelectionBackUp;

來源

2016-03-04 07:17:42

我有點困惑。在你的回答開始時，你糾正了我說我應該窺視'窗口。getSelection（）'但通過你的答案的一部分，你切換並說：「如果你確定'document.getSelection'被定義，你可以使用存根」。那麼，我應該對哪些人進行間諜活動「document.getSelection（）'或'window.getSelection（）'？ – tylerbhughes

請重新檢查您的代碼。 'document.getSelection'無處使用。你沒看到嗎？你使用'window.getSelection'和'document.selection'。 –

在你的情況下更好地使用沒有存根的解決方案 –

使用Sinon創建document.getSelection的存根

回答

相關問題