How to use test_should_have_default_url_when_launching_browser method in Playwright Python

I tried this and it worked (I used an element handler instead of arguments[0]):

selector = page.query_selector('.my-image')
img_base64 = page.evaluate("""(selector_handle) => {
    var cnv = document.createElement('canvas');
    cnv.width = 300; cnv.height = 300;
    cnv.getContext('2d').drawImage(selector_handle, 0, 0);
    return cnv.toDataURL('image/jpeg').substring(22);
}""", selector)
with open(r"image.jpg", 'wb') as f:
    f.write(base64.b64decode(img_base64))

The solution is here in the github issue [INSTALLATION/BUG] - Selenium and Google Colab #548:

I am closing this issue with the @mathigatti solution

!pip install TikTokApi
!python -m pip install playwright
!apt install libgstreamer1.0-0 libwoff1 libgstreamer1.0-0 libgstreamer1.0-dev libgstreamer-plugins-good1.0-0 libgstreamer-gl1.0-0 libgstreamer-plugins-bad1.0-0
%%writefile test.py
from TikTokApi import TikTokApi 
#your code

Then

!python test.py

There is no outer_html out of the box. But it's not hard to implement it:

locator.evaluate("el => el.outerHTML") 

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()

You have to import TimeoutError from playwright to catch this exception:

from playwright.async_api import async_playwright, TimeoutError

user and myInput are IDs on the input element itself and not on one of the parent elements. This means, that using a selector like this works in your scenario:

    page.type('input[name="email"]#user', "xxxxx")
    page.type('input[name="password"]#myInput', "xxxxxxxxxxxx")

The reason why it hangs is that it can't find the element. I would recommend to follow the Playwright debugging tools section to either use DEBUG=pw:api or the PWDEBUG=1 to get debug logs why its hanging - in your case it would tell you that the selector cannot be found.

page.goto returns the Response of the page where its navigating to. So you can do something like that:

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()

    response = page.goto("http://whatsmyuseragent.org/")
    assert response.ok

    browser.close()

I see what the problem here is. It does have to do with pyautogui and playwright not functioning together correctly. I tried searching around to find how to actually get the current mouse position with playwright, but I did not find anything.

So, here is my conclusion:

How did I figure out the problem, and what actually is the problem?

The problem here is that pyautogui actually controls the computer's mouse in this case. It seems like playwright only controls that of the browser. If you add a time.sleep(10) (In order to actually see if the cursor has changed position and to have time to move the cursor at a different position) at the end of the function like so:

def test_simple_move():
    mouse_start_position = pyautogui.position()
    print(mouse_start_position)
    
    with sync_playwright() as playwright:
        browser = playwright.chromium.launch(headless=False, slow_mo=10)
        page = browser.new_page()
        page.goto(r"http://www.uitestingplayground.com/")
        page.mouse.move(100,400)
        mouse_final_position = pyautogui.position()
        print(mouse_final_position)

        time.sleep(10)

You will then see that the actual cursor does not move. It seems like what playwright is doing here is just moving a "virtual" cursor in its browser. In fact, what I did to prove this was:

1. Launch the code
2. While the delay of 10 seconds is going, move the cursor to another point on the screen.
3. Wait for the code to finish.
4. You will now see how the points are different. Here are my points

So with the help of Joran I was able to make this code work, tx!

I used his suggestion for using a future twice to get the data outside the main() function.

mainRespPromise = asyncio.Future()

async def main():
    async with async_playwright() as p:
        myRespPromise = asyncio.Future()
        async def handle_response(response): 
        # the endpoint we are insterested in 
            if ('eindpoint/name' in response.url): 
                json_data = await response.json()
                # "resolve the promise"
                myRespPromise.set_result(json_data)

        browser = await p.chromium.launch()
        page = await browser.new_page()
                
        # go to directly to searchpage
        await page.goto("website_url", wait_until='networkidle')
        
        page.on('response', handle_response)
        print("Made call, now await response...")

        await page.fill('input[id=zoeklocatie]', 'search_query')
        
        # Use two enters to first make button visible
        await page.keyboard.press("Enter")
        await page.keyboard.press("Enter")
        
        result_json = await myRespPromise
        print("GOT RESULT:",result_json)

        await page.wait_for_timeout(3000)
        
        await browser.close()
        mainRespPromise.set_result(result_json)

await main()

json_data = await mainRespPromise