e2e login test

.gitignore

@@ -4,6 +4,7 @@
 /node_modules
 /.pnp
 .pnp.js
+yarn.lock
 
 # testing
 /coverage
@@ -44,6 +45,9 @@ yarn-error.log*
 
 # Tests
 /report
+/test-results/
+/playwright-report/
+/playwright/.cache/
 
 # eslint
 .eslintcache

playwright.config.ts

@@ -6,29 +6,20 @@ const config: PlaywrightTestConfig = {
       name: 'chromium',
       use: { ...devices['Desktop Chrome'] },
     },
-    {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
-    },
-  ],
-  reporter: [
-    [
-      'html',
-      {
-        outputFolder: 'report',
-        open: 'never',
-      },
-    ],
   ],
+  reporter: 'html',
   webServer: {
     command: 'npm run start',
     url: 'http://localhost:4002',
+    reuseExistingServer: !process.env.CI,
   },
   use: {
     headless: true,
     ignoreHTTPSErrors: true,
     baseURL: 'http://localhost:4002',
     video: 'off',
   },
+  testDir: './tests',
 };
+
 export default config;

tests/e2e/auth/login.spec.ts

@@ -1,6 +1,52 @@
 import { expect, test } from '@playwright/test';
 
-test('Should navigate to login page', async ({ page }) => {
-  page.goto('/');
+import { prisma } from '@/lib/prisma';
+
+const user = {
+  name: 'Jackson',
+  email: 'jackson@boxyhq.com',
+  password: 'password',
+} as const;
+
+const team = {
+  name: 'BoxyHQ',
+  slug: 'boxyhq',
+} as const;
+
+test('Should signup a new user', async ({ page }) => {
+  await page.goto('/auth/join');
+  await expect(page).toHaveURL('/auth/join');
+  await expect(
+    page.getByRole('heading', { name: 'Get started' })
+  ).toBeVisible();
+  await page.getByPlaceholder('Your name').fill(user.name);
+  await page.getByPlaceholder('Team Name').fill(team.name);
+  await page.getByPlaceholder('example@boxyhq.com').fill(user.email);
+  await page.getByPlaceholder('Password').fill(user.password);
+  await page.getByRole('button', { name: 'Create Account' }).click();
+  await page.waitForURL('/auth/login');
+  await page.waitForSelector(
+    'text=You have successfully created your account.'
+  );
+});
+
+test('Should login a user', async ({ page }) => {
+  await page.goto('/auth/login');
   await expect(page).toHaveURL('/auth/login');
+  await expect(
+    page.getByRole('heading', { name: 'Welcome back' })
+  ).toBeVisible();
+  await page.getByPlaceholder('Email').fill(user.email);
+  await page.getByPlaceholder('Password').fill(user.password);
+  await page.getByRole('button', { name: 'Sign in' }).click();
+  await page.waitForURL('/dashboard');
+  await page.waitForURL(`/teams/${team.slug}/settings`);
+  await page.waitForSelector('text=Settings');
+});
+
+test.afterAll(async () => {
+  await prisma.teamMember.deleteMany();
+  await prisma.team.deleteMany();
+  await prisma.user.deleteMany();
+  await prisma.$disconnect();
 });