testing gmap4rails without selenium - testing

We're just playing around with the infowindows in our project that uses gmap4rails. Pulled stuff out into a partial as recommended:
#json = #results.to_gmaps4rails do |org, marker|
marker.infowindow render_to_string(:partial => "popup", :locals => { :#org => org})
end
Partial has this:
and we've checked that we can match xpath with it in chrome like so:
$x("//div[#class='map_container']//a[#href='/organizations/127']")
however this doesn't work in a cucumber spec like so:
expect(page).to have_xpath("//div[#class='map_container']//a[#href='#{organization_path(org)}']")
All code in a branch here: https://github.com/tansaku/LocalSupport/tree/map_links
Is there a recommended best practice for integration tests of the infowindows? I can write a view spec for the partial, or a controller spec etc., but perhaps there's no way to integration test the infowindow contents since that all gets rendered by the browser, so short of full selenium testing are there any good options?
Would http://phantomjs.org/ help here? We are already using capybara-webkit
Many thanks in advance

Related

how to reach to table content which is coming from ajax in codeception?

I want to click the button which is in table,And table is coming from jquery ajax.
I have tried
$vic->click("Approved",Locator::href("//*[#id='users']/tbody/tr[1]/td[5]/a='Approved'"));
Link or Button by name or CSS or XPath element with 'Approved' was not found.
It looks like you are using module which does not execute client side Javascript code.
If you want to test that code, you must use WebDriver module which tests websites using real browser.
Like #Naktibalda said, you should look at the WebDriver docs. You can do something like this:
$I->waitForElement(['id' => 'myButtonFromTheAjaxCall']);
$I->click(['id' => 'myButtonFromTheAjaxCall']);
Also, I would use a unique ID on that button coming over from your AJAX call if you can rather than using XPath, it's quicker I think.

autocomplete method refuses to fire in RSpec test

I am on Day 4 of trying to get an autocomplete field to fire in an RSpec test. Works super in the browser, it is just incredibly resistant to running in my request specs.
UPDATE: It looks like my RSpec/Capy scripts are running against the dev db instead of the test db. I'm using Pow, so I don't know what to set default_url_options[:host] or Capybara.app_host and Capybara.server_port to. I have a feeling if I fix this, it may work.
The stack is:
Rails 3.2.16
Capybara
RSpec
Poltergeist/PhantomJS
Pow
Zeus
Factory Girl
Click links, click buttons, fill_in fields all work great. But when it comes time to get this autocomplete to work, it absolutely refuses to work.
I am using this method:
def fill_autocomplete(field, options = {})
fill_in field, with: options[:with]
page.execute_script %Q{ $("##{field}").trigger('focus') }
page.execute_script %Q{ $("##{field}").trigger('keydown') }
selector = %Q{ul.ui-autocomplete li.ui-menu-item a:contains("#{options[:select]}")}
Capybara::Screenshot.screenshot_and_open_image
page.should have_selector('ul.ui-autocomplete li.ui-menu-item a')
page.execute_script %Q{ $("#{selector}").trigger('mouseenter').click() }
end
which I found here. The screenshot line is my own. But the line above:
page.should have_selector('ul.ui-autocomplete li.ui-menu-item a')
returns false. It works like a charm in the browser. I just can't for the life of me figure out why it won't work. I have tried everything I know how. How can I debug this?
The screenshot just shows the page I am expecting, with the field filled in appropriately. I even tested this with a "hello" alert that I inserted into the autocomplete call. Works flawlessly in the browser, but no result at all in the test.
In short, it looks like the following two lines are having no effect:
page.execute_script %Q{ $("##{field}").trigger('focus') }
page.execute_script %Q{ $("##{field}").trigger('keydown') }
I had a similar problem and even though Capybara's documentation says that have_selector will wait for the AJAX call to complete, it did not work for me.
The following worked in my case:
def fill_in_autocomplete(field_label, field_class, options = {})
field_id = "##{page.evaluate_script("$('#{field_class}').attr('id')")}"
selector = "ul.ui-autocomplete li.ui-menu-item a"
fill_in(field_label, with: options[:with])
page.execute_script("$('#{field_id}').trigger('focus')")
page.execute_script("$('#{field_id}').trigger('keydown')")
sleep(2) # Hack! not sure why the line below isn't working...
#expect(page).to have_selector(selector, text: options[:with])
page.execute_script("$('#{selector}').click()")
end
You can call the method above like this:
fill_in_autocomplete('Some label', '.js-some-field', with: 'Some value'
I didn't want to pass the field ID and opted for a class instead, which is why the first line in the helper gets the ID based on the element's class.
This kind of asynchronous call is really tricky to troubleshoot. As Xaid suggested, sometimes just putting in an arbitrary sleep suffices to get the job done.
I've found in my own coding that what typically happening is that though Capybara tries to intelligently wait for the AJAX to do its magic, something is causing Capybara to believe the conditions are met for it to continue when you're not actually ready for it to do so.
Digging into the code for Capybara, you can find that the delays around asynchronous behavior are accomplished with the synchronize wrapper function that's part of the Node::Base class. (See here, if you're curious how it actually works: https://github.com/jnicklas/capybara/blob/master/lib/capybara/node/base.rb#L73)
Essentially, it's doing a series of wait commands for you (0.05 second each time) and trapping any "I can't find that element" exceptions until the timeout (defaulted at 2 seconds) has passed. If for any reason, the element you're waiting on DOES exist before you expect it to, it will stop waiting and move on.
Dumping out the HTML of the page as it exists in the headless browser can be a great troubleshooting trick. Try inserting a puts page.body into your code before your screenshot code. That should output the HTML for the page. Does the code include the ul.ui-autocomplete li.ui-menu-item a where you expect it to be? How about after that delay Xiad suggested. Does it exist then?
For really sticky problems, I'll add the pry gem to my project and insert a binding.pry into the code. That lets me play with the browser from within the test to see what it's seeing. Granted, with timing issues, I typically can't act fast enough to see what it's seeing, but even that's a clue.
Hopefully, these troubleshooting tips are helpful.
I had this problem and no proposed solution could solve it. My tests always failed when trying to find the ul.ui-autocomplete element. I finally noticed, that jQuery autocomplete appends the ul to the end of the html page and NOT to the input field in question. In my spec, I follow the practice of targeting my forms explicitly by within my_form do and doing all the fill_instuff inside this block:
within my_form do
fill_autocomplete …
end
Of course this could never find the ul attached OUTSIDE this form element. My solution was simple: Use jQuery autocomplete's attribute appendTo: '#id_of_input_field' when initializing autocomplete. Now it can find my uland everything works fine.

rails 3.2 not detecting javascript changes?

i am a newbie in rails 3.2. now i have a problem following:
i have 2 patials for showing highchart are _device_per_product.html.erb and device_per_platform.html.erb. and i render these by this way:
jQuery("#element_div").html("<%= escape_javascript(render(:partial => 'partial_page')) %>");
when i click a link to render my partial,it works. but next time, i render another partial,it just load javascript code but not generate highchart form these code.
In my opinion,For First time the javascript is freshly loading in my page. So it will work. Next time my javascript is not working. please help me solve that problem
I suspect you have something like:
$('#element_div a').click(function() {
//do something
});
This only binds to what's on the page when it fires. If you are introducing new (or replacing) this then you need to change the listener.
$(document).on("click","#element_div a", function () {
// do something
}} );
A more detailed explanation along with alternatives for older versions of jquery can be found at https://stackoverflow.com/a/10394566/2197771

How add CJuiDatePicker in JQRelcopy on Yii Framework

I have a problem with CJuiDatePicker in the module JQRelcopy on Yii framework.
I use this module as I have a form with a datepicker field to be copied as many times as the user wishes.
The module works fine if I put a normal field (without datepicker), but as soon as I add the module CJuiDatePicker which is also a module of the Yii framework, I have a blank page appears. I followed the following tutorial: http://www.yiiframework.com/extension/jqrelcopy/ explains the integration jqrelcopy in a form containing CJuiDatePickerm, which is exactly what I need.
I study the problem and I saw that it was when I Atoute the following line in the properties of my widget JQRelcopy the problem occurs:
'jsAfterNewId' => JQRelcopy::afterNewIdDatePicker($datePickerConfig),
in
$this->widget('ext.jqrelcopy.JQRelcopy', array(
'id' => 'copylink',
'removeText' => 'remove',
//add the datapicker functionality to the cloned datepicker with the same options
'jsAfterNewId' => JQRelcopy::afterNewIdDatePicker($datePickerConfig),
));
I look in several forums and anywhere a person has had the same problem as me.
The only way I could do this in the past, was ditching the CJuiDatePicker and using the on method of JQuery.
$('body').on('focus', '.idata', function(){
jQuery(this).datepicker(
jQuery.extend(
{showMonthAfterYear:false},
jQuery.datepicker.regional['pt-BR'],
{'showAnim':'fold','dateFormat':'dd/mm/yy'}
)
);
});
Or, you can use live method...
Just Import ext.jqrelcopy.JQRelcopy in your form file at the top
Yii::import('ext.jqrelcopy.JQRelcopy');
Your Problem be solved if any Issue let me know i will further assist.

Is there a way to pass html/css options to rails_admin inputs?

I'm using rails_admin and I'd like to add a few custom styles to my admin section on some inputs. Is there any way to specify additional classes?
Something like:
configure :title, :string do
css_class 'my-class'
input_html {:class => 'my-class', :toolbar => 'my-toolbar'}
end
I can't seem to find a comprehensive list of what options are available. I know I can specify hidden, visible, ckeditor true, and one or two other things.
I'm using some additional custom JS and CSS, but I need to be able to specify some CSS classes to make everything work the way I want.
Specifically, I'm using CKEditor, and would like to use multiple toolbars, one simple and one advanced. I've been able to config CKEditor fine, but I can't find a way to have Rails_admin use an alternate toolbar.
You can use :html_attributes
https://github.com/sferik/rails_admin/blob/master/lib/rails_admin/config/fields/base.rb#L126
There is also css_class. So you could have something like:
field :your_field do
css_class do
# Be sure to not remove the original class
# set by #{self.name}_field
"#{self.name}_field your_custom_class"
end
end