josegp
josegp

Reputation: 559

Form is not being filled - Capybara

Having this form:

<h3 class="contact-header"><span>Ready to try it</span> GET IN TOUCH</h3>
<%= form_for @contact, url: pages_path, remote: true do |f| %>
  <div class= "flex-row">
    <div class="form-input-spacing">
      <%= f.label :name %>
      <%= f.text_field  :name, required: true, class: "contact-form-text-area" %>
    </div>
    <div class="form-input-spacing">
      <%= f.label :email %>
      <%= f.text_field :email, required: true, class: "contact-form-text-area" %>
    </div>
  </div>
  <div class="area-input">
    <%= f.label :message %>
    <%= f.text_area :message, rows: 8, cols: 59, required: true, class: "contact-form-text-area",
                            placeholder: "Send us a message"%>
  </div>
  <div class="submit-form">
    <%= f.submit 'Send Message', class: 'btn btn-primary' %>
  </div>
<% end %>

I am trying to test how it would be filled and then sent with Capybara:

scenario "visitor/user sends incomplete contact form" do
    visit root_path #form is in root

    within(".new_contact") do
      # fill_in "#contact_name", with: "Test User"
      # fill_in "contact_name", with: "Test User"
      find("#contact_name").set("Test User")
    end

    save_and_open_page   
  end

I have tried js: true in the scenario, and both fill_in and find but when I do save_and_open_page nothing is filled.

The reason why I used .new_contact is because in the Inspector, thats the class that the form takes, the #contact_nameis the id that the input takes andcontact_nameis the labelfor`.

If I use click_button "Send Message" the button is clicked and a message appears so why is it getting the button but not the input? Thanks!

Upvotes: 0

Views: 141

Answers (1)

Thomas Walpole
Thomas Walpole

Reputation: 49870

save_and_open_page saves the HTML with the element attributes, not the element's properties. It is really only useful for when you want to see modified page structure (the HTML structure has been changed). When you change the content of a field it changes the value property of that element but doesn't actually update the page HTML (value attribute), so when you save the HTML it won't have the value set. If you want to see the page as it was use save_and_open_screenshot, or just pause your test and look at the browser.

Also fill_in takes a locator, not CSS, so it would be

fill_in "contact_name", with: "Test User"

from https://rubydoc.info/gems/capybara/Capybara/Node/Actions#fill_in-instance_method - The field can be found via its name, id, test_id attribute, placeholder, or label text. - not CSS

Upvotes: 1

Related Questions