Question

假设HTML页面有几个独立的脚本标记。让我们假设其中一个被打破了。一个非常简单的例子如下：

<script>var x = 5;</script>
<script>var y = ;</script>
<script>var z = 5;</script>
<script>
    //CHECK FOR JS ERRORS HERE
</script>

是否可以检查上一个脚本中页面上是否存在任何JavaScript错误？

这背后的想法是在我们的开发环境的每个页面的末尾添加这样的脚本。这样，当QA团队测试前端功能时，我的脚本会发现页面上有一个JS错误，以某种方式提醒他们。

目前为了达到相同的效果，QA团队必须在开放工具打开的情况下测试所有页面。然而，大多数时候他们专注于网站的某些特定功能，开发人员工具没有打开，一些偷偷摸摸的JS错误传递（我们的项目有许多外部源的JS脚本，所以这些错误经常发生，我们的码）。

Answer 1

这里有几个选项：

在页面顶部添加一个绑定到window.onerror的脚本并执行相应操作。 Here is a snippet that does that。
使用jshint从HTML中提取javascript并查找语法错误
写一些单元测试

Answer 2

这是一种非常快速，粗糙和丑陋的方法，但它可能会让你开始

<div id="scripts">
<script>var x = 5;</script>
<script>var y = s;</script>
<script>var z = ;</script>
</div>

<ul id="errors">

</ul>

<script>
    var sections = document.getElementById('scripts').getElementsByTagName('script');
    var errors = 0;
    for(var i = 0; i < sections.length; i++)
    {
        var section = sections[i].text
        try
        {
            eval(section);   
        }
        catch(err)
        {
            errors++;           
            var ul = document.getElementById("errors");
            var li = document.createElement("li");
            li.appendChild(document.createTextNode(err));

            var nestedUl = document.createElement("ul");
            var nestedLi = document.createElement("li");
            nestedLi.appendChild(document.createTextNode(section));
            nestedUl.appendChild(nestedLi);
            li.appendChild(nestedUl);
            ul.appendChild(li);
        }
    }
    alert(errors + " error(s)");
</script>

这里是jsfiddle http://jsfiddle.net/ws039av8/

检查页面上的错误

2 个答案: