[Bug]: Elements can not be clicked when using emulation

PlanetartRoc commented 3 weeks ago

Version

1.46.0

Steps to reproduce

scripts:

from playwright.sync_api import Playwright, sync_playwright

def run(playwright: Playwright) -> None:
    browser = playwright.chromium.launch(headless=False)
    context = browser.new_context(**playwright.devices["iPhone 14 Pro"])
    page = context.new_page()
    page.goto("https://www.simplytoimpress.com/baptism-invitations/design-105133")
    # ---------------------
    context.close()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)

Expected behavior

Can operate normally

Actual behavior

None of the elements in the red box can be operated The script can not navigate to elements, nor can it click to manually manipulate them

Additional context

In the script-initiated browser window, manually switch to developer mode, and then simulate the mobile page is operational. I do not know whether can be configured to solve with the new_context arguments?

Environment

- Operating System: [windows11]
- CPU: [Inter]
- Browser: [All, Chromium, Firefox, WebKit]
- Python Version: [3.12]
- Other info:

mxschmitt commented 3 weeks ago

Moving upstream since I can repro with npx playwright open --device="Galaxy S8" https://www.simplytoimpress.com/baptism-invitations/design-105133.

PlanetartRoc commented 2 weeks ago

Thank you for your support.

mxschmitt commented 5 days ago

Investigation:

on desktop, they do onclick="die_cut_changed('2', false, 0); displayLightningIcon();" inside the DOM
on mobile, they attach on('touchend', function() { click event listeners via JavaScript
based on the User-Agent the site returns a different version, desktop or mobile
on the mobile version, they don't attach 'click' event handlers
inside our Codegen, we pretend to be a mobile device but never emit touch events, this is why the clicks are noops.
Its blocked by https://github.com/microsoft/playwright/issues/2903

mxschmitt commented 4 days ago

Workaround: We recommend switching to pointerdown/pointerup since touch events are deprecated as per here: https://w3c.github.io/touch-events/#:~:text=license%20rules%20apply.-,Status%20of%20This%20Document,-This%20document%20is

The Community Group considers Touch Events a legacy API – authors are strongly encouraged to adopt Pointer Events instead.

microsoft / playwright