Question 245062 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – expect.toBeVisible is not working when I am running my Playwright test

I have written a script to test a website (https://www.demoblaze.com/), I am trying to validate whether the logout button is visible to the user once the login process is complete.

I am using "expect().toBeVisible()" to check the presence of the logout button, At the run time I am getting an error

Error: Timed out 5000ms waiting for expect(received).toBeVisible()
Call log:
  - expect.toBeVisible with timeout 5000ms
  - waiting for locator('xpath=//a[normalize-space()='Log out']')
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"
  -   locator resolved to <a href="#" id="logout2" class="nav-link" onclick="…>Log out</a>
  -   unexpected value "hidden"

Below is the code I am executing

let { test, expect } = require("@playwright/test");

test("Locator", async ({ page }) => {
  await page.goto("https://www.demoblaze.com/");

  //click on login button using Property element
  await page.locator("#login2").click();


  //username= CSS
  await page.fill("#loginusername", "pavanol");


  //provide password =CSS
  await page.fill("input[id='loginpassword']", "test@123");

  //Click On Login - Xpath
  await page.click("//input[@id='loginpassword']");

  //verify logout button presence xpath
  const logoutLink = await page.locator("//a[normalize-space()='Log out']");
 

  //assertion
  await expect(logoutLink).toBeVisible();
  await page.close;
});
Tags:

2

Answers


  1. 0

    You currently don’t specify a timeout when you call toBeVisible(), and the default in your code is using 5000ms, which is 5 seconds.

    Perhaps it is possible that the page locater is taking longer than 5 seconds to find the logout button.

    One solution you can try; from https://playwright.dev/docs/test-timeouts:

    await expect(logoutLink).toBeVisible(timeout: 10000);

    To increase the timeout to a large enough value that it might be able to pick it up.

    Await can take a really long time especially looking for elements so I think this would be a good first step.

    Login or Signup to reply.
  2. 0

    There is not element with #logout2 locator

    import { test, expect } from "@playwright/test";

test("Locator", async ({ page }) => {
  await page.goto("https://www.demoblaze.com/");
  await page.getByRole("link", { name: "Log in" }).click();

  await page.locator("#loginusername").fill("pavanol");
  await page.locator("#loginpassword").fill("test@123");
  await page.getByRole("button", { name: "Log in" }).click();

  const logoutLink = page.getByRole("link", { name: "Log out" });
  await expect(logoutLink, "LogOut LInk doens't exist").toBeVisible({ timeout: 15_000 });
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search