Added further playwright structure (#17)

* setting up test structure

* .

* added playwright config file, deleted original playwright folder and moved "some.test" file

* continued test structure setup

* Updating test folder structure

.github/workflows/ci.yml

@@ -48,13 +48,13 @@ jobs:
       - name: Run E2E tests
         env:
           NEXT_PUBLIC_API_URL: localhost:8088
-          NEXT_PUBLIC_FIREBASE_ENV: PROD
+          NEXT_PUBLIC_FIREBASE_ENV: DEV
           NEXT_PUBLIC_FIREBASE_API_KEY: ${{ secrets.NEXT_PUBLIC_FIREBASE_API_KEY }}
           NEXT_PUBLIC_SUPABASE_KEY: ${{ secrets.NEXT_PUBLIC_SUPABASE_KEY }}
         run: |
           yarn --cwd=web serve &
           npx wait-on http://localhost:3000
-          npx playwright test tests/playwright
+          npx playwright test tests/e2e
           SERVER_PID=$(fuser -k 3000/tcp)
           echo $SERVER_PID
           kill $SERVER_PID

.gitignore

@@ -13,6 +13,9 @@
 # testing
 /coverage
 
+# Playwright
+/tests/reports/playwright-report
+
 # next.js
 /.next/
 /out/

package.json

@@ -21,6 +21,10 @@
     "sync-android": "./scripts/sync_android.sh",
     "migrate": "./scripts/migrate.sh",
     "test": "jest",
+    "playwright": "playwright test",
+    "playwright:ui": "playwright test --ui",
+    "playwright:debug": "playwright test --debug",
+    "playwright:report": "npx playwright show-report tests/reports/playwright-report",
     "test:watch": "jest --watch",
     "test:coverage": "jest --coverage",
     "test:update": "jest --updateSnapshot",

playwright.config.ts

@@ -0,0 +1,28 @@
+import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+  testDir: './tests/e2e',
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [['html', {outputFolder: `tests/reports/playwright-report`, open: 'on-falure'}]],
+  use: {
+    baseURL: 'http://localhost:3000',
+    trace: 'on-first-retry',
+  },
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+    // {
+    //   name: 'firefox',
+    //   use: { ...devices['Desktop Firefox'] },
+    // },
+    // {
+    //   name: 'webkit',
+    //   use: { ...devices['Desktop Safari'] },
+    // },
+  ],
+});

tests/e2e/web/specs/some.test.ts

@@ -1,7 +1,8 @@
 import {expect, test} from '@playwright/test';
 
 test('shows', async ({page}) => {
-  // await page.goto('http://localhost:3000/profile'); // Adjust this to your route
+  await page.goto('/'); // Adjust this to your route
+  expect(await page.title()).toBe('Compass');
   //
   // const spinner = page.locator('[data-testid="spinner"]');
   // await expect(spinner).toBeVisible();