Rayrun
BlogAsk AIToolsVideosQA WikiDiscord
← Back to Discord Forum

Parallelism causes fill() to attach to wrong locator

Browser AutomationCode GenerationComponent TestingContinuous IntegrationCypressEnd-to-End TestingPage Object ModelTest PerformanceReliabilityUnit TestingVisual Regression Testing
georgie0001posted in #help-playwright
Open in Discord
georgie0001
georgie0001

In my setup file I have multiple tasks that run through our login UI and saves the session state for reuse in later tests. When fullyParallelized is set to false, these setup tasks wrong without issue. If I turn on fullyParallelized, 3 out of 5 times, one or more of the setup tasks will fail. The failure seems to be in the fill() function. Watching the trace or in UI mode, the locator is appropriately highlighted but in the next frame, the text has been filled in the wrong spot. Help?

await page.goto(process.env.UITestEnvironment);
        await page.getByPlaceholder('Username', { exact: true }).fill(process.env.usernameAdmin1);
        await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordAdmin1);
        await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId);
        await page.getByRole('link', { name: 'Sign In' }).click();
        //waiting for next page to load
        await page.waitForLoadState('networkidle');

        //sending to dashboard to save state
        await page.waitForLoadState('networkidle')
        await page.goto(process.env.UITestEnvironment);
        await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard);
        await page.context().storageState({ path: process.env.admin1Login });
    }); ```
image.png
image.png

This thread is trying to answer question "Why does the fill() function fail and fill text in the wrong spot when fullyParallelized is set to true?"

7 replies
dand33

While you show some code, can't tell the overall structure for your app, setup, this global and and shared? My guess what you are getting is expected as you have 'n' thread all accessing shared data without any regards to anything...

hubspace
hubspace

Is process.env.UITestEnvironment always defined? process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard indicates that you expect the env variable to be undefined in some cases

hubspace
hubspace

then the first goto would goto(undefined) ?

georgie0001
georgie0001
@hubspace: Yes they are always defined.

Yes they are always defined.

georgie0001
georgie0001
@dand33: I mean the entire setup project is literally the same. When I run it fully parallelized, I get 3 workers, each running one of these commands once, as expected. ``` import { test as setup } from '@playwright/test'; import * as dotenv from 'dotenv' dotenv.config() setup.describe('User Session Capture', () => { setup('authenticate as site director', async ({ page }) => { //login as site director await page.goto(process.env.UITestEnvironment); await page.getByPlaceholder('Username', { exact: true }).fill(process.env.userNameSiteDir); await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordSiteDir); await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId); await page.getByRole('link', { name: 'Sign In' }).click(); //waiting for next page to load await page.waitForLoadState('networkidle'); //sending to dashboard to save state await page.waitForLoadState('networkidle') await page.goto(process.env.UITestEnvironment); await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard); await page.context().storageState({ path: process.env.siteDirectorLogin }); }); setup('authenticate as admin', async ({ page }) => { await page.goto(process.env.UITestEnvironment); await page.getByPlaceholder('Username', { exact: true }).fill(process.env.usernameAdmin1); await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordAdmin1); await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId); await page.getByRole('link', { name: 'Sign In' }).click(); //waiting for next page to load await page.waitForLoadState('networkidle'); //sending to dashboard to save state await page.waitForLoadState('networkidle') await page.goto(process.env.UITestEnvironment); await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard); await page.context().storageState({ path: process.env.admin1Login }); }); setup('authenticate as enduser', async ({ page }) => { await page.goto(process.env.UITestEnvironment); await page.getByPlaceholder('Username', { exact: true }).fill(process.env.usernameEndUser1); await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordEndUser1); await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId); await page.getByRole('link', { name: 'Sign In' }).click(); //waiting for next page to load await page.waitForLoadState('networkidle'); //sending to dashboard to save state await page.waitForLoadState('networkidle') await page.goto(process.env.UITestEnvironment); await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard); await page.context().storageState({ path: process.env.eu1Login }); }) });```

I mean the entire setup project is literally the same. When I run it fully parallelized, I get 3 workers, each running one of these commands once, as expected.

import { test as setup } from '@playwright/test';
import * as dotenv from 'dotenv'
dotenv.config()

setup.describe('User Session Capture', () => {

    setup('authenticate as site director', async ({ page }) => {
        //login as site director
        await page.goto(process.env.UITestEnvironment);
        await page.getByPlaceholder('Username', { exact: true }).fill(process.env.userNameSiteDir);
        await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordSiteDir);
        await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId);
        await page.getByRole('link', { name: 'Sign In' }).click();
        //waiting for next page to load
        await page.waitForLoadState('networkidle');

        //sending to dashboard to save state
        await page.waitForLoadState('networkidle')
        await page.goto(process.env.UITestEnvironment);
        await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard);
        await page.context().storageState({ path: process.env.siteDirectorLogin });
    });

    setup('authenticate as admin', async ({ page }) => {
        await page.goto(process.env.UITestEnvironment);
        await page.getByPlaceholder('Username', { exact: true }).fill(process.env.usernameAdmin1);
        await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordAdmin1);
        await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId);
        await page.getByRole('link', { name: 'Sign In' }).click();
        //waiting for next page to load
        await page.waitForLoadState('networkidle');

        //sending to dashboard to save state
        await page.waitForLoadState('networkidle')
        await page.goto(process.env.UITestEnvironment);
        await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard);
        await page.context().storageState({ path: process.env.admin1Login });
    });

    setup('authenticate as enduser', async ({ page }) => {
        await page.goto(process.env.UITestEnvironment);
        await page.getByPlaceholder('Username', { exact: true }).fill(process.env.usernameEndUser1);
        await page.getByPlaceholder('Password', { exact: true }).fill(process.env.passwordEndUser1);
        await page.getByPlaceholder('Company Number', { exact: true }).fill(process.env.companyId);
        await page.getByRole('link', { name: 'Sign In' }).click();
        //waiting for next page to load
        await page.waitForLoadState('networkidle');

        //sending to dashboard to save state
        await page.waitForLoadState('networkidle')
        await page.goto(process.env.UITestEnvironment);
        await page.waitForURL(process.env.UITestEnvironment || process.env.UITestEnvironmentDashboard);
        await page.context().storageState({ path: process.env.eu1Login });
    })
});```
hubspace
hubspace

What follows is just a wild assumption of me, not knowing how your app operates. Could it be the case, that the page when filling the username initially hasn't finished loading. And after switching to fill the password there is something js like on the page that switches the active focused input to be username?

georgie0001
georgie0001

Oh, thats actually a good idea

Open in Discord

Related Discord Threads

BlogAsk AIToolsVideosQA WikiDiscord
TwitterGitHubLinkedIn
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.