如何为 <noscript> 标签编写自动化测试？

Question

我正在构建一个 web 应用程序，<noscript>如果 Javascript 被禁用，它会回退到一个标签上。我想验证该标签是否显示，但我不确定如何使用我拥有的任何框架或一般的任何框架来做到这一点。

默认情况下，禁用 Javascript 时，有问题的应用程序会显示以下内容：

 <div>
  <noscript>
    <h1>Javascript Disabled</h1>
    Use this page to show content when Javascript has been disabled
  </noscript>
 </div>

加载脚本时，应用程序将上述内容替换为以下内容：

 <div>
   Hello World
 </div>

现在我使用 NightmareJS 和 Testem 和 jasmine 进行测试。我不必使用这些，但如果可能的话，我仍想使用 Javascript。

我在这里完全被难住了，甚至不知道从哪里开始 - 所有 StackOverflow 问题似乎都是关于如何 USE <noscript>，而不是在端到端或单元测试中（以自动化方式）验证它。

Answer 1

对于那些使用 Nightmare JS 的人来说，在创建噩梦实例时有一个选项，但是某些功能似乎无法运行（例如evaluate、 或exists）。就我而言，我将页面保存为 HTML，然后验证该 HTML 是否存在。还可以保存屏幕截图或 pdf，以验证输出是否正确。

const nightmare = require('nightmare')
const fs = require('fs')

const browser = nightmare({
  webPreferences: {
    javascript: false
  }
})

describe('Page with Javascript Off', () => {
  beforeAll((done) => {
    browser.goto('http://localhost:8080')
      .html('./tests/no-js-result.html', 'HTMLOnly')
      .then(() => done())
  })
  it('should show page when JS is disabled', (done) => {
    fs.readFile('./tests/no-js-result.html', 'utf8', function(err, html){
      if (err) fail('Could not read no-js-result.html')
      expect(html).toContain('<h1>Javascript Disabled</h1>')
      done()
    })
  })
})