Migrate complete-security.spec.ts from Cypress to Playwright (#11952)

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

playwright/element-web-test.ts

@@ -50,6 +50,10 @@ export type TestOptions = {
     cryptoBackend: "legacy" | "rust";
 };
 
+interface CredentialsWithDisplayName extends Credentials {
+    displayName: string;
+}
+
 export const test = base.extend<
     TestOptions & {
         axe: AxeBuilder;
@@ -60,7 +64,8 @@ export const test = base.extend<
         startHomeserverOpts: StartHomeserverOpts | string;
         homeserver: HomeserverInstance;
         oAuthServer: { port: number };
-        user: Credentials;
+        credentials: CredentialsWithDisplayName;
+        user: CredentialsWithDisplayName;
         displayName?: string;
         app: ElementAppPage;
         mailhog?: { api: mailhog.API; instance: Instance };
@@ -120,7 +125,7 @@ export const test = base.extend<
     },
 
     displayName: undefined,
-    user: async ({ page, homeserver, displayName: testDisplayName }, use) => {
+    credentials: async ({ homeserver, displayName: testDisplayName }, use) => {
         const names = ["Alice", "Bob", "Charlie", "Daniel", "Eve", "Frank", "Grace", "Hannah", "Isaac", "Judy"];
         const username = _.uniqueId("user_");
         const password = _.uniqueId("password_");
@@ -129,6 +134,12 @@ export const test = base.extend<
         const credentials = await homeserver.registerUser(username, password, displayName);
         console.log(`Registered test user ${username} with displayname ${displayName}`);
 
+        await use({
+            ...credentials,
+            displayName,
+        });
+    },
+    user: async ({ page, homeserver, credentials }, use) => {
         await page.addInitScript(
             ({ baseUrl, credentials }) => {
                 // Seed the localStorage with the required credentials