Selenium2Library and css selector

[Tatu aalto]

Ugh

I have been playing with css selectors with Seleniun2library to overcome few problems. I did notice that some of the selenium css selectors can be used and some not with the Selenium2library. Based on the Sausage Labs [1] example I did found that matching substring works *= but prefix ^= did not work. Because matching substring works, it provides me a workaround which leaves a door open for false positives. But is there some sort doc which would indicate what I can use what is not possible?

The second problem that I am having is looking like this:
Here is code and I have multiple same kind of element that I would need to click. Only difference is that text inside of the element p.  
<div class="some identical stuff here"style="height: 36px; width: 96px;">
    <p>foobar</p>
</div>

I can not use xpath, because thet change allmost every code commit to the UI.

Is there way to click the element based on the text inside of the element p? From the user groups search I did found a post [2], that did suggests in their post to use this format: css=a#contains('unique_id'). But when I use this keyword combination Click Element    css=p#contains('foobar') I get error: webDriverException: Message: u'An invalid or illegal string was specified'. Is there away to overcome my problem?

Because I am quite new on the css selectors, perhaps I am looking some sort of dummies guide how this css selectors works. Any good suggestions for reading?

-Tatu
[1] http://sauceio.com/index.php/2010/01/selenium-totw-css-selectors-in-selenium-demystified/
[2] https://groups.google.com/forum/?fromgroups=#!searchin/robotframework-users/Help$20In$20Identifying$20Elements/robotframework-users/fsLSGsMq3Pg/Biwz_pZ8h_MJ

[eleong]

I like using Firebug with FirePath add-on to check my css locator's correctness.  If you install these you can select the element of interest, then look at its CSS or XPATH locators.  It's best to learn to read the css first (w3schools.com is good for that).

The syntax you have below for #2 says css=a#contains['unique_id']   The # seems to be a mistake, you want css=a:contains['unique_id']  

OR you can try css=a#unique_id  (# implies an unique identifier immediately follow the hash)

s

-Eliza

[Tatu Aalto]

Ugh

1. better understanding
Thanks from the pointer, I did read w3schools.com [1] and I think that I did get better understanding.

2. Correct selector
The syntax is not correct if I try: css=p:contains['Wind'] and I get same error: WebDriverException: Message: u'An invalid or illegal string was specified'
And the trace implies that webdriver does not understand my request:
Traceback (most recent call last):
  File "<string>", line 2, in click_element
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/keywordgroup.py", line 12, in _run_on_failure_decorator
    return method(*args, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/_element.py", line 254, in click_element
    self._element_find(locator, True, True).click()
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/_element.py", line 520, in _element_find
    elements = self._element_finder.find(browser, locator, tag)
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/locators/elementfinder.py", line 27, in find
    return strategy(browser, criteria, tag, constraints)
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/locators/elementfinder.py", line 66, in _find_by_css_selector
    browser.find_elements_by_css_selector(criteria),
  File "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/remote/webdriver.py", line 369, in find_elements_by_css_selector
    return self.find_elements(by=By.CSS_SELECTOR, value=css_selector)
  File "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/remote/webdriver.py", line 684, in find_elements
    {'using': by, 'value': value})['value']
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/webdrivermonkeypatches.py", line 11, in execute
    result = self._base_execute(driver_command, params)
  File "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/remote/webdriver.py", line 156, in execute
    self.error_handler.check_response(response)
  File "/usr/local/lib/python2.7/dist-packages/selenium/webdriver/remote/errorhandler.py", line 147, in check_response
    raise exception_class(message, screen, stacktrace)

If I try css=p#Wind it does not find the element. Error message is: ValueError: Element locator 'css=p#Wind' did not match any elements.
The trace implies that error is coming from Selenium2library:
Traceback (most recent call last):
  File "<string>", line 2, in click_element
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/keywordgroup.py", line 12, in _run_on_failure_decorator
    return method(*args, **kwargs)
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/_element.py", line 254, in click_element
    self._element_find(locator, True, True).click()
  File "/usr/local/lib/python2.7/dist-packages/Selenium2Library/keywords/_element.py", line 522, in _element_find
    raise ValueError("Element locator '" + locator + "' did not match any elements.")


-Tatu
[1] http://www.w3schools.com/cssref/css_selectors.asp

--
You received this message because you are subscribed to the Google Groups "robotframework-users" group.
To view this discussion on the web visit https://groups.google.com/d/msg/robotframework-users/-/Yr_l2n3-9EgJ.
To post to this group, send email to robotframe...@googlegroups.com.
To unsubscribe from this group, send email to robotframework-u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/robotframework-users?hl=en.

[Kevin O.]

Learning CSS selectors is on my to do list.

For you second issue I'm fairly certain you can use XPath.

Try xpath=//p[contains(text(), 'foobar')]

[David]

Kevin's suggestion is correct, you can use XPath to match by text in an element. I would highly suggest that route because:

WebDriver has deviated from Selenium RC in what you'd expect for CSS locator support. It now uses native browser CSS support rather than Sizzle library and falls back to it only on unsupported browsers (old IE8/9?). If you want Sizzle, you have to inject it manually for use with WebDriver. What's the issue with that? Native CSS support excludes the contains() method, which is not an official CSS spec method. And that's the only way to match by element text in CSS.

Eliza's suggestion of FirePath is also good. Using FirePath, you can test out official CSS selectors using the CSS dropdown option for finding/testing elements. Use the Sizzle drop down for testing unofficial + official CSS selectors (like contains()). You'll see contains works under Sizzle but fail under CSS in FirePath.

[Jeremy Johnson]

Tato,

contains is what is called a pseudo-class selector. pseudo class selectors are not supported by webdriver, as they are not actually in the w3 css3 selector standards.  These are usually implemented in a js library like sizzle or jquery.

That being said *= and ^= should be supported, but matching a value of a dom element is tricky in css.  as suggested before you could use xpath or you could find a parent element that has and id and do something like #<parent-id> > p.

Hope that helps.

Cheers,

Jeremy

To unsubscribe from this group, send email to robotframework-users+unsub...@googlegroups.com.

[Tatu Aalto]

Ugh

I need to click the element because it changes the view in my html page. I know it is not regular button and it executes some Vaadin [1] stuff in the background to change the view.

I did not get the css locator working but the xpath  works like a charm. In practice this works:
Click Element    xpath=//p[contains(text(), 'foobar')]

Firepath is a great tool. I did not know that one did exist, Firebug I do have.

Thank you all from helping.

-Tatu
[1] https://vaadin.com/home

On 6.11.2012 2:13, eleong wrote:

Tatu,

It's hard to tell what you're trying to click without the html snippet.

Here's a small html to illustrate the point.  Save it as csshelp.html

<html>

<body>

<a>http://www.cnn.com</a>

<p>Some kind of display here</p>

<p id="demoparagraph">people groups</p>

</html>

Here's a small robot test to find the elements in it.  Save it as simple.txt and put your own name below:

| *Settings* | *Value* |

| Library     | Selenium2Library | timeout=10 |

| ***Testcases*** |

| Test 1 |

| | Open Browser |   file:///C:/Users/yourname/csshelp.html |  browser=chrome |

| | Sleep | 1 |

| | Element Should Contain | css=a  |  http://www.cnn.com |

| | Element Should Contain | css=p  | display | 

| | Close All Browsers |

You run pybot.bat simple.txt and it can find the css elements as expected.  

I'm not sure why you want to Click Element on a paragraph content  (it's not a button or a link), so I'm using Element Should Contain for the css locator.

Hope this helps you go further in your test.

On Sunday, November 4, 2012 1:58:26 AM UTC-8, Tatu aalto wrote:

--
You received this message because you are subscribed to the Google Groups "robotframework-users" group.

To view this discussion on the web visit https://groups.google.com/d/msg/robotframework-users/-/auC2qAdnbRgJ.

To post to this group, send email to robotframe...@googlegroups.com.

To unsubscribe from this group, send email to robotframework-u...@googlegroups.com.