Knockout计算数据绑定与Capybara无法正常工作

时间:2014-02-11 15:27:55

标签: javascript ruby-on-rails knockout.js rspec capybara

我有一个具有计算字段的淘汰视图模型,当我手动填写表单时它工作正常,但在我使用fill_in的Capybara测试中,似乎淘汰赛无法识别输入字段已更改,并且所以它不会更新计算字段的选择选项。有没有办法让淘汰计算与水豚一起工作?这是我的规范:

it "saves a new appointment for driver", :js => true do
  date = 1.day.from_now.saturday? ? 2.days.from_now : 1.day.from_now

  driver = FactoryGirl.create(:driver, field_worker_name: Driver::DEFAULT_FIELD_WORKER_NAME)
  visit "/drivers/#{driver.id}"
  click_button 'Schedule An Appointment'
  fill_in("case_details_appointment_date", :with => date.strftime("%Y/%m/%d"))
  select("12 pm - 2 pm", :from => "case_details_appointment_time")
  select("Fund Enrollment", :from => "case_details_appointment_reason")
  fill_in("case-notes", :with => "Some Appointment Notes")
  click_button "Add Appointment"

  expect(page).to have_content 'Case was successfully created'
  expect(page).to have_selector("#schedule-appointment")

  driver_case = driver.reload.cases.last
  driver_case.type.should == 'schedule_appointment'

  expect(page).to have_content 'Case History'
  expect(page).to have_content driver_case.updated_at.strftime("%Y/%m/%d")
end

相关观点

<div class="inline col-sm-6">
  <%= detail_fields.label :appointment_date, "What is the date for the appointment?", class: 'required' %>
  <div class="input-group">
    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
    <%= detail_fields.text_field :appointment_date,
    placeholder: "yyyy/mm/dd",
    class: 'form-control date-input',
      type: 'tel',
      'data-bind' => "value: date, optionsCaption: 'yyyy/mm/dd'" %>
    </div>
  </div>
  <div class="inline col-sm-6">
    <%= detail_fields.label :appointment_time, 'What time is the appointment?', class: 'required' %>
    <%= detail_fields.select :appointment_time, Case::APPOINTMENT_WEEKDAYS,
    { prompt: "Select an Appointment Time" },
    {class: 'form-control', required: 'required', 'data-bind' => 'options: available_timeslots'} %>
  </div>
  <div class="inline col-sm-6">
    <%= detail_fields.label :appointment_reason, 'What is the reason for the appointment?', class: 'required' %>
    <%= detail_fields.select :appointment_reason,
    ['Fund Enrollment', 'General Information', 'ACA Navigation', 'Claims Assistance'],
    { prompt: "Select an Appointment Reason" },
    {class: 'form-control', required: 'required'} %>
  </div>
</div>

淘汰视图模型

ready = ->
  HEALTHFUND.AppointmentViewModel = {}
  HEALTHFUND.AppointmentViewModel = (->

    @date = ko.observable()

    @weekday_timeslots = ['10 am - 12 pm', '12 pm - 2 pm', '2 pm - 4 pm', '4 pm - 6 pm', '6 pm - 9 pm', '9 pm - 12 am']
    @sunday_timeslots = ['12 pm - 2 pm', '2 pm - 4 pm', '4 pm - 6 pm', '6 pm - 8 pm']
    @available_timeslots = ko.computed =>
      input_date = new Date(@date()).getDay()

      if input_date == 0
        return @sunday_timeslots
      else if input_date < 6
        return @weekday_timeslots
      else
        return []

  )()

$(document).ready ready
$(document).on "page:load", ready

1 个答案:

答案 0 :(得分:0)

我最终使用了phantomjs / poltergeist并且必须使用element.native.send_key方法来获取knockout以识别输入值已更改。希望这有助于某人!

it "saves a new appointment for driver", js: true, driver: :poltergeist do
  date = 1.day.from_now.saturday? ? 2.days.from_now : 1.day.from_now

  driver = FactoryGirl.create(:driver, field_worker_name: Driver::DEFAULT_FIELD_WORKER_NAME)
  visit "/drivers/#{driver.id}"
  click_button 'Schedule An Appointment'
  find('input#case_details_appointment_date').native.send_key(date.strftime("%Y/%m/%d"))
  find('#case_details_appointment_time').click
  select("12 pm - 2 pm", :from => "case_details_appointment_time")
  select("Fund Enrollment", :from => "case_details_appointment_reason")
  fill_in("case-notes", :with => "Some Appointment Notes")
  click_button "Schedule Appointment"

  expect(page).to have_content 'Case was successfully created'
  expect(page).to have_selector("#schedule-appointment")

  driver_case = driver.reload.cases.last
  driver_case.type.should == 'schedule_appointment'

  expect(page).to have_content 'Case History'
  expect(page).to have_content driver_case.updated_at.strftime("%Y/%m/%d")
end