Migrate email.spec.ts from Cypress to Playwright (#11920)

Co-authored-by: R Midhun Suresh <hi@midhun.dev>

playwright/element-web-test.ts

@@ -14,12 +14,16 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { test as base } from "@playwright/test";
+import { test as base, expect } from "@playwright/test";
+import AxeBuilder from "@axe-core/playwright";
 
+import type mailhog from "mailhog";
+import type { IConfigOptions } from "../src/IConfigOptions";
 import { HomeserverInstance, StartHomeserverOpts } from "./plugins/utils/homeserver";
 import { Synapse } from "./plugins/synapse";
+import { Instance } from "./plugins/mailhog";
 
-const CONFIG_JSON = {
+const CONFIG_JSON: Partial<IConfigOptions> = {
     // This is deliberately quite a minimal config.json, so that we can test that the default settings
     // actually work.
     //
@@ -41,9 +45,12 @@ export type TestOptions = {
 
 export const test = base.extend<
     TestOptions & {
+        axe: AxeBuilder;
+        checkA11y: () => Promise<void>;
         config: typeof CONFIG_JSON;
         startHomeserverOpts: StartHomeserverOpts | string;
         homeserver: HomeserverInstance;
+        mailhog?: { api: mailhog.API; instance: Instance };
     }
 >({
     crypto: ["legacy", { option: true }],
@@ -72,6 +79,21 @@ export const test = base.extend<
         await use(await server.start(opts));
         await server.stop();
     },
+
+    axe: async ({ page }, use) => {
+        await use(new AxeBuilder({ page }));
+    },
+    checkA11y: async ({ axe }, use, testInfo) =>
+        use(async () => {
+            const results = await axe.analyze();
+
+            await testInfo.attach("accessibility-scan-results", {
+                body: JSON.stringify(results, null, 2),
+                contentType: "application/json",
+            });
+
+            expect(results.violations).toEqual([]);
+        }),
 });
 
 test.use({});