New accounts per browser-country combination

I want to add a test for the onboarding flow. However, the
functional tests used to create a new account per country, while
re-using those accounts in every browser. This meant that as the
onboarding test ran in one browser first, the other browsers would
fail because that account would no longer be onboarded.

With this change, the tests create a new account for every country
*and* browser combination.

Author: Vinnl

functional-tests/README.md

@@ -48,7 +48,7 @@ Before running the tests the `global-setup` script:
 
 - Fetches feature flags from `/api/v1/admin/feature-flags` and saves them to `./functional-test-cache/enabled-feature-flags.json`
 - Signs up a unique test user account per country
-- Stores the login state per user in `./functional-test-cache/user-session-<country>.json`
+- Stores the login state per user in `./functional-test-cache/user-session-<browser+location>.json`
 - Stores the emails per user in `./functional-test-cache/user-emails.json`
 
 ## Artifacts

functional-tests/fixtures/authenticatedTest.ts

@@ -15,12 +15,14 @@ const test = baseTest.extend<object, { storageState?: string }>({
         return;
       }
 
-      const storagePath = getTestUserSessionFilePath(countryCode);
+      const storagePath = getTestUserSessionFilePath(testInfo.project.name);
       const exists = fs.existsSync(storagePath);
       if (exists) {
         await use(storagePath);
       } else {
-        console.warn(`No user session file found for [${countryCode}]`);
+        console.warn(
+          `No user session file found for [${testInfo.project.name}]`,
+        );
         await use(undefined);
       }
     },

functional-tests/playwright.config.ts

@@ -97,25 +97,28 @@ export const getEnabledFeatureFlags = () => {
   return enabledFeatureFlags;
 };
 
