javascript - Jasmine 针对特定 HTML 测试 JavaScript 代码

Question

我正在尝试使用 Jasmine 为以下函数编写单元测试:

function toggleDisplay(divIdToShowHide, showHide) {
var divToShowHide = document.getElementById(divIdToShowHide);
if (showHide == "show")
    divToShowHide.style.display = "block";
else if (showHide == "hide")
    divToShowHide.style.display = "none";
else
    divToShowHide.style.display = (divToShowHide.style.display == "block") ? "none" : "block";
var buttonForDiv = document.getElementById(divIdToShowHide + 'Button');
if (divToShowHide.style.display == "block")
    buttonForDiv.innerHTML = "-";
else
    buttonForDiv.innerHTML = "+";
}

我需要根据我编写的包含各种按钮的示例 HTML 代码对此进行测试。我不知道如何让代码在 HTML 上实际运行的 jasmine 测试(因为它需要 getElementById)。有没有简单的方法来实现它？

Answer 1

你应该看看 Jasmine Jquery ，它允许您针对特定的 HTML 创建测试，因此您可以查看您的 javascript 是否正常工作。

使用 Jasmine jquery，您可以创建一个 html fixture (只是一个真实的或生成的 html 页面)，然后使用他们提供的基于 jquery 的方法来检查并查看您的 javascript 是否执行了它应该执行的操作。