← Back to Discord Forum

Navigation to "../login" is interrupted by another navigation

legendary_fox_87765posted in #help-playwright
Open in Discord

Hi all,

Just getting started with Playwright and am running into the error mentioned in the title.

I suspect that this is happening because in our beforeEach section for we login to the application for every test. So there are a lot of calls going to /login.

Important to note that when I run the tests with --ui and then individually re-run the tests that failed with this error then they are fine, which reinforces my thought that there is a race condition being introduced in the beforeEach section

Is this an anti-pattern - or is there something else going on here that I don't fully understand yet? I don't really see much information about this out in the wild...

This thread is trying to answer question "Why is navigation to '/login' being interrupted by another navigation in Playwright, and how can this issue be resolved?"

5 replies

Hi. Do you 'await' the login navigation to finish? Would need to see some code. Have you tried to lint your code, to check for some basic errors like missing awaits?



This is the before section

test.beforeEach(async ({ page }) => {
  const loginPage = new LoginPage(page);
  await page.goto(environment.url);
  const user = environment.users[0];
  await loginPage.login(user, environment);
  await page.waitForSelector('my-app');
  await expect(page, 'Successful login').toHaveTitle(/Application/);

and the Login page looks as follows

export class LoginPage extends AbstractSection {
  protected readonly page: Page;

  constructor(page: Page) {
    this.page = page;

  public async login(user: User, environment: Environment) {
    await this.page.goto(environment.loginUrl);
    if (this.isProd(environment)) {
      await this.loginProd(user);
    } else {
      await this.loginLocal(user);

  private isProd(environment: Environment) {
    return environment.name !== 'LOCAL';

  private async loginProd(user: User) {
    await this.fillField('#username', user.name);
    await this.clickElement('#submitInputImmNameId');
    await this.fillField('#inputPassName', user.pwd);
    await this.clickElement('#submitInputAutId');

  private async loginLocal(user: User) {
    await this.fillField('#username', user.name);
    await this.fillField('#password', user.pwd);
    await this.clickElement('#submitInputImmNameId');

  private async fillField(selector: string, value: string) {
    const userNameInput: ElementHandle = await this.page.waitForSelector(selector);
    await userNameInput.focus();
    await userNameInput.fill(value);

  private async clickElement(selector: string) {
    const nextButton: ElementHandle = await this.page.waitForSelector(selector);
    await nextButton.click();


I've done standard linting, but not playwright specific linting - maybe that's something I need to look into...


Just had a rubber duck moment   🦆

the await page.goto(environment.url); call wasn't doing anything and by removing it the problem seems to resolve itself


so thanks for making me think 😅

Related Discord Threads

AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.