-const projects: Project[] = locations.flatMap((geo) =>
-  baseDevices.map((base) => ({
-    name: `${base.name} (${geo.name})`,
-    use: {
-      ...base.use,
-      countryCode: geo.name.toLowerCase(),
-      geolocation: geo.geolocation,
-      locale: geo.locale,
-      permissions: ["geolocation"],
-      enabledFeatureFlags: getEnabledFeatureFlags(),
-      extraHTTPHeaders: {
-        "Accept-Language": `${geo.locale},${geo.name.toLowerCase()};q=1.0`,
-        "X-Client-Region": geo.name.toLowerCase(),
-        "x-forced-client-region-token": createTestClientRegionToken(
-          geo.name.toLowerCase(),
-        ),
-      },
-    },
-  })),
+export const projects = locations.flatMap((geo) =>
+  baseDevices.map(
+    (base) =>
+      ({
+        name: `${base.name} (${geo.name})`,
+        use: {
+          ...base.use,
+          countryCode: geo.name.toLowerCase(),
+          geolocation: geo.geolocation,
+          locale: geo.locale,
+          permissions: ["geolocation"],
+          enabledFeatureFlags: getEnabledFeatureFlags(),
+          extraHTTPHeaders: {
+            "Accept-Language": `${geo.locale},${geo.name.toLowerCase()};q=1.0`,
+            "X-Client-Region": geo.name.toLowerCase(),
+            "x-forced-client-region-token": createTestClientRegionToken(
+              geo.name.toLowerCase(),
+            ),
+          },
+        },
+      }) as const satisfies Project,
+  ),
 );
 
 export default defineConfig({
@@ -163,10 +166,13 @@ export default defineConfig({
       testMatch: /global\-setup/,
       teardown: "global-teardown",
     },
-    ...projects.map((project) => ({
-      ...project,
-      dependencies: ["global-setup"],
-    })),
+    ...projects.map(
+      (project) =>
+        ({
+          ...project,
+          dependencies: ["global-setup"],
+        }) as Project,
+    ),
     {
       name: "global-teardown",
       testMatch: /global\-teardown/,

functional-tests/tests/auth.spec.ts

@@ -22,9 +22,7 @@ test.describe(`Verify authentication [${process.env.E2E_TEST_ENV}]`, () => {
       countryCode: testInfo.project.use.countryCode,
       isMobile: testInfo.project.use.isMobile,
     });
-    const userEmail = getTestUserEmailByCountryCode(
-      testInfo.project.use.countryCode,
-    );
+    const userEmail = getTestUserEmailByCountryCode(testInfo.project);
     await signInUser(
       page,
       userEmail,

functional-tests/tests/global-setup.ts

@@ -11,7 +11,8 @@ import {
   getBaseTestEnvUrl,
 } from "../utils/environment";
 import { goToFxA, signUpUser } from "../utils/fxa";
-import { locations } from "../playwright.config";
+import { getTestUserSessionFilePath } from "../utils/user";
+import { projects } from "../playwright.config";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -41,22 +42,22 @@ async function setupFeatureFlags() {
 async function setupUserAccount(browser: Browser) {
   const emails: Record<string, string> = {};
 
-  for (const location of locations) {
-    const countryCode = location.name.toLowerCase();
+  for (const project of projects) {
+    const projectName = project.name!;
     const context = await browser.newContext({
-      geolocation: location.geolocation,
-      locale: location.locale,
+      geolocation: project.use.geolocation,
+      locale: project.use.locale,
       permissions: ["geolocation"],
     });
     const page = await context.newPage();
 
     // Sign up flow
     const timestamp = Date.now();
-    const email = `${process.env.E2E_TEST_ACCOUNT_BASE_EMAIL}_${countryCode}_${timestamp}@restmail.net`;
-    emails[countryCode] = email;
+    const email = `${process.env.E2E_TEST_ACCOUNT_BASE_EMAIL}_${projectName.toLowerCase().replaceAll(" ", "-").replaceAll("(", "").replaceAll(")", "")}_${timestamp}@restmail.net`;
+    emails[projectName] = email;
 
     await goToFxA(page, {
-      countryCode,
+      countryCode: project.use.countryCode,
       isMobile: false,
     });
     await signUpUser(
@@ -69,11 +70,9 @@ async function setupUserAccount(browser: Browser) {
     await page.waitForURL("**/user/**");
 
     // Store test user session
+    const storageStatePath = getTestUserSessionFilePath(project.name);
     await context.storageState({
-      path: path.resolve(
-        __dirname,
-        `./functional-test-cache/user-session-${countryCode}.json`,
-      ),
+      path: storageStatePath,
     });
 
     await context.close();

functional-tests/tests/global-teardown.ts

@@ -7,8 +7,9 @@ import fs from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
 import { test as teardown } from "../fixtures/authenticatedTest";
-import { getTestUserEmails, getTestUserSessionFilePath } from "../utils/user";
+import { getTestUserSessionFilePath } from "../utils/user";
 import { getBaseTestEnvUrl } from "../utils/environment";
+import { projects } from "../playwright.config";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -22,10 +23,8 @@ function removeTestStorage() {
 }
 
 async function deleteTestUserAccounts(browser: Browser) {
-  const userEmails = getTestUserEmails();
-
-  for (const userCountryCode in userEmails) {
-    const storageState = getTestUserSessionFilePath(userCountryCode);
+  for (const project of projects) {
+    const storageState = getTestUserSessionFilePath(project.name);
     const context = await browser.newContext({ storageState });
     const page = await context.newPage();
 

functional-tests/utils/user.ts

@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import { Page, request } from "@playwright/test";
+import { FullProject, Page, request } from "@playwright/test";
 import fs from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
@@ -74,25 +74,21 @@ export function getTestUserEmails(): Record<string, string> {
   return emails;
 }
 
-export function getTestUserEmailByCountryCode(countryCode?: string): string {
+export function getTestUserEmailByCountryCode(project: FullProject): string {
   const emails = getTestUserEmails();
-  const email = emails[countryCode ?? "us"];
+  const email = emails[project.name];
   if (!email) {
-    throw new Error(`No email found for [${countryCode}]`);
+    throw new Error(`No email found for [${project.name}]`);
   }
 
   return email;
 }
 
-export function getTestUserSessionFilePath(countryCode: string) {
+export function getTestUserSessionFilePath(projectName: string) {
   const storagePath = path.resolve(
     __dirname,
-    `../functional-test-cache/user-session-${countryCode}.json`,
+    `../functional-test-cache/user-session-${projectName.toLowerCase().replaceAll(" ", "-").replaceAll("(", "").replaceAll(")", "")}.json`,
   );
 
-  if (!fs.existsSync(storagePath)) {
-    throw new Error("User session storage not found");
-  }
-
   return storagePath;
 }