[playwright] feat: Add registration test

playwright/package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "install": "playwright install-deps chromium",
     "test": "playwright test",
-    "test:production": "export URL=https://notes-app-full-stack-bjml.onrender.com && playwright test",
+    "test:production": "export URL=https://notes-app-full-stack-bjml.onrender.com && playwright test --grep @PRODUCTION",
     "lint": "eslint . --ext .ts",
     "lint:fix": "eslint . --ext .ts --fix",
     "lint:ci": "eslint . --ext .ts --format @microsoft/eslint-formatter-sarif --output-file eslint-results.sarif"

playwright/tests/note.spec.ts

@@ -17,13 +17,13 @@ test.beforeAll(async ({ browser }, { timeout }) => {
   await page.goto('/', { timeout });
 });
 
-test('Notes App e2e flow', async () => {
+test('Notes App e2e flow', { tag: ['@PRODUCTION'] }, async () => {
   await test.step('Should be able to login with valid user credentials', async () => {
     await expect(page.getByPlaceholder('Username')).toBeVisible();
     await expect(page.getByPlaceholder('Password')).toBeVisible();
 
-    await page.fill('[data-testid=username]', 'Test User');
-    await page.fill('[data-testid=password]', 'n0te$App!23');
+    await page.fill('[data-testid=username]', 'dave');
+    await page.fill('[data-testid=password]', 'test');
 
     /** Free tier on render.com may take 60 seconds to startup */
     notesApi = page.waitForResponse(

playwright/tests/registration.spec.ts

@@ -0,0 +1,31 @@
+import { test, expect, Page } from '@playwright/test';
+
+let page: Page;
+const timeout = 60 * 1000;
+const TIMESTAMP = Date.now();
+
+test.beforeAll(async ({ browser }, { timeout }) => {
+  page = await browser.newPage();
+  await page.goto('/', { timeout });
+});
+
+test('User Registration', async () => {
+  await page.getByRole('link', { name: 'Sign up' }).click();
+
+  await expect(
+    page.getByRole('heading', { name: 'Register new account' })
+  ).toBeVisible();
+
+  await page.fill('input[name="username"]', `user${TIMESTAMP}`);
+  await page.fill('input[name="email"]', `user${TIMESTAMP}@mail.com`);
+  await page.fill('input[name="password"]', 'auto');
+  await page.fill('input[name="confirmPassword"]', 'auto');
+
+  await page.getByRole('button', { name: 'Register' }).click();
+
+  /** Free tier on render.com may take 60 seconds to startup */
+
+  await expect(page.getByText('Account created successfully!')).toBeVisible({
+    timeout,
+  });
+});