add authentication settings

apps/app/playwright.config.ts

@@ -38,23 +38,31 @@ export default defineConfig({
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
+    // Use prepared auth state.
+    storageState: 'playwright/.auth/user.json',
   },
 
   /* Configure projects for major browsers */
   projects: [
+    // Setup project
+    { name: 'setup', testMatch: /.*\.setup\.ts/ },
+
     {
       name: 'chromium',
       use: { ...devices['Desktop Chrome'] },
+      dependencies: ['setup'],
     },
 
     {
       name: 'firefox',
       use: { ...devices['Desktop Firefox'] },
+      dependencies: ['setup'],
     },
 
     {
       name: 'webkit',
       use: { ...devices['Desktop Safari'] },
+      dependencies: ['setup'],
     },
 
     /* Test against mobile viewports. */

apps/app/playwright/.auth/user.json

@@ -0,0 +1 @@
+{}

apps/app/playwright/auth.setup.ts

@@ -0,0 +1,24 @@
+import { test as setup, expect } from '@playwright/test';
+
+const authFile = 'playwright/.auth/user.json';
+
+setup('authenticate', async({ page }) => {
+  // Perform authentication steps. Replace these actions with your own.
+  await page.goto('/admin');
+  await page.waitForURL('/login');
+
+  await page.getByLabel('Username or email address').fill('admin');
+  await page.getByLabel('Password').fill('adminadmin');
+  await page.getByRole('button', { name: 'Sign in' }).click();
+  // Wait until the page receives the cookies.
+  //
+  // Sometimes login flow sets cookies in the process of several redirects.
+  // Wait for the final URL to ensure that the cookies are actually set.
+  await page.waitForURL('/admin');
+  // Alternatively, you can wait until the page reaches a state where all cookies are set.
+  await expect(page.getByRole('button', { name: 'View profile and more' })).toBeVisible();
+
+  // End of authentication steps.
+
+  await page.context().storageState({ path: authFile });
+});