[QUESTION] context storageState reopen page

[Maciejjy]

Hello.

I am trying to deal with saving authentication state between my tests. I am going with approach where I have beforeAll hook where I log in to application, then save the state with context().storageState():

BeforeAll(async function () {
global.browser = await chromium.launch({
        headless: false,
    });
    global.page = await global.browser.newPage();
    await page.goto('https://mypage.com');
    ***some authentication steps ***
    await page.context().storageState({ path: 'storageState.json' });
    page.close();
});

after this action storageState.json file has this structure (no auth info that's fine):

{
  "cookies": [],
  "origins": [
    {
      "origin": "https://mypage.com",
      "localStorage": [
        {
          "name": "signedOut",
          "value": "false"
        }
      ]
    }
  ]
}

next I use "Before" hook to set up each test:

Before(async function (scenario) {
    global.context = await global.browser.newContext({
        storageState: 'storageState.json'
    });

    global.page = await global.context.newPage();
    await page.goto('https://mypage.com');
});

and then I start my test cases.

The issue is that for each test, there is additional page that open for url in storageState.json file so for the user it looks like this:

• one page opens (this is because of using storageState file)
• redirection to mypage.com (this is because of 'origin' in storageState)
• page close
• page open again (this is because of newPage() in Before)
• redirection to mypage.com (this is from 'Before' goto step)
• test proceed

I think first 3 steps should not happen.

I did some research and if I remove value from origin parameter then this first page will not open and everything is fine. Also if I remove storageState: 'storageState.json' from 'Before' then this issue is gone but I need this state in context for each test.

I think the similar issue was here but no answers were given:

https://stackoverflow.com/questions/70878170/playwright-browsercontext-storagestate-opens-all-visited-tabs

[aslushnikov]

I think first 3 steps should not happen.

@Maciejjy This is how it is implemented today in Playwright, so it works as intended. Does it bother you?

[Maciejjy]

I think first 3 steps should not happen.

@Maciejjy This is how it is implemented today in Playwright, so it works as intended. Does it bother you?

Yes it does. Why to go through these 3 steps in mentioned scenario for every test case? What is the value of opening and almost immediately closing page before each test? It is waste of time to open additional page only because there is storage file I use for keeping my auth state. Also imagine you have video recording for each test case. Then in tests result you will get 2 files for each test case. One with video recording from opening/closin page and another one for actual test case. Probably you can avoid that with some code but the issue is there.

Thank you for quick answer.

[ltsuda]

does this section reduce some steps?

https://playwright.dev/docs/test-auth#reuse-signed-in-state

I don't know if you can have a globalSetup for only a few tests (if you need) but this will only do the setup/save storageState one time and using the provided page fixture you will the page already be authenticated. And I think video are not recorded for globalSetup (I'm not sure), so no additional video file.

Also, as said in the Note in the same section, if can save the storageState in your repository, you won't need the globalSetup at all, just put it in Playwright's config file.

[evozniak]

I'm using cucumber.js and trying to reuse the authentication saving the storageState. The video issue is really a problem for me, there is one garbage 2 kb video file for each scenario.

Not sure why this is the default behavior, can I configure that using a different test runner?

[Maciejjy]

I'll let myself bump this question because @evozniak this is exactly the reason why I dropped whole idea of saving my auth state between tests. I also received duplicate "ghost" video recording files. Right now I don't have many tests in my test set so it's fine but in future I would really like to save time and reuse authentication state. I think current sholution should be improved.

[mweidner037]

I ran into this issue as well; here is a minimal reproduction: https://github.com/mweidner037/playwright-test-mwe-newContext-page

Basically, calling browser.newContext({storageState: ...}) where the storageState file has an origin entry, causes a blank page to appear briefly. This is especially noticeable in tests where I create a bunch of contexts reusing storageState auth state - a blank page appears briefly for each one. (Multiple contexts also precludes using the page fixture to work around this.)

It is not a deal breaker but somewhat annoying.

[fastmx]

I fell in this trap as well - our app does redirect when user is logged in on / to /list URL (Browser side). As a result wrong page is displayed because js execute asynchronously after "goto" call.

I agree with @Maciejjy and believe it shouldn't work this way as that makes testing less predictable and what is more important - it does not reflect how real user is receiving requests

@mweidner037 as a workaround you can try to parse storageState file after it's created (eg in globalSetup) - at least this is what I did.

[pavelfeldman]

Why was this issue closed?

Thank you for your involvement. This issue was closed due to limited engagement (upvotes/activity), lack of recent activity, and insufficient actionability. To maintain a manageable database, we prioritize issues based on these factors.

If you disagree with this closure, please open a new issue and reference this one. More support or clarity on its necessity may prompt a review. Your understanding and cooperation are appreciated.