0

I'm trying to find an element on html tags using robot framework. I want to click on first element what ever the element is.

For example

  1. Input text in the text field and then pass key enter

  2. The item will show up and i want to click on first item but i cant

My Robot Code

Open Browser    http://www.tarad.com    chrome
Wait Until Element Is Visible    id=keyword
Input Text    id=keyword    dog
Press Key    id=keyword    \\13
Wait Until Element Is Visible    id=wrapper_body_all
Element Should Be Visible    id=wrapper_body_all
Click Element    xpath=//div[id='warpper_all']/div[id='wapper_body_all']//ul/il//img[constains(@src,'//img.trd.cm/120/120/sumpow/img-lib/spd_20140314140410_b.jpg')]

My HTML Tag

<div id="wrapper_body_all"> 
<div class="main-wrap">
    <!--start : #rightProduct-->
    <div class="section-col-right">         
        <!--start : rec_product -->
        <div class="rec_product">
        <!-- end : rec_product -->
        <div class="rec_product">
            <div class="section-products-box">
                <div class="hitproduct-body">
                    <ul class="hitproduct-list list">
                       <!--start : product-list--> 
                        <li>
                            <div class="item-border list">
                                <div class="item-image">
                                        <a href="//www.tarad.com/product/5913180" title="ลำโพงน่ารัก dog">
                                            <img src="//img.trd.cm/120/120/sumpow/img-lib/spd_20140314140410_b.jpg"
                                            alt="ลำโพงน่ารัก dog" data-pagespeed-url-hash="3676782613" 
                                            onload="pagespeed.CriticalImages.checkImageForCriticality(this);">
                                        </a>
                                </div>
                                <div class="item-details">                                          
                                    <div class="product-name">
                                        <a href="//www.tarad.com/product/5913180" title="ลำโพงน่ารัก dog">ลำโพงน่ารัก dog</a>
                                    </div>
                                </div>
                            </div>      
                        </li>
                        <!--end : product-list-->
                        <!--start : product-list--> 
                        <li>
                            <div class="item-border list">
                                <div class="item-image">
                                    <a href="//www.tarad.com/product/6755464" title="Brewdog Magic Stone Dog - 330 ml - 5">
                                        <img src="//www.tarad.com/images/web_main/default150x150.gif" 
                                        alt="Brewdog Magic Stone Dog - 330 ml - 5" data-pagespeed-url-hash="2123596038" 
                                        onload="pagespeed.CriticalImages.checkImageForCriticality(this);">
                                    </a>
                                </div>
                                <div class="item-details">                                          
                                    <div class="product-name">
                                        <a href="//www.tarad.com/product/6755464" title="Brewdog Magic Stone Dog - 330 ml - 5">
                                            Brewdog Magic Stone Dog - 330 ml - 5</a> 
                                    </div>
                                </div>
                            </div>
                        </li>
                        <!--end : product-list-->
                        ....
                        ....
                        ....
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

strong text

Error enter image description here

9
  • Post your Robot code also? Commented Mar 16, 2017 at 9:06
  • What does "i can't" mean? Why can't you? How are you attempting to do it? Commented Mar 16, 2017 at 9:29
  • I just start learning Robot Framework and my Assignment want me to select first item when there show up after i input text to search.but i cant select on the first item because there don't have any id to select :'( Commented Mar 16, 2017 at 9:54
  • @Goralight Click Element xpath=//div[id='warpper_all']/div[id='wapper_body_all']//ul/il//img[constains(@src,'//img.trd.cm/120/120/sumpow/img-lib/spd_20140314140410_b.jpg')] Commented Mar 16, 2017 at 9:57
  • 1
    Let us continue this discussion in chat. Commented Mar 16, 2017 at 10:24

2 Answers 2

1

Be warned, this is quite a brittle Xpath, but it will do the job you're trying to achieve:

Open Browser    http://www.tarad.com    chrome
Wait Until Element Is Visible    id=keyword
Input Text    id=keyword    dog
Press Key    id=keyword    \\13
Wait Until Element Is Visible    id=wrapper_body_all
Element Should Be Visible    id=wrapper_body_all
Wait Until Page Contains Element    xpath=(//div[@id='wrapper_body_all']/div/div[3]/div/div/div/div[2]/ul/li/div/div/a/img)[1]
Click Image    xpath=(//div[@id='wrapper_body_all']/div/div[3]/div/div/div/div[2]/ul/li/div/div/a/img)[1]

This Robot Code works for me, it goes to the site, then inputs "dog" to the search, and then clicks on the very first image result. If you want to find the 2nd, 3rd, etc - change the last number. for example:

xpath=(//div[@id='wrapper_body_all']/div/div[3]/div/div/div/div[2]/ul/li/div/div/a/img)[5]

Will find the 5th result. just change where it says [5]. Also, in your Robot make sure it says the entire xpath I just posted. That includes the xpath=

Any questions please ask.

Sign up to request clarification or add additional context in comments.

4 Comments

Thank you so much i can click on item that i want :)))))
@iSS.f No problem, glad I could help :) Have a great day!
I have one more questions xpath=(//div[@id='wrapper_body_all']/div/div[3]/div/div/div/div[2]/ul/li/div/div/a/img) what the meaning of [3] or [2] after div ?
@iSS.f The [3] basically means find me the 3rd entry. So for example, if there are 5 images, and you do //img[3] it will go through the HTML doc and find you the 3rd entry. You can do this with all HTML elements. If you want to learn Xpath I recommend this: ricostacruz.com/cheatsheets/xpath.html It helped me learn when I started out :)
0
Sometimes you can use another element earlier or later that does find it, and then use 

/preceding::div[1]

or

/ascending::div[1]

respectively

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.