RSpec + Sinatra +水豚（+ webkit）为js textarea测试

Question

我试图测试一个sinatra（1.3.2）应用程序与更新使用数据绑定通过Knockout.js在客户端连接，我需要对此进行一些测试。然而，我似乎无法让它工作。我配置RSpec与水豚（使用webkit的js驱动程序），并由于某种原因，当我测试使用find_field（'lead [temporary_notes）.text在相关的领域（它得到它的价值从Knockout）我得到一个空字符串..任何想法，为什么这是或如何正确地测试？

谢谢！

- 杰克

这里的规范（它访问的页面的块之前更高描述块）：

describe "submitting with empty field (home phone)" do 
    before do 
     fill_in "Home Phone", with: "" 
     fill_in "lead[temporary_notes]", with: x_lead.temporary_notes 
     fill_in "Appointment Time", with: "07/07/12 9:43 am" 
     click_button "Post Lead" 
    end 
    it { should have_selector('div.alert', text: "missing required fields")} 
    it { find_field('First Name').value.should == x_lead.fname } 
    it { find_field('Last Name').value.should == x_lead.lname } 
    it { find_field('Address').value.should == x_lead.address1 } 
    it { find_field('City').value.should == x_lead.city } 
    it { find_field('Zip').value.should == x_lead.zip } 
    it { find_field('Home Phone').value.should == "" } 
    it { find_field('Cell Phone').value.should == x_lead.phone3 } 
    it { find_field('Spouse Phone').value.should == x_lead.phone4 } 
    it { find_field('Email Address').value.should == x_lead.email } 
    it { find_field('lead[temporary_notes]').text.should == x_lead.temporary_notes } 
    end 

而这里的页面（ERB）：

<div id="lead-form" class="row"> 
    <form accept-charset="UTF-8" action="/leads" class="new_lead" id="new_lead" method="post" name="new_lead"> 
     <div style="margin:0;padding:0;display:inline"> 
      <input name="utf8" type="hidden" value="✓"> 
      <div id="lead-personal" class="span3"> 
       <label class="switch-spousename no_selection required_field" for="lead_fname"><span id="first_name_switch">First Name</span></label><input id="lead_fname" name="lead[fname]" size="30" type="text" value="<%= @lead.fname %>"> 
       <label class="switch-lastname no_selection required_field" for="lead_lname"><span id="last_name_switch">Last Name</span></label> <input id="lead_lname" name="lead[lname]" size="30" type="text" value="<%= @lead.lname %>"> 
       <label class="switch-spousename no_selection" for="lead_spouse"><span id="spouse_name_switch">Spouse Name</span></label><input id="lead_spouse" name="lead[spouse]" size="30" type="text" value="<%= @lead.spouse %>"> 
       <label for="lead[email]">Email Address</label><input type="text" name="lead[email]" value="<%= @lead.email %>" id="lead[email]"> 
      </div> 

      <div id="lead-phone" class="span3"> 
       <label for="lead_phone1" class="required_field">Home Phone</label><input id="lead_phone1" name="lead[phone1]" size="30" type="text" value="<%= @lead.phone1 %>"> 
       <label for="lead_phone2">Cell Phone</label><input id="lead_phone2" name="lead[phone2]" size="30" type="text" value="<%= @lead.phone2 %>"> 
       <label for="lead_phone4">Spouse Phone</label> <input id="lead_phone4" name="lead[phone4]" size="30" type="text" value="<%= @lead.phone4 %>"> 
      </div> 
      <div id="lead-address" class="span4"> 
       <label for="lead_address1" class="required_field">Address</label> <input id="lead_address1" name="lead[address1]" size="30" value="<%= @lead.address1 %>"type="text"> 
       <label for="lead_city" class="required_field">City</label> <input id="lead_city" name="lead[city]" size="30" type="text" value="<%= @lead.city %>"> 
       <label for="lead_state" class="required_field">State</label> <input id="lead_state" name="lead[state]" size="30" type="text" value="<%= @lead.state %>"> 
       <label for="lead_zip" class="required_field">Zip</label> <input id="lead_zip" name="lead[zip]" size="30" type="text" value="<%= @lead.zip %>"> 

       <div class="control-group"> 
        <label class="control-label" class="required_field" for="lead_lead_home_ownership">Homeowner Status:</label> 
        <div id="lead-homeowner-status" class="controls"> 
         <label class="radio inline" for="lead_lead_home_ownership">Own</label> <input checked="checked" class="radio inline" id="lead_lead_home_ownership_own" name="lead[lead_home_ownership]" type="radio" value="Own"> <label class="radio inline" for="lead_lead_home_ownership">Rent</label> <input class="radio inline" id="lead_lead_home_ownership_rent" name="lead[lead_home_ownership]" type="radio" value="Rent"> <label class="radio inline" for="lead_lead_home_ownership">Lease</label> <input class="radio inline" id="lead_lead_home_ownership_lease" name="lead[lead_home_ownership]" type="radio" value="Lease"> <label class="radio inline" for="lead_lead_home_ownership">Other</label> <input class="radio inline" id="lead_lead_home_ownership_other" name="lead[lead_home_ownership]" type="radio" value="Other" > 
        </div> 
       </div> 
      </div> 
      <div id="lead-comments" class="span3"> 

       <label for="lead[temporary_notes]">Notes</label> 
       <textarea cols="30" name="lead[temporary_notes]" data-bind="value: leadTelemarketerNotes" rows="3" value="<%= @lead.temporary_notes %>" id="lead_temporary_notes"/> 
</textarea> 
      </div> 
      <div id="lead-appointment" class="span3"> 
       <label for="lead_contact_time" class="required_field">Appointment Time</label> <input id="lead_contact_time" name="lead[contact_time]" size="30" type="text" value="<%= @lead.contact_time %>"> 

      </div> 

      <input type="hidden" name="lead[lead_callcenter_notes]" data-bind="value: leadCallcenterNotes" /> 
      <input type="hidden" name="lead[lead_callcenter_rep]" data-bind="value: leadTelemarketerName" /> 

      <input class="btn btn-success" id="lead-submit" name="commit" type="submit" value="Post Lead"> 
     </div> 
    </form> 
</div> 
    <script type="text/javascript" charset="utf-8"> 
    var ko_form = new LeadViewModel("<%= @lead.lead_callcenter_rep %>", "<%= @lead.temporary_notes %>", <%= @lead.has_alarm %>); 
    ko.applyBindings(ko_form); 
    var tooltipDelay = ({ show: 550, hide: 75 }); 
    $('#first_name_switch').tooltip({title: "Click: Switch with Spouse name", delay: tooltipDelay}); 
    $('#last_name_switch').tooltip({title: "Click: Switch with First name", delay: tooltipDelay}); 
    $('#spouse_name_switch').tooltip({title: "Click: Switch with First name", delay: tooltipDelay}); 
</script> 

运行规格时我得到这个：

Failure/Error: it { find_field('lead[temporary_notes]').text.should == x_lead.temporary_notes} 
    expected: "Some notes" 
     got: "" (using ==) 

Answer 1

您可能需要明确声明测试需要JavaScript驱动程序。你可以尝试：

describe "test description", :js => true do 
    ... 
end