Question

我正在使用Capybara测试我的Ruby / Sinatra应用程序正确呈现了页面。

我能够使用以下语句测试页面是否包含某些值：

expect(page).to have_content('Campaign_1')

但是，我要检查的是页面的特定元素是否包含期望值。

例如，以下各种“子”元素：

<li id="campaign_1" style="margin-bottom:25px">

例如“媒体标题名称”子元素的值为“ Campaign_1”，具体如下代码所示：

<h6 class="media-heading name">Campaign_1</h6>

或“媒体标题国家/地区”子元素的值为“英国”，如下代码段所示：

<h6 class="media-heading country">United Kingdom</h6>

下面是.erb文件内容的副本。

  <ul class="list-group" >
    <% @all_campaigns.each do |campaign| %>
      <a href="/campaign/<%= campaign.name %>" style="text-decoration: none">
        <li id="<%= campaign.name.downcase %>" style="margin-bottom:25px">
          <div class="media">
            <div class="media-left">
              <img src="/images/<%= campaign.image %>.jpeg" class="media-object">
            </div>
          </div>
          <br>
          <div class="media-body">
            <h6 class="media-heading name"><%= campaign.name %></h6>
            <br>
            <div class="left_right_Container">
              <h6 class="media-heading country"><%= campaign.country %></h6>
              <h6 class="media-heading sector"><%= campaign.sector %></h6>
            </div>
            <br>
            <br>
            <h5 class="media-heading target_amount">Target Amount: £<%= campaign.target_amount %></h5>
          </div>
          <div class="progress">
            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40"
            aria-valuemin="0" aria-valuemax="100" style="width:<%= campaign.percentage %>%">
              <span class=""><%= campaign.percentage %>% Funded</span>
            </div>
          </div>
        </li>
      </a>
    <% end %>
  </ul>

上面的.erb文件会导致在应用运行时创建下面的HTML（更多内容，这只是一个片段）：

  <li id="campaign_1" style="margin-bottom:25px">
    <div class="media">
      <div class="media-left">
        <img src="/images/Image_1.jpeg" class="media-object">
      </div>
    </div>
    <br>
    <div class="media-body">
      <h6 class="media-heading name">Campaign_1</h6>
      <br>
      <div class="left_right_Container">
        <h6 class="media-heading country">United Kingdom</h6>
        <h6 class="media-heading sector">Automotive</h6>
      </div>
      <br>
      <br>
      <h5 class="media-heading target_amount">Target Amount: £1000000</h5>
    </div>
    <div class="progress">
      <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width:93%">
        <span class="">93% Funded</span>
      </div>
    </div>
  </li>

Answer 1

您只需要期待要检查的元素-例如

heading = page.find('li#campaign_1 .media-heading.name')
expect(heading).to have_content('Campaign_1')

另一种选择（当您需要检查一些东西时更有用）是within方法，该方法的作用范围是page所引用的

within 'li#campaign_1 .media-heading.name' do
  # here page will refer to the .name element
  expect(page).to have_content('Campaign_1')
end

最后，您可以使用text或exact_text选项按预期完成所有操作

expect(page).to have_css('li#campaign_1 .media-heading.name', text: 'Campaign_1')

将其中的两种方法结合在一起会得出

within 'li#campaign_1' do
  expect(page).to have_css('.media-heading.name', text: 'Campaign_1'
  expect(page).to have_css('.media-heading.country', text: 'United Kingdom')
end

TDP Ruby与Capybara：如何使用Capybara验证特定页面元素中的特定页面值

1 个答案: