Could someone help me to identify the correct csslocator for the second span element in the below image:

enter image description here

I tried the below locators but was not able to succeed, is there anything wrong with the locator used ?

driver.FindElement(By.CssSelector("class[onclick='gotoReportView(20, 'ReportSectionc5404625cccfdb7d5563')']")).Click();

driver.FindElement(By.CssSelector("Span[onclick='gotoReportView(20, 'ReportSectionc5404625cccfdb7d5563')']")).Click();
  • The persone who mention this as "-1" please post the correct answer or else the admin need to control these kind of stupid activities on giving permissions to beginners to mark a question as"-1" – ChathuD Jan 9 '20 at 11:22

I would like to suggest a different way to get to the element that I use a lot. It might be slower, because it does mutliple FindElement(s) calls, but it is so much more readable and understandable.

var container = driver.FindElement(By.ClassName("items-container"));
var spans = container.FindElements(By.TagName("span"))

You find the div and then search for elements within the div and then take the second one to interact with.

  • Wow,That was a quick answer and a correct answer,Thank You!. – ChathuD Jan 9 '20 at 9:35
  • But I was hardly looking for a CSSSelector. :( – ChathuD Jan 9 '20 at 9:36

Your css locator is wrong:

driver.FindElement(By.CssSelector("class[onclick='gotoReportView(20, 'ReportSectionc5404625cccfdb7d5563')']")).Click();

driver.FindElement(By.CssSelector("Span[onclick='gotoReportView(20, 'ReportSectionc5404625cccfdb7d5563')']")).Click();

The format for css locator is ,

  1. tag[attribute='value']
  2. tag.classname
  3. tag#id
  4. Tag>Tag (direct child)
  5. tag tag (in direct child , equvalent to /tag//tag in xpath)
  6. tag[attribute*='value'] ( Similar to contains in xpath, it search for partial match)
  7. tag[attribute^='value'] ( find attribute that start with particular value)

So the correct css locator is:

driver.FindElement(By.CssSelector("span[onclick=\"gotoReportView(20, \'ReportSectionc5404625cccfdb7d5563\')\"]")).Click();


 driver.FindElement(By.CssSelector("span[class='item'][onclick=\"gotoReportView(20, \'ReportSectionc5404625cccfdb7d5563\')\"]")).Click();

Note: you should escape the quotes (\') as there are quotes within the locator

And also use " quotes for the value Eg "[attribute=\"somthing(\'something\')\"]"

So just use the locator as it is in the DOM, and escape inner quotes using '\'

  • I tryed but its not working fine.Im getting below error.An exception of type 'OpenQA.Selenium.InvalidSelectorException' occurred in WebDriver.dll but was not handled in user code Additional information: invalid selector: An invalid or illegal selector was specified – ChathuD Jan 9 '20 at 11:05
  • For the 1st one - Additional information: no such element: Unable to locate element: {"method":"css selector","selector":"span[onclick='gotoReportView(20, "ReportSectionc5404625cccfdb7d5563")']"} Let me try the 2nd one, Any way thank you very much for your valuable effort. – ChathuD Jan 9 '20 at 11:25
  • Same error for the 2nd option too.--An exception of type 'OpenQA.Selenium.NoSuchElementException' occurred in WebDriver.dll but was not handled in user code Additional information: no such element: Unable to locate element: {"method":"css selector","selector":"span[class='item'][onclick='gotoReportView(20, "ReportSectionc5404625cccfdb7d5563")']"} – ChathuD Jan 9 '20 at 11:27
  • Let me look into this – PDHide Jan 9 '20 at 11:27
  • No isses ,I will stick to Niels van Reijmersdal's replay. – ChathuD Jan 9 '20 at 11:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.