Question

我一直在使用nightmare.js来使用mocha运行测试。这是我第一次使用这些框架/库。我目前正在创建一个测试，在我正在处理的Web应用程序上加载登录页面并尝试登录。这是我用作参考的代码资料来源：https://segment.com/blog/ui-testing-with-nightmare/

  describe('Login Page', function () {
describe('given bad data', () => {
  it('should fail', done => {
    nightmare
    .goto('https://gethoodie.com/auth')
    .on('page', (type, message) => {
      if (type == 'alert') done()
    })
    .type('.login-email-input', 'notgonnawork')
    .type('.login-password-input', 'invalid password')
    .click('.login-submit')
    .wait(2000)
    .end()
    .then()
    .catch(done)
  })
})

我对tis代码的主要问题是.type和.click函数。阅读噩梦api这两个函数就像这样工作

.type（selector [，text]）

输入提供给选择器元素的文本。为文本提供的空或假值将清除选择器的值..type（selector [，text]）

我尝试使用下面的代码实现此功能

describe('/ (authentication)', () => {
    it('should pass by logging into the system', done => {
        // testing urls will be `http://localhost:port/path`
        nightmare.goto('http://localhost:4000/login')
            .on('page', (type, message) => {
                if (type === 'alert') done()
            })
            .type('input[id="username"]', 'admin')
            .type('input[id="password"]', 'toetagging')
            .click('button[data-reactid=".0.0.1.3.0"]')
            .wait(2000)
            .end()
            .then()
            .catch(done)
    })
})

我的主要问题是，选择器究竟是什么？我如何获得它？

Answer 1

选择器对于匹配DOM中的某些节点很有用。假设您具有以下DOM：

<div class="login-submit">
  <input id='input-login' type="text" class="fancy" name="login" />
</div>

要选择输入框，可以像使用CSS一样使用以下选择器：

input.fancy
.login-submit input
#input-login
input[name=login]

假设您想在噩梦中键入输入框，则可以使用以下代码： nightmare.type('input[name=login]', 'superwoman')

此处'input[name=login]'是选择器，'superwoman'是您想在输入行中输入噩梦的文本。

Nightmare.js中的.type和.click选择器

1 个答案: