水豚在页面上找不到选择器

Question

我正在尝试测试引导导航栏中是否存在某些表单字段，并且找不到合适的Capybara选择器组合来查找它们。

我在水豚中尝试了以下选项：

  should have_selector('id', text: 'email')
  should have_selector('name', text: 'email')
  should have_selector('div.input.id', text: 'email')
  should have_selector('div.input.placeholder', text: 'email')

我总是收到错误消息：

       Failure/Error: expect (should have_selector('div.input.placeholder', text: 'email'))
       expected to find visible css "div.input.placeholder" with text "email" but there were no matches

我对水豚还很陌生，这可能是我的问题，但是我仔细阅读了文档，似乎应该可以使用。

我猜这与隐藏它有关，但是当您转到页面时它对用户可见，因此我不确定如何使它对水豚可见。

这是正在显示的HTML代码：

    <div class="navbar-collapse collapse">
      <form class="navbar-form navbar-right" role="form" action="/sessions" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="klUhJ9epE/Sr/N0okPq5WMWi2XJuQXiAPmdg/9Qf2d8TBX+htbIdUPRh01YPWqMTRin8vTlVG/ECUtvKNczc+A==" />
        <div class="form-group">
          <input type="text" name="email" id="email" class="form-control" placeholder="Email" />
        </div>
        <div class="form-group">
          <input type="password" name="password" id="password" class="form-control" placeholder="Password" />
        </div>
        <input type="submit" name="commit" value="Sign in" class="btn btn-primary" />
      </form>
    </div><!--/.navbar-collapse -->

这是实际页面的视图：

Answer 1

div.input.placeholder是一个CSS选择器，它将选择具有“输入”和“占位符”类的div元素-我假设这并不是您实际上要检查的内容。

如果您要测试属性值，请执行

have_selector('input[id="email"][placeholder="Email"]')

或者更好，因为您正在使用CSS

have_css('input[id="email"][placeholder="Email"]')

或者您可以使用Capybaras内置的：field选择器类型并执行

have_field(id: 'email', placeholder: 'Email')

尽管如此-实际上检查这样的属性对于功能测试来说是过大的。只需填写字段

fill_in('Email', with: 'my_email@blah.com')

将确认相关字段存在，可以通过字符串“ Email”的标签或占位符定位并可以填写。