[BUG] Fill throws "Element is not visible" despite waiting for visibility

[arjunattam]

Context:

• Playwright Version: 0.11.1-next.1584693909176
• Operating System: Mac

page.fill throws Error: Element is not visible for an element that was ensured to be visible with waitForSelector({ waitFor: 'visible' }). Adding a waitFor(1000) before filling fixes the issue.

Code Snippet

const pw = require('playwright');

(async () => {
    const browser = await pw.chromium.launch({ headless: false });
    const context = await browser.newContext();
    const page = await context.newPage();

    await page.goto('https://outlook.com');
    await page.click('a[data-task="signin"]');

    await page.waitForSelector('input[type="email"]');
    await page.fill('input[type="email"]', 'vsls-bot@outlook.com');
    await page.click('input[type="submit"]');

    await page.waitForSelector('input[type="password"]', { waitFor: "visible" });
    // await page.waitFor(1000); (this fixes the issue, but ideally should not be required)
    await page.fill('input[type="password"]', 'test');
    await browser.close();
})();

Stack trace

➜  pw-example node example1.js
Debugger listening on ws://127.0.0.1:50649/f195a4c1-45cc-47ba-88b3-9a37482b02c7
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
(node:40779) UnhandledPromiseRejectionWarning: Error: Element is not visible
    at _page._frameManager.waitForNavigationsCreatedBy (/Users/arjun/pw-example/node_modules/playwright-core/lib/dom.js:245:23)
  -- ASYNC --
    at ElementHandle.<anonymous> (/Users/arjun/pw-example/node_modules/playwright-core/lib/helper.js:63:23)
    at Frame.fill (/Users/arjun/pw-example/node_modules/playwright-core/lib/frames.js:576:22)
  -- ASYNC --
    at Frame.<anonymous> (/Users/arjun/pw-example/node_modules/playwright-core/lib/helper.js:63:23)
    at Page.fill (/Users/arjun/pw-example/node_modules/playwright-core/lib/page.js:308:33)
    at Page.<anonymous> (/Users/arjun/pw-example/node_modules/playwright-core/lib/helper.js:84:31)
    at /Users/arjun/pw-example/example1.js:30:16
(node:40779) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:40779) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.