[BUG] subtree intercepts pointer events

[apapkevich]

Context:

• Playwright Version: 1.4.0
• Operating System: Windows 10
• Node.js version: 12.16.1
• Browser: WebKit

Code Snippet

import {chromium, webkit, firefox} from "playwright";

(async () => {
    for (const browserType of [chromium, firefox, webkit]) {
        const browser = await browserType.launch({ headless: false });
        const context = await browser.newContext();
        const page = await context.newPage();

        await page.goto("https://github.com");
        await page.fill('input[aria-label="Search GitHub"]', "Playwright");
        await page.press('input[aria-label="Search GitHub"]', "Enter");

        await page.click(".repo-list-item:nth-child(1) a");
        await page.click('span[data-content="Security"]');
        await page.screenshot({path: `screenshots/security-${browserType.name()}.png`, fullPage: false});

        await page.close();
        await browser.close();
    }
})();

Describe the bug

This code is working fine with chromium and firefox. However, when I use Webkit it breaks on the second screen. I tried to clean install the node_modules and use Node.js v12.14.1 and v14.10.1, but it has no effect. Error logs:

Error.captureStackTrace(stackObject);
             ^
page.click: Protocol error (Runtime.awaitPromise): The page has been closed.
=========================== logs ===========================
waiting for selector ".repo-list-item:nth-child(1) a"
  selector resolved to visible <a class="v-align-middle" href="/microsoft/playwrig…>…</a>
attempting click action
  waiting for element to be visible, enabled and not moving
    element is moving - waiting...
  element is visible, enabled and does not move
  scrolling into view if needed
  done scrolling
  checking that element receives pointer events at (468,222)
  <div class="mr-3">↵            Apache-2.0 license↵          </div> from <div>…</div> subtree intercepts pointer events
retrying click action
  waiting for element to be visible, enabled and not moving
    element is moving - waiting...
  element is visible, enabled and does not move
  scrolling into view if needed
  done scrolling
  checking that element receives pointer events at (468,222)
  <div class="mr-3">↵            Apache-2.0 license↵          </div> from <div>…</div> subtree intercepts pointer events
retrying click action

[apapkevich]

This question on StackOverflow.

[yury-s]

I tried the snippet on my Windows 10 machine and it passed 30 iterations in each browser just fine. I wonder what may be different between our setups.

[pavelfeldman]

Same here, works for me on 1.4.1.

[apapkevich]

My colleague also has no problem with this script. It seems to me that I have a problem with my laptop. What should I look at and how to try to solve it?

[dgozman]

Sorry, no real ideas. Perhaps you have a different version of the page locally? Any proxy that intercepts stuff? Try comparing network resources as shown in Developer Tools between the broken version and the working one?

Please comment/reopen if we can help with anything else.

[fujii]

FWIW, I got a different error for your script on my env (Playwright 1.4.2/Windows 10 ver.1903).

(node:34520) UnhandledPromiseRejectionWarning: page.goto: Timeout 30000ms exceeded.

Filed in WebKit bugzilla.

Bug 217158 – [WinCairo] Never finish loading https://github.com/
https://bugs.webkit.org/show_bug.cgi?id=217158