[BUG] playwright waitForNavigation problem with firefox [headless, headed] but is working via [firefox-mode-debug, chromium, webkit]

• playwright version: 1.16.3
• operating system: locally-> windows, cicd -> azure
• node version: 15.0.1
• npm version: 7.9.0
• browser: error only in firefox: [headless, headed], no error in firefox --debug, chromium,webkit
• auth tool: keycloak

I can login only via [firefox-mode-debug, chromium, webkit] but not via firefox [headless, headed]:

url: https://dmitrygozman.fieldcode.com/ user: [e-mail] pass: Dgozman123

package.json
{
  "devDependencies": {
    "@playwright/test": "^1.16.3",
    "expect-playwright": "^0.8.0",
    "ua-parser-js": "^1.0.2"
  },
  "dependencies": {
    "playwright": "^1.16.3"
  }
}


just_login_dgozman.spec.js

process.env.baseurl = 'https://dmitrygozman.fieldcode.com/';
const {test, expect} = require('@playwright/test');
const auth_storage_path = 'storage_auth.json';

test('login', async ({page}) => {
  await page.goto(process.env.baseurl);
  const field_username  = '[id="username"]';
  const field_password  = '[id="password"]';
  const button_login    = '[id="fc-login-button"]';
  const value_username  = '[e-mail]';
  const value_password  = 'Dgozman123';

  await page.click(field_username);
  await page.fill(field_username, value_username);
  await page.click(field_password);
  await page.fill(field_password, value_password);

  await Promise.all([
    //page.waitForNavigation({url: process.env.baseurl}),                         //works in:[chromium,webkit, firefox-mode-debug]. Problems in firefox:[headless, headed].
    //page.waitForNavigation({url: process.env.baseurl, waitUntil: "load"}),      //works in:[chromium,webkit, firefox-mode-debug]. Problems in firefox:[headless, headed].
     page.waitForURL(process.env.baseurl),                                    //suggestion from dgozman
     page.click(button_login),
  ]);
  //save auth:
  const myContext = page.context();
  process.env.STORAGE = null;
  const storage = await myContext.storageState({path: auth_storage_path});
  process.env.STORAGE = JSON.stringify(storage);
  JSON.parse(process.env.STORAGE);
});

test.describe("just check login was success", () => {
  test.use({storageState: auth_storage_path});
  test('check_login_success', async ({page}) => {
    await page.goto(process.env.baseurl);
    const button_search = 'button[data-ui-test="ticketPoolSearchButton"]';
    //await page.waitForSelector(button_search);
    await expect(page.locator(button_search)).toBeVisible(); //suggestion from dgozman
  });

});

Same test run with different browsers, works in: chromium, webkit but not if firefox. But it works in firefox debug modus

Console after run with chromium. It works !!! test npx playwright test mydemos/login/just_login.spec.js --browser=chromium

PS C:\workspace\microservice\PlaywrightUiTests> npx playwright test mydemos/login/just_login.spec.js --browser=chromium
Using config at C:\workspace\microservice\PlaywrightUiTests\playwright.config.js
Running 2 tests using 1 worker
  ok [chromium] › mydemos\login\just_login.spec.js:4:1 › login (4s)
  ok [chromium] › mydemos\login\just_login.spec.js:24:3 › just check login was success › check_login_success (3s)
  2 passed (9s)

Console after run with webkit. It works !!! npx playwright test mydemos/login/just_login.spec.js --browser=webkit

PS C:\workspace\microservice\PlaywrightUiTests> npx playwright test mydemos/login/just_login.spec.js --browser=webkit
Using config at C:\workspace\microservice\PlaywrightUiTests\playwright.config.js
Running 2 tests using 1 worker
  ok [webkit] › mydemos\login\just_login.spec.js:4:1 › login (8s)
  ok [webkit] › mydemos\login\just_login.spec.js:24:3 › just check login was success › check_login_success (5s)
  2 passed (15s)

Console after run with firefox. It fails!!! npx playwright test mydemos/login/just_login.spec.js --browser=firefox

PS C:\workspace\microservice\PlaywrightUiTests> npx playwright test mydemos/login/just_login.spec.js --browser=firefox
Using config at C:\workspace\microservice\PlaywrightUiTests\playwright.config.js

Running 2 tests using 1 worker

  x  [firefox] › mydemos\login\just_login.spec.js:4:1 › login (30s)
  ok [firefox] › mydemos\login\just_login.spec.js:24:3 › just check login was success › check_login_success (14s)


  1) [firefox] › mydemos\login\just_login.spec.js:4:1 › login ======================================

    Timeout of 30000ms exceeded.

    page.waitForNavigation: Navigation failed because page was closed!
    =========================== logs ===========================
    waiting for navigation to "/" until "load"
      navigated to "https://mytenat.myweb.com/auth/realms/mytenat/login-actions/authenticate?session_code=..."
      navigated to "https://mytenat.myweb.com/auth/realms/mytenat/login-actions/authenticate?execution=....."
    ============================================================

      15 |   await Promise.all([
      16 |     //page.waitForNavigation({url: '/'}),     //works in:[chromium,webkit, firefox-mode-debug]. Problems in firefox:[headless, headed].                       
    > 17 |     page.waitForNavigation({url: '/', waitUntil: "load"}),  //works in:[chromium,webkit, firefox-mode-debug]. Problems in firefox:[headless, headed].
         |          ^
      18 |     page.click(button_login)
      19 |   ]);
      20 | });

        at C:\workspace\microservice\PlaywrightUiTests\mydemos\login\just_login.spec.js:17:10

  Slow test: [firefox] › mydemos\login\just_login.spec.js (44s)

  1 failed
    [firefox] › mydemos\login\just_login.spec.js:4:1 › login =======================================
  1 passed (51s)

Console after run with firefox --debug. It works!!! npx playwright test mydemos/login/just_login.spec.js --browser=firefox --debug

PS C:\workspace\microservice\PlaywrightUiTests> npx playwright test mydemos/login/just_login.spec.js --browser=firefox --debug
Using config at C:\workspace\microservice\PlaywrightUiTests\playwright.config.js

Running 2 tests using 1 worker

  ok [firefox] › mydemos\login\just_login.spec.js:4:1 › login (26s)
  ok [firefox] › mydemos\login\just_login.spec.js:24:3 › just check login was success › check_login_success (12s)

  Slow test: [firefox] › mydemos\login\just_login.spec.js (38s)

  2 passed (41s)

When I run debug modus and I press play button (instead debug line by line) doesn’t log as well. Looks like the fill the logIn information is too fast in firefox

[aslushnikov]

Looks like Playwright is just too fast at filling in these fields. Not a bug!

[yury-s]

When I run debug modus and I press play button (instead debug line by line) doesn’t log as well. Looks like the fill the logIn information is too fast in firefox

It looks like the login fields appear on the screen, playwright fills in the user name and the DOM tree of the page gets rebuilt before playwright types in the password. Try recording trace, it may give you some insight (though I was not able to reproduce it with tracing on, apparently because it slows down the entire script a bit).