Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

jQuery toggling elements and page body update #19

Open
carlosantoniodasilva opened this issue Jun 25, 2010 · 1 comment
Open

jQuery toggling elements and page body update #19

carlosantoniodasilva opened this issue Jun 25, 2010 · 1 comment

Comments

@carlosantoniodasilva
Copy link

Hello, I'm having some hard time here to track down a problem I'm having while testing env-js.
What I want to achieve is really simple: There is a link to Twitter that when clicked, shows some tweets hidden in the page (I'll probably change this to load tweets on the fly, but for now it's ok). Here is a sample markup:

<a href="#">Twitter</a>
<div style="display:none">
  <ul id="twitter_update_list"><li><span>Lorem Ipsum</span></li><li><span>Lorem Ipsum</span></li><li><span>Lorem Ipsum</span></li></ul>
  <a href="#" target="_blank">leia mais &gt;&gt;</a>
</div>

I have a test written that just asserts the elements are not visible in the page, then click that Twitter link, and assert the elements are now visible. It fails in this last test.
Using the browser everything is working fine so far.

Here is some debug I've done. As you can see, by using javascript (jQuery) to check whether the element is visible or not, it apparently works. However page body stays unchanged when I check it's content.

(rdb:1) p page.evaluate_script(%q[$("a:contains(Twitter)").next().is(':hidden')])
true
(rdb:1) n # => click_link 'Twitter'
(rdb:1) p page.evaluate_script(%q[$("a:contains(Twitter)").next().is(':hidden')])
false
# And page body does not change

Here is an attempt to use jQuery straight from browser window. Parent is the div with style="display:none", that I expect to be shown when clicking the link. Even tough I try to call :show on it, it does not work.

(rdb:1) p page.driver.browser['window'].jQuery('#twitter_update_list').parent.is(':hidden')
true
(rdb:1) p page.driver.browser['window'].jQuery('#twitter_update_list').parent.show
[object Object]
(rdb:1) p page.driver.browser['window'].jQuery('#twitter_update_list').parent.is(':hidden')
false
(rdb:1) p page.driver.browser['window'].jQuery('#twitter_update_list').parent.parent.html
<a href="#">Twitter</a>
<div style="display:none">
  <ul id="twitter_update_list"><li><span>Lorem Ipsum</span></li><li><span>Lorem Ipsum</span></li><li><span>Lorem Ipsum</span></li></ul>
  <a href="#" target="_blank">leia mais &gt;&gt;</a>
</div>

Displays the same markup.
My javascript function does nothing more than toggling the div element when clicking the "Twitter" link:

$(this).next().toggle();
return false;

I was able to get it working by changing .toggle() to .removeAttr('style'), for testing purposes. That for some reason worked pretty much well, but is not what I want to achieve.

It's important to know that I'm writing this application with Rails 3 beta 4, Ruby 1.8.7, Rspec 2.0 beta 12.
Before the same feature/test was working in a previous version of the application running in Rails 2.2.3, and using Capybara + Culerity/Celerity, and Rspec 1.3.0.

Any idea about that?
Any help would be appreciated.
Thanks, Carlos.

@smparkes
Copy link
Owner

smparkes commented Jul 2, 2010

I don't think env.js has much support for CSS at this point. IIRC, it's going to require special handling of the style attribute which isn't there ...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants