如何在 intern.js 中测试视图库？

Question

我正在构建一个使用 backbone 作为基础的库。我的图书馆有一个视图 class，它是 Backbone.View 的扩展。它有一个 HTML 元素作为它的属性。我在视图上有一堆新功能，我想用实习生测试它们。

问题是我找不到从 intern 本身引用 DOM 的方法。我能看到这个工作的唯一方法是打开一个单独的 HTML 页面的远程 URL，然后用 leadfoot 查询这个 DOM。这种方法对于您转到特定页面以测试您的网站的网站来说似乎很棒，但我正在尝试构建一个库，因此似乎没有必要单独的页面来测试库的核心功能。

有没有一种方法可以在不将所有代码放入虚拟 html 文件以使用 leadfoot 打开的情况下测试视图库？

Answer 1

当然，您有两种选择，这两种选择都涉及编写单元测试（不是功能测试）。一种是直接使用 Intern 的 client.html 在浏览器中运行单元测试，另一种是使用 WebDriver (intern-runner).

在浏览器中运行它们。

您的单元测试将加载您尝试测试的任何内容类、实例化它们的实例、进行断言等。由于您的单元测试将运行在浏览器中进行，他们将可以访问 DOM.

请注意，您的测试不会加载测试页面，它们会加载代码模块。所以测试可能看起来像：

define([
    'intern!object', 'intern/chai!assert', 'app/View'
], function (registerSuite, assert, View) {
    var view;

    registerSuite({
        name: 'app/View',

        afterEach: function () {
            // cleanup the view after each test
            view.remove();
            view = null;
        },

        someTest: function () {
            var view = new View();
            // run tests on the view
        }
});

为了运行使用 WebDriver 的测试，将其列在 suites 而不是 functionalSuites in your intern 配置中，然后运行 Intern in webdriver mode (intern-runner 或 intern run -w).

为了运行您在浏览器客户端中的测试，在您的项目目录中启动一个静态服务器（intern serve 如果使用 intern-cli），打开浏览器，然后浏览到 http://localhost:<port>/node_modules/intern/client.html?config=tests/intern（假设您的测试配置为 tests/intern.js）。

如何在 intern.js 中测试视图库？

How do I test a view library in intern.js?

javascript

testing

functional-testing

intern

leadfoot