使用 Nightwatch 测试注释和 Doctype

Using Nightwatch to Test Comments & Doctype

我是一名 IT 讲师,我已经开始使用 Nightwatch 来测试学生的家庭作业,看看它是否符合规范。

我可以毫无问题地测试所有 "normal" elements/attributes。我的问题是一些您通常不会在生产环境中测试的东西。

我想测试他们是否使用了正确的 HTML5 文档类型,当然,它位于根之外,而且我相信 Nightwatch 从 HTML 节点开始。

我还反复强调他们使用评论让他们自己和其他开发人员的生活更轻松。所以,我想测试他们是否正在发表评论。注释的某些部分是必需的并且是一致的,但其他部分会有所不同,例如它们在注释中的名称。这是评论的示例...

The Name of the Page
Sample Page for the Widgets
Author: your name
Date: the date

同样,我可能不会在现实世界中测试评论和文档类型,但想知道 Nightwatch 是否有可能?

我已经尝试了 containsText() 和 text.to.contain() 方法,但没有成功。

如有任何想法和指导,我们将不胜感激。

此外,我不反对使用其他测试工具或任何其他可能有帮助的中间件(如果您知道的话)。我在搜索中没有找到任何东西,也没有找到解决我的困境的方法。

我会说 Nightwatch 并不是为了完成这样的任务而设计的。在 GUI(图形用户界面)上执行验收测试是一个了不起的框架,但它不是网络爬虫。浏览器自动化是一项资源密集型操作,尤其是当您通过 Selenium WebDriver 自动化真正的 Web 浏览器时。因此,如果代码结构比图形部分更重要,我建议您使用更多 "minimalistic" 库,例如 CasperJS。它基于 PhantomJS,一种 WebKit 无头浏览器。

守夜人

如果你想保留 Nightwatch,你能做的最好的事情就是使用正则表达式和 .source() 方法,其中 returns DOM 的序列化(字符串):

browser
  .url("http://www.website.com")
  .source(function (res) {
    if (/<!--/.test(res.value)) {
      console.log("Comment detected!");
    }
  })

这可以检测至少一条评论,但您将无法检查 DOCTYPE,因为它不是由 .source() 方法返回的。使用 XPath,根元素将是 /html.

此外,这里我们使用基本的console.log进行评论,这对于进行测试来说并不理想。但问题是大多数 Nightwatch 断言方法都需要一个 CSS 选择器...

卡斯帕

这里容易多了...

使用 Casper,您可以使用 .getHTML() 方法获取 DOM 的序列化。但是在这里,返回 DOCTYPE 并且您可以使用断言 (.assertMatch()) 根据正则表达式验证结果。您的代码可以具有以下结构:

casper.test.begin('Test website', function (test) {
    casper.start('http://www.website.com', function () {
        var html = this.getHTML();
        test.assertMatch(html, /<!DOCTYPE html>/);
        test.assertMatch(html, /<!--.*-->/);
    });

    casper.then(function () {
        // Your code...
    });

    casper.run(function() {
        test.done();
    });
});

我已经在包含有效 HTML5 文档类型声明和一些注释的随机页面上测试了这段代码。它工作正常。