你能用 Jasmine 测试嵌入在 HTML 页面中的 JavaScript / JQuery 代码吗？答案

【问题标题】：Can you test JavaScript / JQuery code embedded in HTML page with Jasmine?你能用 Jasmine 测试嵌入在 HTML 页面中的 JavaScript / JQuery 代码吗？
【发布时间】：2011-07-26 11:47:43
【问题描述】：

如何使用 Jasmine 或其他工具来测试嵌入在网页中的 JavaScript / JQuery，如下例所示？

<html>
<head>
<!-- usual includes --> 
</head>
<body>

    <span id="myspan1"></span>
    <span id="myspan2"></span>

    <script type="text/javascript">

        $(document).ready(function(){

            $('#myspan1').html('something'); 

            $('#myspan1').click(function(){
                $('#myspan1').html('something else');
            }); 

            doStuff();

            function doStuff() { 
                $('#myspan2').html('stuff done');
            }

        }); 

    </script>

</body>
</html>

【问题讨论】：

你到底想“测试”什么？你不能把源代码复制到你电脑上的 .html 文件中，然后在浏览器中打开吗？
我想为 JavaScript / JQuery 事件处理程序和函数编写自动化单元测试。这就是茉莉花的目的。

标签： javascript jquery testing jasmine

【解决方案1】：

我只是假设您想确保“完成的工作”在合理的时间后出现在页面上。

describe("My page", function () {
    it("should say stuff done after max 500 ms", function () {
        waits(function () {
            return $('#myspan2').html() == 'stuff done';
        }, 500);
    });
});

http://jsfiddle.net/ahus1/QP2Pk/

通常您会将您的 javascript 代码放入外部文件中。

然后您可以设置一个测试页面，其中包含正常页面中的最少元素以及 Jasmine。

在这个测试页面中，当页面最终加载时，我没有等到运行 Jasmine，但无论如何都可以运行。

亚历山大兄弟。

【讨论】：