ruby-on-rails - Rails + Cucumber + Selenium: How to click on a span inside a ul and li?

Question

I am trying to write tests for clicking around on my mobile site. However, I'm having trouble finding any documentation on how to click embedded non link elements. This is my HTML:

form id="search-results-form" action="" method="post">
    <div>
        <ul id="see-more-search" class="see-more" style="display: block; height: auto;">
            <li>
                 <span>Color</span>
            </li>
            <li>
                 <span>Width</span>
            </li>
        </ul>
    </div>
 ...

This is my incomplete cucumber test:

When(/^touch "Color"$/) do
  within(:css, '#see-more-search') do
    #I want to be able to click the span with the text 'Color', but
    #don't know how to target it from this point
  end
end

Does anyone know how I would target the first li or the 'Color' span?

Answer 1

JavaScript を使用してみてください:

page.driver.browser.execute_script %Q{ $('#see-more-search ul li:first').trigger("mouseenter").click(); }