Javascript 如何为jQueryUI对话框编写qUnit测试？_Javascript_Jquery_Jquery Ui_Jquery Ui Dialog_Qunit

Javascript 如何为jQueryUI对话框编写qUnit测试？

javascript jquery jquery-ui

Javascript 如何为jQueryUI对话框编写qUnit测试？,javascript,jquery,jquery-ui,jquery-ui-dialog,qunit,Javascript,Jquery,Jquery Ui,Jquery Ui Dialog,Qunit,我开始深入研究qUnit，但我遇到了一个问题，我不知道如何正确地编写测试当按下按钮时，该函数基本上会提醒jQuery UI对话框。以下是我的qUnit测试： test( "If Text is Type, and Control is Textbox, Check Alert if Two Values are Present", function() { //Add New Row $('.button').click(); equal($('#jquery_

我开始深入研究qUnit，但我遇到了一个问题，我不知道如何正确地编写测试

当按下按钮时，该函数基本上会提醒jQuery UI对话框。以下是我的qUnit测试：

test( "If Text is Type, and Control is Textbox, Check Alert if Two Values are Present",  function() {

    //Add New Row
    $('.button').click();


    equal($('#jquery_ui_id').is(':visible'), true, "Prompt is Shown" );

});

问题是测试通过了qUnit，但只在重新加载时通过。因此，当我第一次运行测试时，它总是失败，然后在重新加载时成功

有人知道这里发生了什么，或者以前遇到过这种情况吗？

通常，当重新加载页面时，qUnit测试在失败和成功之间切换时，这意味着您在测试后没有正确清理，并且它们相互冲突

如果向DOM中添加元素并在模块或测试中操作而不使用特殊的

#qunit fixture

元素，则应在该模块的末尾删除它们，以便下一个可以重新开始

有关更多信息，请参阅上的部分

之后，QUnit将重置#QUnit夹具元件内的元件每次测试，删除可能存在的任何事件。只要你仅在此装置内使用图元，无需手动测试结束后进行清理，使其保持原子状态

有同样的问题，我肯定会在元素#qunit fixture下呈现我的所有dom。在调查过程中，我发现jQueryUI将对话框的元素直接添加到

中

因此，解决这个问题的一种方法是在身体之前渲染#qunit fixture。在我的例子中，我的主体中有javascript脚本，这不属于#qunit fixture。所以在此之前，我需要从正文中删除脚本

<html>
   <head></head>
   <div id="qunit-fixture"><!--Wrap whole body into fixture-->
       <body>
       </body>
   </div>
</html>

为了清理添加的元素，我们使用了一个事实，即它们都有类“ui front”。

这可能与没有正确清理以前的测试有关-确保在每个测试结束时删除添加到DOM中的所有元素。这似乎是个问题！我认为qUnit在每个“测试”模块上都会自动完成这项工作。这不是真的吗？（如果您在回答中也写了这个问题，我一定会选择它作为正确的答案！）这个问题提供了有关为什么不重置dom的详细信息。简言之，JQuery在#qunit fixtureMissing链接之外添加html代码，在前面的注释中：

module("SomeModule",
{
    teardown: function ()
    {
        $('.ui-front').remove();//Need to be reset manually, because jquery dialog add these outside of fixture...
    }
});