playwright

All Playwright tests passed except for one


I have several tests in my Todos.spec.ts file. All tests are running fine. However, the test below fails when it runs the test below.

test("Unstarred todos should have grey stars.",async({page})=>{
    await loginViaUI(page, process.env.EMAIL_ADDRESS as string , process.env.PASSWORD_1 as string);
    await page.waitForURL("http://localhost:8788/Projects/");
    await page.getByRole("link",{name:"Science"}).click();

    
    const starButtonOfFirstTodo = page.locator('li').filter({ hasText: 'Do homework.Click' }).getByLabel('Click to star this todo.')

    const starButtonOfSecondTodo = page.locator('li').filter({ hasText: 'Do homeworkDo for 3 hours.Click' }).getByLabel('Click to star this todo.')

    //Both todos should be unstarred, so their stars should be grey in color.
    expect(starButtonOfFirstTodo).toHaveCSS("background-color","grey");
    expect(starButtonOfSecondTodo).toHaveCSS("background-color","grey");

});

//Code for loginViaUI
export async function loginViaUI(page:Page, email:string, password:string){
    console.log("Logging in via UI");
    
    await page.goto("/Login");
    await page.getByLabel('Email').click();
    await page.getByLabel('Email').fill(email);
    await page.getByLabel('Email').press('Tab');
    await page.getByLabel('Password', { exact: true }).fill(password);
    await page.getByLabel('Password', { exact: true }).press('Tab');

    await page.getByRole('button', { name: 'Login' }).click({delay:250})
}


All the tests in Todos.spec.ts were run in UI mode.

I checked the Locator, Source, Call, Log, Errors, Console, Network, Attachments, Annotations tab for the above test when I ran the test above in UI mode for Chromium browser and Firefox browser and saw no output.

How can I solve this issue?


Solution

  • Ok, so I've solved the issue.

    I toggled the output tab and saw that there were some errors in the output tab and solved the issue by solving the errors in the output tab.

    The first error message that I saw was that it says something like expected 'grey' but recieved 'rgb(128, 128, 128)' so I just changed my colors in the test from 'grey' to 'rgb(128, 128, 128)' since rgb(128, 128, 128) is also grey basically.

    The second error message that I saw was that it couldn't find the second element, so I just changed it's locator to the correct one.