Question

我需要帮助解决Rails 4应用程序中Javascript单击事件的Rspec功能测试问题。我使用Capybara，FactoryGirl和种子文件进行数据处理。 Poltergeist是Capybara的JavaScript驱动程序。我遇到问题的测试涉及一个图像地图，当用户点击热点时，会选择下拉菜单选项。我的应用程序代码在浏览器中按预期工作。该脚本在测试期间按预期执行，但我在编写通过测试（期望）时遇到问题。

这里是spec文件中的相关代码：

feature 'Clicking hotspots on image map' do

scenario 'selects chest muscle group', js:true do
  login
  expect(page).to have_content ("New Strength Exercise")
  #binding.pry
  page.execute_script("$('#map_chest_strength').click()")
  #save_and_open_page
  expect(page).to have_select("#strength_exercise_muscle_group_id", with_options: "Chest - pectoralis")
end
end

当我运行测试时，出现以下错误：失败/错误：期望（页面）.to have_select（＆＃34;＃strength_exercise_muscle_group_id＆＃34;，with_options：＆＃34;胸部 - 胸大肌＆＃34;）期望找到选择框＆＃34;＃strength_exercise_muscle_group_id＆＃34;至少选择＆＃34;胸部 - 胸大肌＆＃34;但是没有比赛

以下相关的JavaScript / JQuery代码：

//Chest Muscle Group & Strength Exercise     
$("#map_chest_strength").click(function(){
    var chestID = 1;
    var muscle_group = $("#strength_exercise_muscle_group_id option[value='" + chestID + "']").attr("selected","selected");
    console.log(muscle_group);
 //Filters Strength Exercises by Chest Muscle Group        
    filterStrengthExercises();
 //Gets exercise description when user clicks muscle group via image map
    getDescription();
 }); // end image map - chest click event

以下相关的HTML来源：

<h4><span class="number">1</span>Choose target muscles</h4><br>
<label class="string optional" for="strength_exercise_muscle_group">Muscle group</label><br />
<select id="strength_exercise_muscle_group_id" name="strength_exercise[muscle_group_id]"><option value="">Your target muscles</option>
<option value="1">Chest - pectoralis</option></select>

种子文件在测试环境中加载，click事件按预期触发。＆＃34;胸部 - 胸大肌＆＃34;被选为浏览器中的下拉选项。为什么我的Rspec期望失败？我做错了什么，我该如何修复测试？谢谢你的帮助！

Answer 1

have_select匹配器获取选择框（不是css选择器）的标签，名称或ID，而with_options采用数组，因此它应该是

expect(page).to have_select("strength_exercise_muscle_group_id", with_options: ["Chest - pectoralis"])

将检查选择至少选项＆＃34;胸部 - 胸大肌＆＃34;存在。如果要验证选择是否存在并且选择了该选项，则它将是

expect(page).to have_select("strength_exercise_muscle_group_id", selected: "Chest - pectoralis")

注意 - 如果选择框是多选

，则所选选项可以是字符串数组

另外，在你的JS中，你使用.attr（＆＃34;选择＆＃34;，＆＃34;选择＆＃34;）来设置选择状态，这应该是.prop（＆＃34;选择＆＃34;，true）（对所有布尔属性都相同）设置elements属性，该属性是选择是否被选中的正确指示符（而不是属性，在此上下文中实际上仅与页面加载时相关）

无法通过JavaScript点击事件对我的Rspec测试通过

1 个答案: