Can't enter text in search field with Selenium

Question

Set up:

I'm editing products in the online back-end of a webshop.

I have to update prices of hundreds of products and would like to do so via a script.

I've succesfully logged into the system using Selenium and navigated to the product management page which consists of a table containing the products.

---

Problem:

I can't seem to make selenium manipulate the table. There's an advanced search which seems to be living on the table.

I've tried to enter a text in the search field both via XPath or CSS selector but nothing seems to work.

Python executes the code without an error, but the text won't appear in the search field.

By XPath:

search_field = browser.find_element_by_xpath(
    '/html/body/table/tbody/tr[2]/td[4]/table[2]/tbody/tr/td/table/tbody/tr/td/table/tbody/tr[1]/td/div/input',
        )
search_field.clear()
search_field.send_keys('brand')

By CSS selector:

search_field = browser.find_element_by_css_selector(
    '#Products > tbody > tr:nth-child(1) > td > div > input',
        )
search_field.clear()
search_field.send_keys('brand')

How do I get the text into the search field?

The HTML of the search field is:

<input type="text" class="text-field text-field-250 searchBox">

---

HTML

<tr>
                                <td class="searchArea">
                                    <div class="grid-area-filter-item">
                                        <label class="line-label">Search:</label>
                                        <input type="text" class="text-field text-field-250 searchBox">
                                    </div>
                                    <span class="grid-area-filter-item">
                                        <a href="#" class="button button-fleft searchButton">
                                            <span>Search</span>
                                        </a>
                                        <a href="#" class="button button-fleft resetButton">
                                            <span>Reset</span>
                                        </a>
                                    </span>
                                        <a class="link-advanced">Advanced</a>
<table class="advanced-search" style="display: none;">
    <tbody>
        <tr>
            <td class="label">Type: 
            </td>
            <td class="control">


<select class="select-400" data-val="true" data-val-number="The field ProductTypeId must be a number." id="ProductTypeId" name="ProductTypeId"><option value="">Please select</option>
<option value="2">Accessories</option>
<option value="3">Back Cushion</option>
<option value="4">Down-Blend</option>
<option value="6">Foot</option>
<option value="7">Foot Finish</option>
<option value="8">Leather Care</option>
<option value="9">Mattress</option>
<option value="10">Mattress Upgrade</option>
<option value="11">Power Reclining</option>
<option value="12">Seat Cushion</option>
<option value="13">Sleeper Sofa Sheets</option>
<option value="14">Sleeper</option>
<option value="15">Stressless Promo Accessories</option>
<option value="16">Enso Foundation</option>
<option value="17">Stand Alone Mattresses</option>
<option value="18">Base</option>
<option value="19">Enso Pillows</option>
<option value="20">Ottoman</option>
<option value="21">Add Pillows</option>
<option value="22">Rug</option>
<option value="23">Swivel</option>
<option value="25">Storage Chaise</option>
<option value="26">Office Chair</option>
<option value="27">Casters</option>
<option value="29">Paragon Sleeper Sheets</option>
<option value="30">Power Sleeper</option>
<option value="32">Bernhardt Nailheads</option>
<option value="33">Power + Swivel</option>
<option value="34">Bernhardt Tables</option>
<option value="35">Nailheads</option>
<option value="36">Base Type</option>
<option value="37">Wooden Side Panel</option>
</select>

            </td>
        </tr>
        <tr>
            <td class="label">Model: 
            </td>
            <td class="control">


<div class="hide-input">
<input data-val="true" data-val-number="The field ModelId must be a number." id="ModelId" name="ModelId" type="text" value="">
</div>


<span class="button button-fleft"><input type="button" class="lookup-button" data-lookupurl="/models/lookup" data-hiddeninput="ModelId" value="Select"></span>
<label for="ModelId">Please select item</label>



            </td>
        </tr>
        <tr>
            <td class="label">Brand: 
            </td>
            <td class="control">


<div class="hide-input">
<input data-val="true" data-val-number="The field BrandId must be a number." id="BrandId" name="BrandId" type="text" value="">
</div>


<span class="button button-fleft"><input type="button" class="lookup-button" data-lookupurl="/brands/lookup" data-hiddeninput="BrandId" value="Select"></span>
<label for="BrandId">Palliser</label>



            </td>
        </tr>
        <tr>
            <td class="label">Size: 
            </td>
            <td class="control">


<div class="hide-input">
<input data-val="true" data-val-number="The field SizeId must be a number." id="SizeId" name="SizeId" type="text" value="">
</div>


<span class="button button-fleft"><input type="button" class="lookup-button" data-lookupurl="/sizes/lookup" data-hiddeninput="SizeId" value="Select"></span>
<label for="SizeId">Please select item</label>



            </td>
        </tr>
        <tr>
            <td class="label">Customization Level: 
            </td>
            <td class="control">

<select class="select-400" id="CustomizationLevel" name="CustomizationLevel"><option value="">Please select</option>
<option value="Full">Full Customization</option>
<option value="Little">Little Customization</option>
<option value="No">No Customization</option>
<option value="Custom">Custom Customization</option>
<option value="MarriedGroup">Married Group Customization</option>
<option value="MarriedSale">Married Sale Customization</option>
<option value="PartlyInStock">Partly In Stock Customization</option>
<option value="Complex">Complex Customization</option>
<option value="NotForSale">Not For Sale</option>
</select>
            </td>
        </tr>
        <tr>
            <td class="label">Back Type: 
            </td>
            <td class="control">

<select class="select-400" id="BackType" name="BackType"><option value="">Please select</option>
<option value="TightBack">Tight-Back</option>
<option value="AttachedPillowBack">Attached Pillow-Back</option>
<option value="LoosePillowBack">Loose Pillow-Back</option>
</select>
            </td>
        </tr>
        <tr>
            <td class="label">Furniture Type: 
            </td>
            <td class="control">


<select class="select-400" data-val="true" data-val-number="The field FurnitureId must be a number." id="FurnitureId" name="FurnitureId"><option value="">Please select</option>
<option value="1">Fabric</option>
<option value="2">Leather</option>
</select>

            </td>
        </tr>
        <tr>
            <td class="label">
                Out Of Stock Type:
            </td>
            <td class="control">

<select class="select-400" id="ProductAvailabilityType" name="ProductAvailabilityType"><option value="">Please select</option>
<option value="ZeroQuantity">Zero Quantity</option>
<option value="HiddenFromSite">Hidden From Site</option>
</select>
            </td>
        </tr>
    </tbody>
</table>

                                </td>
                            </tr>

Answer 1

Try the following code -- here I used explicit wait:

from selenium.webdriver.support import ui
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By


search_field = ui.WebDriverWait(browser, 10).until(EC.visibility_of_element_located((By.CSS_SELECTOR, ".text-field.text-field-250.searchBox")))
browser.execute_script("arguments[0].scrollIntoView(true);", search_field)
search_field.clear()
search_field.send_keys("brand")

PS: Used CSS Selector as a locator. Hope it helps you!

Answer 2

To enter the text brand in Search Field you can use the following code block :

search_field = browser.find_element_by_xpath("//td[@class='searchArea']/div[@class='grid-area-filter-item']//input[@class='text-field searchBox' and contains(@class,'text-field-')]")
search_field.clear()
search_field.send_keys('brand')

Answer 3

Use class name as locator

search_field= browser.find_element_by_class_name('text-field text-field-250 searchBox')
search_field.send_keys('brand')

or Use xpath as locator

search_field= browser.find_element_by_xpath("//input[@class='text-field text-field-250 searchBox']")
search_field.send_keys('brand')