Cucumber click only working when #javascript is used? - ruby-on-rails-3

I know there's a simple fix for this but for the life of me I can't remember what it is.
My feature file is as following:
Scenario: Editing locations
When I edit "Western Australia"
And fill in "Name" with "Tasmania"
And I press "Save"
Then I should see a form success message
And I've defined the 'Edit' step as the following:
When /^I edit "([^"]*)"$/ do |name|
within(:xpath, "//tr[./td[contains(text(), '#{name}')]]") do
find(:css, "a img[alt=Edit]").click
end
end
The HTML for the index page it works on is as follows:
<tr>
<td>Western Australia</td>
<td>WA</td>
<td>
<img alt="Edit" src="/images/icons/pencil.png" title="Edit" />
</td>
</tr>
And then the form HTML:
<%= semantic_form_for [:admin, #location] do |f| %>
<%= f.inputs do %>
<%= f.input :name %>
<%= f.input :abbreviation %>
<% end %>
<%= f.submit "Save" %></li>
<% end %>
As it is, it doesn't work - I get the following error:
And fill in "Name" with "Tasmania" # features/step_definitions/web_steps.rb:39
cannot fill in, no text field, text area or password field with id, name, or label 'Name' found (Capybara::ElementNotFound)
But the form element 'name' is clearly there on the page.
If I add 'Then show me the page' before the 'Fill in' then capybara saves the index page, leading me to think it isn't getting to the edit form at all.
... Yet if I add the '#javascript' tag to the feature, it works perfectly, even though there is no Javascript on this page.
I've solved this once before, but for the life of me I can't work out how...

Well I managed to solve the problem - the issue was with my CSS selector that was clicking the 'Edit' link. I don't know why it didn't work as-was, but I changed the find(:css, "a img[alt=Edit]").click to read click_link('Edit') and it worked perfectly.
Source: http://groups.google.com/group/ruby-capybara/browse_thread/thread/9c997395306d40e2/

For starters, you need to actually "visit" the edit page using the Capybara visit method within your When block. Also, I don't believe you want to use fill_in for inserting text into your tags (at least according to the error message it is only for text fields/areas).

Related

Rails 5 - use collection_radio_buttons to open a partial with nested models?

(my first SO question, so please be kind!)
Each Schedule has only one System;
Each System has many Applications;
Each Application has many Users and Documents.
What I want to do to create a Schedule entry:
Generate a form that first shows multiple System names that can be clicked. When a System is clicked, it opens a partial that lists Applications associated with that System. Then, when clicking particular Applications, yet another partial opens that contains Users and Documents associated with that particular Application.
When editing this entry later, I want to be able to see everything I had entered before, with the correct System, Application(s), User(s), and Document(s) already pre-selected.
My question here is how to make a form element for choosing a System that will open another partial -- and, later, will be pre-selected when I view and/or edit the entry.
What kinda works right now is a <%= link_to %>, styled with Bootstrap, which opens its associated Applications partial when it's clicked. However, I'm not able to save the System from it, and I can't figure out whether it can display as already-selected later, such as in an Edit form.
We're trying to use radio buttons instead (because you can't pre-select a link_to, right?), so I've been throwing pasta at the wall with f.collection_radio_buttons, or iterating over f.radio_button, or a tag of <input type="radio">. However, I can't figure out how to make a radio button open a partial.
Since first posting this question, I've narrowed down to using f.radio_button within a loop. It shows as correctly "checked" when viewed while Editing the entry later, but it still doesn't open the partial.
Here's a snippet from /_schedule_form.html.erb:
<%= form_for #schedule do |f| %>
<% System.all.each do |a| %>
<!-- This link_to makes the Applications partial appear, but that's all it does -->
<%= link_to a.system_nm, system_applications_path(:system_id => a.id,
:schedule_id => params['id']), :title => 'Click to choose system',
:class -> 'btn btn-default btn-flat active', data: {:remote => true,
'data-target' => '#applicationList'} %>
</a> <!-- closes the link_to tag, I believe -->
<% end %>
<div id="applicationList">
<!-- the Applications partial renders here -->
</div>
<% end %>
Here's the system_applications.js.erb file that opens the _system_applications.html.erb partial:
$("#applicationList").html("<%= escape_javascript(render
'system_applications', locals: {applications: #applications,
schedule_applications_array: #schedule_applications_array})%>");
Here's an update with possible clue:
I'm now using this embedded Ruby code:
<% System.all.each do |rt| %>
<label>
<%= f.radio_button :system_id, rt.id, data:{:remote => true, 'data-target' =>
'#applicationList'}, href: system_applications_path(:system_id => rt.id,
:schedule_id => params['id']), class: 'remote-input', onclick:
"#applicationsList" %>
</label>
<% end %>
And, when I click on that radio button, I'm getting a JS error in the browser console Uncaught SyntaxError: Invalid or Unexpected Token which points to the rendered HTML, and specifically the > at the end of the line:
<input data-remote="true" data-data-target="#applicationList" href="/schedules/system_applications/24?schedule_id=122" class="remote-input" onclick="#applicationList" type="radio" value="24" checked="checked" name="schedule[system_id]" id="schedule_system_id_24" />
Just to make it more complicated:
When creating a NEW entry, and when I hover over one of the link_to buttons, I get a clean-looking path like /schedules/system_applications/24, and that's what gets sent to the server when clicked (which then reads the params as {"system_id"=>"24"}. But hovering over the f.radio_button labels shows no path, and clicking it sends "/schedules/new?schedule%5Bsystem_id%5D=24" with the params {"schedule"=>{"system_id"=>"24"}}. This triggers a 500 (Internal Server Error) (which makes sense, because there's no path for that URL). Do the params need to be the same? If so, how am I screwing it up?
Also, clicking the radio button sends the request to SchedulesController#new, while clicking the link_to sends it to SchedulesController#system_applications. I don't understand how I'm telling the radio button to send it to #new.
Where I'm stuck now is, the f.radio_button renders as "checked", which is correct; but it doesn't open the partial. The link_to version opens the partial, but I don't think it can render as "checked" later on.
Let me know if I'm asking clearly enough, too.
I think we made it work. One key change was to use url instead of href to use the system_applications_path to the controller, as shown here:
<% #systems.each do |a|
<label class="btn btn-sm btn-default">
<%= f.radio_button :system_id, a.id, :data => {url:system_applications_path(:system_id
=> a.id, :schedule_id => params['id']), 'data-target' => '#applicationList'+a.id.to_s,
:remote => true} %>
<%= a.system_nm %>
</label>
<% end %>
Now, when I click the radio button, it opens the correct partial, and it shows as selected later when I go to edit the entry. The Bootstrap styling (btn btn-sm btn-default) helps to show how much clickable area there is, but it's not required for basic functionality.
I suppose some of that [in]famous Rails Magic has radio_buttons treating href: differently than url. But it's "magic" only because I don't understand it (yet -- growth mindset!). What's the explanation behind it?

simple_form error messages do not go away

I'm using simple_form with twitter bootstrap on Rails.
Everything works great, except when showing live validations in a form-inline class. My code for the form is:
<%= simple_form_for #message,
url: mailing_list_path,
html: { class: "form-inline" },
method: :post,
validate: true do |f| %>
<%= f.input_field :email_address, label: false %>
<%= f.submit "Submit" %>
<% end %>
This shows the error message properly (e.g. "is invalid"), but if I click off the input and then back on again, it adds another message (e.g. it would say "is invalid is invalid"). For example, two sequential invalid entries and then a blank entry would give:
Is there any way to have simple_form remove the existing error message before adding a new one?
EDIT:
I solved this using some ghetto js, but would still like to know if the functionality I mentioned above is built in. The divs are still there, they're just hidden instead of all showing together. Would be great to have them actually removed by the form validation...
$('input.email-address-input').on 'keyup', () ->
$(this).parent('form').siblings('.help-inline').hide()

Rendered partial not receiving params

I'm trying to implement an 'edit' link that brings up a form to change a displayed attribute on a page.
My layout has:
<div id="company_info">
<%= yield :company_info %>
</div>
<div id="edit_company_info">
</div>
My view has:
<%= content_for :company_info do %>
<%= render 'company_info' %>
<%= link_to "Edit", 'company_info_form', :class => 'btn btn-mini', :method => :get, :remote => true %>
My controller has:
def company_info_form
#company = Company.get(params[:id])
respond_to do |format|
format.js
end
end
My company_info_form.js.erb file has:
$('#edit_company_info').html("<%= escape_javascript(render "company_info_form") %>");
Upon clicking the link, my server shows:
Started GET "/companies/company_info_form" for 127.0.0.1 at 2012-03-12 20:19:13 -0700
Processing by CompaniesController#show as JS
Parameters: {"id"=>"company_info_form"}
Completed 500 Internal Server Error in 1ms
RuntimeError (Called id for nil, which would mistakenly be 4 -- if you really wanted the id of nil, use object_id):
app/controllers/companies_controller.rb:9:in `show'
So I think this is a routing issue-- but I have no idea how to fix it. How do I get the company_id param that is on my current page to be recognized by the partial I'm loading as well?
I'm on /companies/1, but the link is to companies/company_info_form, losing the "company_id = 1" param.
Yes, the issue is with your routes and with your link as you have pointed out.
The first issue can be ascertained as it says Processing by CompaniesController#show as JS. So, its actually going to companies#show where it tries to find a company based on id. But, since no correct id is passed, it errors out.
The second issue is because your link is to companies/company_info_form, as you pointed out, since you have used 'company_info_form' as the path in your link for edit. And you haven't passed current company to the link either.
Since you haven't posted your routes file, which you should have, since you have identified a potential problem with routes , I'll present my own.
In your routes :
resources :companies do
member do
get 'company_info_form'
end
end
That will provide you with
company_info_form_company GET /companies/:id/company_info_form(.:format) companies#company_info_form
Then you can provide the link as :
<%= link_to "Edit", company_info_form_company_path(#company) %>

tinymce issue with rails 3

I have legacy rails 3 app, where I need to modify a page to use tinymce to edit a text_area.
There are existing pages in this app that already use tinymce.
For reasons I cannot go into here, I cannot use any of the tinymce plugins that are available.
Now my problem is as follows.
I have a model called Sections, that has two attributes, section_name and html.
I want to be able to edit the html using tinymce.
My view has a form which is as follows
<%= form_for #section , :url => update_section_path , :method => :put do |f| %>
<%= f.hidden_field :id %>
<%= f.label :section_name , "Section Name" %>
<%= f.text_field :section_name %> <br />
<%= f.label :html, "Html" %>
<%= f.text_area :html %>
<%= f.submit "Update" %>
<% end %>
The form appears as expected.
The TinyMCE editor also appears on the page with the original html.
The problem is that when I click on the Update button, the put query sent to my server, does not contain the new modified content of the Html text_area. It sends back the original text that was in that text_area.
Could anyone help me understand why.
Thanks in advance
=Puneet
I found an issue in my html which was causing this. Once I fixed that issue it worked fine

Rails 3 show text field unless it has just "#"

In my Rails 3 web app, I have a Twitter text field in one of the forms and on the user page it displays it.
<%= f.label :twitter, "Twitter Username" %>
<%= f.text_field :twitter, :value => "#" %>
And on the user page:
<% if #user.twitter? %>
<div class="twitter"><%= #user.twitter %></div>
<% end %>
The problem is, when a user doesn't enter their Twitter username into the field, it keeps # in the field and displays it on the user page. Because of this I would like to make it so if it just has # then it doesn't display it.
Looks like the # value gets persisted into the database if the user doesn't specify a twitter name, right? Are you sure you want that?
You could, in the controller, when saving the user, do something like:
user.twitter = params[:user][:twitter] unless params[:user][:twitter] == "#"
This will ensure that the User#twitter field only gets set if something is specified.
But to answer your question specifically, you can do something like this in the view:
<%= #user.twitter == "#" ? "(not provided)" : #user.twitter %>