水豚无法找到字段
Capybara Unable to find field
你好，我正在做我的第一次测试，我需要你的帮助。我正在使用 Rails5.
问题是因为我相信嵌套字段...（使用 Cocoon gem）
水豚 returns 这个错误：
Capybara::ElementNotFound:
Unable to find field "event_participants_attributes_1489697584487_first_name"
我的 html 看起来像这样：
<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489697584487_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489697584487][first_name]" id="event_participants_attributes_1489697584487_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489697584487_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489697584487][salary]" id="event_participants_attributes_1489697584487_salary"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489697584487][_destroy]" id="event_participants_attributes_1489697584487__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div>
这是我的 features/events/create_event.spec.rb
require 'spec_helper'
require 'rails_helper'
describe "Creating an event" do
it "redirects on result page on success" do
visit "/"
click_link "Create a new event"
expect(page).to have_content('Wanna share fair?')
fill_in :name, with: 'Rent a plane'
fill_in "What is the total price", with: 200
click_link "Add a participant"
fill_in "event_participants_attributes_1489697584487_first_name", with: "John"
enter code here
fill_in ":event_participants_attributes_1489697584487_salary", with: 2300
click_button "See result"
expect(page).to have_content('Your salary together:')
end
end
这是我的 simple_forms:
_form.html.erb
<%= simple_form_for @event do |f| %>
<div class="col-xs-12 col-md-10 col-md-offset-1">
<h1>Wanna share fair?</h1>
<p>Create an event, enter the bill to share.</p>
<%= f.input :name, label: "Event's name" %>
<%= f.input :total_price, label: "What is the total price" %>
<p>Add the participants.</p>
<div id="participants">
<%= f.simple_fields_for :participants do |participant| %>
<%= render "participants_fields", f: participant %>
<% end %>
<div class="links text-center">
<%= link_to_add_association "Add a participant", f, :participants, partial: "participants_fields", class:"btn btn-primary btn-sm btn-add-friend" %>
</div>
</div>
</div>
<div class="col-xs-12 col-md-10 col-md-offset-1 text-center">
<%= f.submit "See result" , class:"btn btn-success btn-lg btn-event" %>
</div>
<% end %>
_participants_fields.html.erb
<div class="nested-fields">
<%= f.input :first_name, label: "Participant's first name" %>
<%= f.input :salary, label: "Participant's monthly pay" %>
<div class="links">
<%= link_to_remove_association "Remove this friend", f , class: "btn btn-danger btn-xs btn-remove-friend" %>
</div>
</div>
编辑更多html
<form novalidate="novalidate" class="simple_form new_event" id="new_event" action="/events" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="O5XM0JMiVBbpPNaKF1apw7rdtC/XEBhasZQoK6POycZQ2Zp14Td1ljoJyIUKTwtl91LlBHeDkKFtcWRnNu+iEQ==">
<div class="col-xs-12 col-md-10 col-md-offset-1">
<h1>Wanna share fair?</h1>
<p>Create an event, enter the bill to share.</p>
<div class="form-group string optional event_name"><label class="control-label string optional" for="event_name">Event's name</label><input class="form-control string optional" type="text" name="event[name]" id="event_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_total_price"><label class="control-label integer optional" for="event_total_price">What is the total price</label><input class="form-control numeric integer optional" type="number" step="1" name="event[total_price]" id="event_total_price" data-com.agilebits.onepassword.user-edited="yes"></div>
<p>Add the participants.</p>
<div id="participants">
<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489705438668_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489705438668][first_name]" id="event_participants_attributes_1489705438668_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489705438668_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489705438668][salary]" id="event_participants_attributes_1489705438668_salary" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489705438668][_destroy]" id="event_participants_attributes_1489705438668__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div><div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489705443842_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489705443842][first_name]" id="event_participants_attributes_1489705443842_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489705443842_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489705443842][salary]" id="event_participants_attributes_1489705443842_salary" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489705443842][_destroy]" id="event_participants_attributes_1489705443842__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div><div class="links text-center">
<a class="btn btn-primary btn-sm btn-add-friend add_fields" data-association="participant" data-associations="participants" data-association-insertion-template="<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_new_participants_first_name">Participant&#39;s first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][new_participants][first_name]" id="event_participants_attributes_new_participants_first_name" /></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_new_participants_salary">Participant&#39;s monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][new_participants][salary]" id="event_participants_attributes_new_participants_salary" /></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][new_participants][_destroy]" id="event_participants_attributes_new_participants__destroy" value="false" /><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div>
" href="#">Add a participant</a>
</div>
</div>
</div>
<div class="col-xs-12 col-md-10 col-md-offset-1 text-center">
<input type="submit" name="commit" value="See result" class="btn btn-success btn-lg btn-event" data-disable-with="See result">
</div>
</form>
IIRC 您显示的 ID 的“1489697584487”部分是由 Cocoon 根据当前时间戳创建的。这意味着每次你 运行 你的测试数字都会不同，所以你将无法 select 通过 id select 这些元素。
相反，如果您只添加一名参与者，您应该能够执行类似
的操作
fill_in "Participant's first name", with: "John"
fill_in "Participant's monthly pay", with: "2300"
如果您要添加多个参与者，那么根据确切的布局，您可以使用 nth-child/nth-of-type CSS select 或限定范围 fill_in 或使用 all 和 select 你想要的，等等
find('.nested-fields:nth-child(2)').fill_in ...
all(:field, "Participant's first name", minimum: 2)[1].set("John") # 0 based index so minimum should be 1 more than the index you want
此外 - 要使其中任何一项工作，您需要使用支持 JS 的驱动程序（Cocoon 需要 JS）。您还没有用 js: true 元数据标记您的规范，所以要么您覆盖了默认驱动程序，要么您当前没有使用支持 JS 的驱动程序 - 如果您还没有配置 https://github.com/teamcapybara/capybara#selecting-the-driver. Also see https://github.com/teamcapybara/capybara#transactions-and-database-setup and https://github.com/DatabaseCleaner/database_cleaner#rspec-with-capybara-example =25=] 用于支持 JS 的驱动程序
你好，我正在做我的第一次测试，我需要你的帮助。我正在使用 Rails5.
问题是因为我相信嵌套字段...（使用 Cocoon gem）
水豚 returns 这个错误：
Capybara::ElementNotFound:
Unable to find field "event_participants_attributes_1489697584487_first_name"
我的 html 看起来像这样：
<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489697584487_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489697584487][first_name]" id="event_participants_attributes_1489697584487_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489697584487_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489697584487][salary]" id="event_participants_attributes_1489697584487_salary"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489697584487][_destroy]" id="event_participants_attributes_1489697584487__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div>
这是我的 features/events/create_event.spec.rb
require 'spec_helper'
require 'rails_helper'
describe "Creating an event" do
it "redirects on result page on success" do
visit "/"
click_link "Create a new event"
expect(page).to have_content('Wanna share fair?')
fill_in :name, with: 'Rent a plane'
fill_in "What is the total price", with: 200
click_link "Add a participant"
fill_in "event_participants_attributes_1489697584487_first_name", with: "John"
enter code here
fill_in ":event_participants_attributes_1489697584487_salary", with: 2300
click_button "See result"
expect(page).to have_content('Your salary together:')
end
end
这是我的 simple_forms:
_form.html.erb
<%= simple_form_for @event do |f| %>
<div class="col-xs-12 col-md-10 col-md-offset-1">
<h1>Wanna share fair?</h1>
<p>Create an event, enter the bill to share.</p>
<%= f.input :name, label: "Event's name" %>
<%= f.input :total_price, label: "What is the total price" %>
<p>Add the participants.</p>
<div id="participants">
<%= f.simple_fields_for :participants do |participant| %>
<%= render "participants_fields", f: participant %>
<% end %>
<div class="links text-center">
<%= link_to_add_association "Add a participant", f, :participants, partial: "participants_fields", class:"btn btn-primary btn-sm btn-add-friend" %>
</div>
</div>
</div>
<div class="col-xs-12 col-md-10 col-md-offset-1 text-center">
<%= f.submit "See result" , class:"btn btn-success btn-lg btn-event" %>
</div>
<% end %>
_participants_fields.html.erb
<div class="nested-fields">
<%= f.input :first_name, label: "Participant's first name" %>
<%= f.input :salary, label: "Participant's monthly pay" %>
<div class="links">
<%= link_to_remove_association "Remove this friend", f , class: "btn btn-danger btn-xs btn-remove-friend" %>
</div>
</div>
编辑更多html
<form novalidate="novalidate" class="simple_form new_event" id="new_event" action="/events" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="O5XM0JMiVBbpPNaKF1apw7rdtC/XEBhasZQoK6POycZQ2Zp14Td1ljoJyIUKTwtl91LlBHeDkKFtcWRnNu+iEQ==">
<div class="col-xs-12 col-md-10 col-md-offset-1">
<h1>Wanna share fair?</h1>
<p>Create an event, enter the bill to share.</p>
<div class="form-group string optional event_name"><label class="control-label string optional" for="event_name">Event's name</label><input class="form-control string optional" type="text" name="event[name]" id="event_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_total_price"><label class="control-label integer optional" for="event_total_price">What is the total price</label><input class="form-control numeric integer optional" type="number" step="1" name="event[total_price]" id="event_total_price" data-com.agilebits.onepassword.user-edited="yes"></div>
<p>Add the participants.</p>
<div id="participants">
<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489705438668_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489705438668][first_name]" id="event_participants_attributes_1489705438668_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489705438668_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489705438668][salary]" id="event_participants_attributes_1489705438668_salary" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489705438668][_destroy]" id="event_participants_attributes_1489705438668__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div><div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_1489705443842_first_name">Participant's first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][1489705443842][first_name]" id="event_participants_attributes_1489705443842_first_name" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_1489705443842_salary">Participant's monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][1489705443842][salary]" id="event_participants_attributes_1489705443842_salary" data-com.agilebits.onepassword.user-edited="yes"></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][1489705443842][_destroy]" id="event_participants_attributes_1489705443842__destroy" value="false"><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div><div class="links text-center">
<a class="btn btn-primary btn-sm btn-add-friend add_fields" data-association="participant" data-associations="participants" data-association-insertion-template="<div class="nested-fields">
<div class="form-group string optional event_participants_first_name"><label class="control-label string optional" for="event_participants_attributes_new_participants_first_name">Participant&#39;s first name</label><input class="form-control string optional" type="text" name="event[participants_attributes][new_participants][first_name]" id="event_participants_attributes_new_participants_first_name" /></div>
<div class="form-group integer optional event_participants_salary"><label class="control-label integer optional" for="event_participants_attributes_new_participants_salary">Participant&#39;s monthly pay</label><input class="form-control numeric integer optional" type="number" step="1" name="event[participants_attributes][new_participants][salary]" id="event_participants_attributes_new_participants_salary" /></div>
<div class="links">
<input type="hidden" name="event[participants_attributes][new_participants][_destroy]" id="event_participants_attributes_new_participants__destroy" value="false" /><a class="btn btn-danger btn-xs btn-remove-friend remove_fields dynamic" href="#">Remove this friend</a>
</div>
</div>
" href="#">Add a participant</a>
</div>
</div>
</div>
<div class="col-xs-12 col-md-10 col-md-offset-1 text-center">
<input type="submit" name="commit" value="See result" class="btn btn-success btn-lg btn-event" data-disable-with="See result">
</div>
</form>
IIRC 您显示的 ID 的“1489697584487”部分是由 Cocoon 根据当前时间戳创建的。这意味着每次你 运行 你的测试数字都会不同，所以你将无法 select 通过 id select 这些元素。
相反，如果您只添加一名参与者，您应该能够执行类似
的操作fill_in "Participant's first name", with: "John"
fill_in "Participant's monthly pay", with: "2300"
如果您要添加多个参与者，那么根据确切的布局，您可以使用 nth-child/nth-of-type CSS select 或限定范围 fill_in 或使用 all 和 select 你想要的，等等
find('.nested-fields:nth-child(2)').fill_in ...
all(:field, "Participant's first name", minimum: 2)[1].set("John") # 0 based index so minimum should be 1 more than the index you want
此外 - 要使其中任何一项工作，您需要使用支持 JS 的驱动程序（Cocoon 需要 JS）。您还没有用 js: true 元数据标记您的规范，所以要么您覆盖了默认驱动程序，要么您当前没有使用支持 JS 的驱动程序 - 如果您还没有配置 https://github.com/teamcapybara/capybara#selecting-the-driver. Also see https://github.com/teamcapybara/capybara#transactions-and-database-setup and https://github.com/DatabaseCleaner/database_cleaner#rspec-with-capybara-example =25=] 用于支持 JS 的驱动程序