Question

我是客户端测试的新手，但是在Visual Studio中编写了一个Jasmine测试，它针对HTML“片段”（我的页面的一部分）运行我的JS代码并成功执行Assert - 一切都很好。

但是，我无法按照文档中的描述从测试夹具加载HTML。我已经看过几个关于这个主题的类似帖子，但是已经按照他们的示例，但代码语法无法识别。通过将我的HTML放在一个单独的函数中并在需要时阅读它，我暂时解决了这个问题。虽然这是有效的，但是它不能令人满意，因为我需要在每一行的末尾用一个反斜杠字符来逃避多行HTML，我不想在我设想的所有数百个测试中这样做我会结束写作。

好的，我的设置。

Visual Studio 2013
Sinon 1.17.2
用于Test Explorer 4.1.0的Chutzpah测试适配器
Chutzpah Test Runner上下文菜单扩展4.1.0

我的项目中有以下目录结构，方括号[xyz]中的内容是文件夹，“\”表示目录结构中的子目录

Project
\ [MyApplicationName]
\\ [FeatureUnderTest]
\\\ myTestFile.js
\\\ myHtmlFragmentFromPage.html
\\\ myHtmlFragmentReturnedFromAjax.html
\ [Libraries]
\\ sinon-1.17.2.js

好的，正如您所看到的，我将我的测试文件作为我的测试文件放在SAME文件夹中。我可能最终会为每个功能进行多次测试 - 可能还有子功能及其相关测试。理想情况下，我希望HTML文件位于相对于Test JS的子文件夹中，并且此文件夹可以具有标准名称，例如“Fixtures”。所以我最终会得到类似的东西：

Project
\ [MyApplication]
\\ [Feature1]
\\\ [Fixture]
\\\\ HtmlFragA.html
\\\\ HtmlFragB.html
\\\ Feature1.Test.js

\\ [Feature2]
\\\ [SubFeature1]
\\\\ [Fixture]
\\\\\ HtmlFragA.html
\\\\\ HtmlFragB.html
\\\\ Feature2.SubFeature1.Test.js
\\\ [SubFeature2]
\\\\ [Fixture]
\\\\\ HtmlFragA.html
\\\\\ HtmlFragB.html
\\\\ Feature2.SubFeature2.Test.js
\\\ [SubFeature3]
\\\\ [Fixture]
\\\\\ HtmlFragA.html
\\\\\ HtmlFragB.html
\\\\ Feature2.SubFeature3.Test.js

\\ [Feature3]
\\\ [Fixture]
\\\\ HtmlFragA.html
\\\\ HtmlFragB.html
\\\ Feature3.Test.js

\ [Libraries]
\\ sinon-1.17.2.js

对于那些有许多测试经验的人来说，这是分离这些测试的好方法吗？如果没有，任何指针都会受到赞赏。

好的，我的代码。

/// <reference path="../../../myApplication/scripts/Feature1/jsFileUnderTest.js" />
describe("Given Feature 1", function (){
    describe("When AJAX call is successful", function() {
        // Currently load from functions
        var html = htmlFragmentFromDom();
        var ajaxResponse = ajaxResponse();

        beforeEach(function() {
            $('body').append(html);

            sinon.stub($, 'ajax', function (options){
                var dfd = $.Deferred();
                if (options.success) {dfd.done(options.success(ajaxResponse));}
                if (options.error) {dfd.fail(options.error);}
                dfd.success = dfd.done;
                dfd.error = dfd.fail;
                return dfd;
            });
        });    
        afterEach(function() {
            $(html).remove();
            $.ajax.restore();
        });

        if("Then abc Should Be 123", function (){
            ....
        });
    });
});
function htmlFragmentFromDom(){
    return '... /
            .....';
}
function ajaxResponse(){
    return '... /
            .....';
}

我的Chutzpah.json的内容如下：

{
    "Framework": "jasmine",
    "TestHarnessLocationMode": "TestFileAdjacent",
    "TestFileTimeout": "120000",
    "References": [
        { "Path": "../../myApplication/scripts/jquery/jquery-1.11.2.js" },
        { "Path": "../../myApplication/scripts/jquery/jquery-ui-1.11.4.js" },
        { "Path": "../libraries/sinon-1.17.2.js" }
    ]
}

所以，如果有人知道我需要做什么才能读取HTML（对于将运行JavaScript测试的DOM片段以及从AJAX调用返回的HTML，那么我将是非常感激。

格里夫

Answer 1

Chutzpah支持将HTML模板注入dom。只需从chutzpah.json引用你的HTML文件就可以了：

"References": [
        { "Path": "myHtmlFile.html" }
    ]

无法在Visual Studio 2013中加载Jasmine的HTML测试夹具

1 个答案: