How to get text from span nested - selenium - c#

Question

I have this HTML :

<span class="title-book">
   Sherlock_Holmes
   <span class="count-market">834</span>
</span>

I want to extract only the value of the first span, I tried with both methods:

IList<IWebElement> ListBooks = MenuAll.FindElements(By.XPath("//span[@class='title-book']"));

and

IList<IWebElement> ListBooks = MenuAll.FindElements(By.CssSelector(".title-book"));

But I get this result: Sherlock_Holmes834 .

Why?

Answer 1

The problem is that the span.title-book element holds not only the desired text but also another SPAN that contains the text "834". "Sherlock_Holmes" text is considered a text node and cannot be retrieved using Selenium alone, we have to use Javascript to get it.

/// <summary>
/// Returns the text of the specified child text node.
/// </summary>
/// <param name="parentElement">The parent <see cref="IWebElement"/> of the desired text node.</param>
/// <param name="index">The index of the childNode collection relative to parentElement</param>
/// <returns>The text of the specified child text node.</returns>
public string GetChildTextNode(IWebElement parentElement, int index = 0)
{
    string s = (string)((IJavaScriptExecutor)driver).ExecuteScript("return arguments[0].childNodes[arguments[1]].textContent;", parentElement, index);
    return s.Trim();
}

You would call it like

Console.WriteLine(GetChildTextNode(driver.FindElement(By.CssSelector("span.title-book"))));

Answer 2

The text Sherlock_Holmes is within the <span class="title-book"> ... </span> tag. So to retrieve the text Sherlock_Holmes you can use the following code block :

IWebElement elem = driver.FindElement(By.XPath("//span[@class='title-book']"));
string myText = (string)((IJavaScriptExecutor)driver).ExecuteScript("return arguments[0].firstChild.textContent;", elem);