Search code examples
robotframeworkplaywright

Error: locator.hover: Unsupported token "@class" while parsing selector

I am using browser keyword 'Hover' to let robot select a value which at the bottom of drop down list.

test case:

*** Settings ***
Library     Browser
    
*** Test Cases ***
Upload New Dual Channel Audio
        Fill Text    ${TextField-Job-Name}     ${RandomNumber}
        click   //input[contains(@type,'search')]
        Hover    //div[@class='ant-select-item-option-content'][contains(.,'train-again-v1-16k')]

After corrected script to have // at selector and error is now caused by selector not found:

001-upload-single-audios                                              TimeoutError: locator.hover: Timeout 30000ms exceeded.

=========================== logs =========================== waiting for selector "//div[@class='ant-select-item-option-content'][contains(.,'train-again-v1-16k')]"

outer HTML:

<div class="rc-virtual-list" style="outline: green dotted 2px !important;">
   <div class="rc-virtual-list-holder" style="max-height: 256px; overflow-y: hidden; overflow-anchor: none;">
      <div style="height: 352px; position: relative; overflow: hidden;">
         <div class="rc-virtual-list-holder-inner" style="display: flex; flex-direction: column; transform: translateY(64px); position: absolute; left: 0px; right: 0px; top: 0px;">
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="autotestmodel-3126-v2-8k">
               <div class="ant-select-item-option-content">autotestmodel-3126-v2-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="autotestmodel-6716-v2-8k">
               <div class="ant-select-item-option-content">autotestmodel-6716-v2-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="Singapore Codeswitch 16k">
               <div class="ant-select-item-option-content">Singapore Codeswitch 16k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="manualtest8020-v1-8k">
               <div class="ant-select-item-option-content">manualtest8020-v1-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="mmlntu-v1-8k">
               <div class="ant-select-item-option-content" style="">mmlntu-v1-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="semicolon:test123-v1-8k">
               <div class="ant-select-item-option-content">semicolon:test123-v1-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="sourcemodel8k8020-v1-8k">
               <div class="ant-select-item-option-content" style="">sourcemodel8k8020-v1-8k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="false" class="ant-select-item ant-select-item-option" title="test2-16000-7030-v13-16k" style="">
               <div class="ant-select-item-option-content" style="">test2-16000-7030-v13-16k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
            <div aria-selected="true" class="ant-select-item ant-select-item-option ant-select-item-option-active ant-select-item-option-selected" title="train-again-v1-16k">
               <div class="ant-select-item-option-content" style="">train-again-v1-16k</div>
               <span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
            </div>
         </div>
      </div>
   </div>
   <div class="rc-virtual-list-scrollbar rc-virtual-list-scrollbar-show" style="width: 8px; top: 0px; bottom: 0px; right: 0px; position: absolute; display: none;">
      <div class="rc-virtual-list-scrollbar-thumb" style="width: 100%; height: 128px; top: 128px; left: 0px; position: absolute; background: rgba(0, 0, 0, 0.5); border-radius: 99px; cursor: pointer; user-select: none;"></div>
   </div>
</div>

Solution

  • Your xpath is missing the '//'. An xpath should always start with // except when you start from the html element.

    Adding the // like this should work if the remainder of your xpath is correct.

    Hover    //div[@class='ant-select-item-option-content'][contains(.,'mmlntu-v1-8k')]

    If you could provide your html, I could give you a more specific answer for your situation.

    Update after adding html
    Try this:

    Hover    //div[@class='ant-select-item-option-content' and contains(text(),'mmlntu-v1-8k')]

    For future reference on xpaths, u can use this cheatsheet: https://devhints.io/xpath