How to use test_should_dispatch_click_event_element_handle method in Playwright Python

Problem is, that these are not text or input elements, but divs, which inner HTML is being changed when typing. You can check that, by opening WhatsApp in the browser, opening the dev tools, and typing something into the field.

You can identify those divs via the title attribute, as those seem to be unique: //div[@title="Search text box"]

Playwright cannot change the inner HTML of a div, but you could do via Javascript, which you let evaluate by Playwright.

The Javascript would be (you can evaluate that in the dev tools' console):

document.querySelector('div[title^=\'Search text box\']').innerHTML = 'contact name';

To evaluate this from your python code:

page.evaluate('() => document.querySelector('div[title^=\'Search text box\']').innerHTML = 'contact name'')

See documentation for more details: https://playwright.dev/python/docs/evaluating

Try following css selector to identify the element and then click the item.

await page.click("[data-test-id='selectForBattleButton']");

in the docker, you don't need to go inside python. Just run from bash:

$ npx playwright open google.com

For more options, check out the doc: https://playwright.dev/docs/cli/

Original answer:

Using querySelector() / querySelectorAll with XPath (XML Path Language) lets you retrieve the elementHandle (respectively a collection of handles). Generally speaking, XPath can be used to navigate through elements and attributes in an XML document.

from playwright import sync_playwright

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        page = browser.newPage()
        page.goto('https://duckduckgo.com/')
        element = page.querySelector('input[id=\"search_form_input_homepage\"]')
        
        parent = element.querySelector('xpath=..')
        grandparent = element.querySelector('xpath=../..')
        siblings = element.querySelectorAll('xpath=following-sibling::*')
        children = element.querySelectorAll('xpath=child::*')

        browser.close()

Update (2022-07-22):

It seems that browser.newPage() is deprecated, so in newer versions of playwright, the function is called browser.new_page() (note the different function name).

Optionally create a browser context first (and close it afterwards) and call new_page() on that context.

The way the children/parent/grandparent/siblings are accessed stays the same.

from playwright import sync_playwright

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        context = browser.new_context()
        page = context.new_page()
        page.goto('https://duckduckgo.com/')
        element = page.querySelector('input[id=\"search_form_input_homepage\"]')
        
        parent = element.querySelector('xpath=..')
        grandparent = element.querySelector('xpath=../..')
        siblings = element.querySelectorAll('xpath=following-sibling::*')
        children = element.querySelectorAll('xpath=child::*')

        context.close()
        browser.close()

This works for me, is your element maybe no textarea or prevents new lines with a custom onChange handler in e.g. React?

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch()
        page = browser.new_page()
        page.set_content("""<textarea id="foobar"></textarea>""")
        page.fill("#foobar", "foo\nbar")
        page.screenshot(path="example.png")
        browser.close()

This works for me, is your element maybe no textarea or prevents new lines with a custom onChange handler in e.g. React?

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch()
        page = browser.new_page()
        page.set_content("""<textarea id="foobar"></textarea>""")
        page.fill("#foobar", "foo\nbar")
        page.screenshot(path="example.png")
        browser.close()

import requests
import threading

totalRequests = 0
numberOfThreads = 10
threads = [0] * numberOfThreads


def worker(thread):
    r = requests.get("url")
    threads[thread] = 0  # free thread


while totalRequests < 100:
    for thread in range(numberOfThreads):
        if threads[thread] == 0:
            threads[thread] = 1  # occupy thread
            t = threading.Thread(target=worker, args=(thread,))
            t.start()
            totalRequests += 1

Heroku doesn't support webkit at the time, with other browsers, you can use this buildpack: https://github.com/mxschmitt/heroku-playwright-buildpack/

In playwright, there are three alternatives to select dropdown element

1.  select by label

2. select by index

3.  select by value

You can select dropdown element by visible text(label) or by value instead and select dropdow element by attribute is not supported in playwright even not in Selenium too.

Example:

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.firefox.launch()
    page = browser.new_page() 
    page.goto(url)  
    page.locator('//select[@name="dropdown_selected_size_name"]').select_option(label="4,0 x 30 mm 500 Stück")
    #page.locator('//select[@name="dropdown_selected_size_name"]').select_option(value="B08XWN4HM6")
    page.wait_for_timeout(4000)
    browser.close()