我做了一個包含側邊欄的簡單網站。單擊側邊欄圖示時,它應該打開或關閉。我撰寫的以下代碼正是這樣做的。
/** toggleStatus is a anonymous function and can be called with its name */
let navStatus = false;
let toggleStatus = function () {
let getSidebar = document.querySelector(".sidebar");
let getSidebarUl = document.querySelector(".sidebar ul");
let getSidebarLinks = document.querySelectorAll(".sidebar a");
if (navStatus === false) {
// if Sidebar is closed
closeMenu();
getSidebarUl.style.visibility = "visible";
getSidebar.style.width = "272px"; // change width of sidebar so the content can fit
let arrayLength = getSidebarLinks.length;
for (let i = 0; i < arrayLength; i ) {
// Smake every List item Visible
getSidebarLinks[i].style.opacity = "1";
}
navStatus = true;
} else {
// if Sidebar is open
getSidebarUl.style.visibility = "hidden";
getSidebar.style.width = "50px"; // change width of sidebar to the base Design
let arrayLength = getSidebarLinks.length;
for (let i = 0; i < arrayLength; i ) {
// make every List item invisible
getSidebarLinks[i].style.opacity = "0";
}
navStatus = false;
}
};
現在我必須用 Jest 為這個函式撰寫一個測驗,但我不知道從哪里開始。我不能用任何輸入來喂養它并比較預期的輸出。有沒有人對新手有一些提示?
謝謝!
uj5u.com熱心網友回復:
如果您的函式沒有顯式輸出,并不意味著它什么都不做。該函式有一些“行為”,在您的情況下,它會執行一些 DOM 操作。所以你應該測驗一下。
您有兩種選擇來處理它:
- 模擬需要 DOM API 函式,并期望模擬物件的道具具有您喜歡的形狀。
- 使用其他工具通過快照測驗呈現實際的 HTML。
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/324872.html
標籤:javascript 单元测试 玩笑
