[Feature]: Merge multiple storage states

[tobz1000]

🚀 Feature Request

It would be helpful if we could easily combine/merge multiple storage states in an arbitrary way. This could be done by allowing both the storageState fixture, and browser.newContext({ storageStage: ... }), to accept an array of state values, which are then logically merged into a single storage state object.

Example

test.use({ storageState: ["auth1.json", "auth2.json", "auth3.json"] });

const context = await browser.newContext({ storageState: ["auth1.json", "auth2.json", "auth3.json"] });

Or mixing literal objects with files:

const context = await browser.newContext(
  "auth1.json",
  {
    storageState: {
      cookies: [],
      origins: [
        {
          origin: "https://foo.com",
          localStorage: [
            {
              name: "bar",
              value: "baz",
            },
          ],
        },
      ],
    },
  },
  "auth3.json"
);

In the case of conflicting values, the last object arg containing a conflicting item would take precedence, similar to Object.assign.

Motivation

A similar proposal has been previously discussed and dismissed: #17744

The solution there was to create different storage state files at different levels of authentication. However, in my use case, this is infeasible, as I need to create many combinations of different storage items, comprising authentication for multiple different domains, and individual site settings which may be toggled on and off differently for each test case. This would mean a combinatorial explosion of required setup runs to generate the authX.json files.

Currently my solution is a combination of:

1. In a setup script, perform the first login and save as authA.json. then perform the second login, save as authA+B.json, etc.
2. At the start of the test, set config values manually in localstorage, e.g.:

await page.addInitScript(() => {
  if (document.location.host === 'foo.com') {
    localStorage.setItem('bar', 'baz');
  }
});

This is somewhat cumbersome, and doesn't fully solve the issue of combining logins arbitrarily in an efficient way.

I believe the actual logic for merging multiple StorageState objects is fairly trivial (in fact I've already written it), but would prefer not to maintain this code & required unit tests within my own project.