Add logged in session test

Author: kdumontnu

playwright.config.js

@@ -37,7 +37,7 @@ const config = {
 
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
-    headless: true,
+    headless: true,   // set to false to debug
 
     locale: 'en-US',
 

tests/e2e/e2e_test.go

@@ -96,15 +96,17 @@ func TestE2e(t *testing.T) {
 				cmd := exec.Command(runArgs[0], runArgs...)
 				cmd.Env = os.Environ()
 				cmd.Env = append(cmd.Env, fmt.Sprintf("GITEA_URL=%s", setting.AppURL))
-				var out bytes.Buffer
-				cmd.Stdout = &out
+				var stdout, stderr bytes.Buffer
+				cmd.Stdout = &stdout
+				cmd.Stderr = &stderr
 				err := cmd.Run()
 				if err != nil {
 					// Currently colored output is conflicting. Using Printf until that is resolved.
-					fmt.Printf("%v", out.String())
+					fmt.Printf("%v", stdout.String())
+					fmt.Printf("%v", stderr.String())
 					log.Fatal("Playwright Failed: %s", err)
 				} else {
-					fmt.Printf("%v", out.String())
+					fmt.Printf("%v", stdout.String())
 				}
 			})
 		})

tests/e2e/example.test.e2e.js

@@ -1,5 +1,10 @@
 // @ts-check
 import {test, expect} from '@playwright/test';
+import {login_user, save_visual, load_logged_in_context} from './utils_e2e.js';
+
+test.beforeAll(async ({browser}, workerInfo) => {
+  await login_user(browser, workerInfo, 'user2');
+});
 
 test('Load Homepage', async ({page}) => {
   const response = await page.goto('/');
@@ -20,16 +25,33 @@ test('Test Register Form', async ({page}, workerInfo) => {
   await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`);
   await expect(page.locator('.dashboard-navbar span>img.ui.avatar.image')).toBeVisible();
   await expect(page.locator('.ui.positive.message.flash-success')).toHaveText('Account was successfully created.');
-  // Optionally include visual testing
-  if (process.env.VISUAL_TEST) {
-    await page.waitForLoadState('networkidle');
-    // Mock page/version string
-    await page.locator('footer div.ui.left').evaluate((node) => node.innerHTML = 'MOCK');
-    await expect(page).toHaveScreenshot({timeout: 20000,
-      mask: [
-        page.locator('.dashboard-navbar span>img.ui.avatar.image'),
-        page.locator('.ui.dropdown.jump.item.tooltip span>img.ui.avatar.image'),
-      ]
-    });
-  }
+
+  save_visual(page);
+});
+
+test('Test Login Form', async ({page}, workerInfo) => {
+  const response = await page.goto('/user/login');
+  await expect(response?.status()).toBe(200); // Status OK
+
+  await page.type('input[name=user_name]', `user2`);
+  await page.type('input[name=password]', `password`);
+  await page.click('form button.ui.green.button:visible');
+
+  await page.waitForLoadState('networkidle');
+
+  await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`);
+
+  save_visual(page);
+});
+
+test('Test Logged In User', async ({browser}, workerInfo) => {
+  const context = await load_logged_in_context(browser, workerInfo, 'user2');
+  const page = await context.newPage();
+
+  await page.goto('/');
+
+  // Make sure we routed to the home page. Else login failed.
+  await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`);
+
+  save_visual(page);
 });

tests/e2e/utils_e2e.js

@@ -0,0 +1,62 @@
+import {expect, request} from '@playwright/test';
+
+const ARTIFACTS_PATH = `tests/e2e/test-artifacts`
+const LOGIN_PASSWORD = 'password'
+
+/*
+log in user and store session info. This should generally be
+run in test.beforeAll(), then the session can be loaded in tests.
+*/
+export async function login_user(browser, workerInfo, user) {
+  // Set up a new context
+  let context = await browser.newContext();
+  let page = await context.newPage();
+  
+  // Route to login page
+  // Note: this could probably be done more quickly with a POST
+  const response = await page.goto('/user/login');
+  await expect(response?.status()).toBe(200); // Status OK
+
+  // Fill out form
+  await page.type('input[name=user_name]', user);
+  await page.type('input[name=password]', LOGIN_PASSWORD);
+  await page.click('form button.ui.green.button:visible');
+
+  await page.waitForLoadState('networkidle');
+
+  await expect(page.url(), {message: `Failed to login user ${user}`}).toBe(`${workerInfo.project.use.baseURL}/`);
+
+  // Save state
+  await context.storageState({ path: `${ARTIFACTS_PATH}/state-${user}-${workerInfo.workerIndex}.json` });
+
+  return context;
+}
+
+export async function load_logged_in_context(browser, workerInfo, user) {
+    try {
+        var context = await browser.newContext({ storageState: `${ARTIFACTS_PATH}/state-${user}-${workerInfo.workerIndex}.json` })
+    } catch(err) {
+        if (err.code == 'ENOENT') {
+            console.error(`Could not find state for '${user}'. Did you call login_user(browser, workerInfo, '${user}') in test.beforeAll()?`)
+        }
+        throw err;
+    }
+    return context;
+}
+
+export async function save_visual(page) {
+  // Optionally include visual testing
+  if (process.env.VISUAL_TEST) {
+    await page.waitForLoadState('networkidle');
+    // Mock page/version string
+    await page.locator('footer div.ui.left').evaluate((node) => node.innerHTML = 'MOCK');
+    await expect(page).toHaveScreenshot({
+      fullPage: true,
+      timeout: 20000, 
+      mask: [
+        page.locator('.dashboard-navbar span>img.ui.avatar.image'),
+        page.locator('.ui.dropdown.jump.item.tooltip span>img.ui.avatar.image'),
+      ],
+    });
+  }
+}