Selenium - how to get element and its subelements text

Question

Short version: I can get the chat message (using selenium's By.xpath in java) but I want to include smiles into proper places.

Longer version: Hello, I've been tackling this interesting issue where I need to parse a chat message from the web browser and recreate it using java and selenium. I got no problem parsing the text of the message but I want to parse it with it's subelements (smile icons) as well. Is there any good approach to this except for manual source code parsing?

Here's a code for a single message that I'm able to access:

<div class="chat_msg chat_msg_caller ">
    <div class="chat_msg_head">
        <span class="chat_msg_author">
            SomeAuthor
        </span>
        <span class="chat_msg_date">
           SomeDate
        </span>
    </div>
    <div class="chat_msg_body message_text">
        SomeMessageText
        <span class="sml-icon biggrin">
            <span>
                :D
            </span>
        </span>
        SomeOtherText
        <span class="sml-icon biggrin">
            <span>
                :D
            </span>
        </span>
    </div>
</div>

Here's an example of how I'm getting the chat message text:

String msgTxt = we.findElement(By.xpath("//div[@id='messages_body']/div[" + (i + 1) + "]/div[@class='chat_msg_body message_text']")).getText();

My result: SomeMessageText SomeOtherText The result I want: SomeMessageText :D SomeOtherText :D

CSS files:

http://badoocdn.com/v2/-/-/css/base-ltr.268.css
http://badoocdn.com/v2/-/-/css/page.chat-ltr.22.css
http://badoocdn.com/v2/-/-/css/popup.messenger-ltr.230.css

Structure:

<div id="messages_body">
   <div id="pager" class="pages"> … </div>
   <div class="chat_msg chat_msg_caller ">
       <div class="chat_msg_head">
          <span class="chat_msg_author"> … </span>
          <span class="chat_msg_date"> … </span>
       </div>
       <div class="chat_msg_body message_text"> … </div>
   </div>
   <div class="me chat_msg chat_msg_owner "> … </div>
   <div class="chat_msg chat_msg_caller "> … </div>
   <div class="me chat_msg chat_msg_owner "> … </div>
   <div class="chat_msg chat_msg_caller "> … </div>
   <div class="chat_msg chat_msg_caller "> … </div>
   <div class="chat_msg chat_msg_caller "> … </div>
   ...

Answer 1

If I'm understanding you correctly you just need to perform a getText() on the parent element e.g.

driver.findElement(By.cssSelector(".chat_msg_body message_text")).getText()

This should return

SomeMessageText :D SomeOtherText :D

It's possible it may remove some whitespace, you'll need to give it a go and see.

Edit

Seeing as you are dealing with potential CSS problems you could always try the below:

driver.findElement(By.cssSelector(".chat_msg_body message_text")).getAttribute("textContent")

That should get the textContent even if CSS is moving things all over the place.