Add e2e reaction test, improve accessibility, enable parallel testing

tests/e2e/codeeditor.test.ts

@@ -1,9 +1,9 @@
 import {env} from 'node:process';
 import {expect, test} from '@playwright/test';
-import {login, apiCreateRepo, apiDeleteRepo} from './utils.ts';
+import {login, apiCreateRepo, apiDeleteRepo, randomString} from './utils.ts';
 
 test('codeeditor textarea updates correctly', async ({page, request}) => {
-  const repoName = `e2e-codeeditor-${Date.now()}`;
+  const repoName = `e2e-codeeditor-${randomString(8)}`;
   await apiCreateRepo(request, {name: repoName});
   try {
     await login(page);

tests/e2e/events.test.ts

@@ -1,10 +1,10 @@
 import {test, expect} from '@playwright/test';
-import {loginUser, baseUrl, apiUserHeaders, apiCreateUser, apiDeleteUser, apiCreateRepo, apiCreateIssue, apiStartStopwatch, timeoutFactor} from './utils.ts';
+import {loginUser, baseUrl, apiUserHeaders, apiCreateUser, apiDeleteUser, apiCreateRepo, apiCreateIssue, apiStartStopwatch, timeoutFactor, randomString} from './utils.ts';
 
 // These tests rely on a short EVENT_SOURCE_UPDATE_TIME in the e2e server config.
 test.describe('events', () => {
   test('notification count', async ({page, request}) => {
-    const id = `ev-notif-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
+    const id = `ev-notif-${randomString(8)}`;
     const owner = `${id}-owner`;
     const commenter = `${id}-commenter`;
     const repoName = id;
@@ -30,7 +30,7 @@ test.describe('events', () => {
   });
 
   test('stopwatch', async ({page, request}) => {
-    const name = `ev-sw-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
+    const name = `ev-sw-${randomString(8)}`;
     const headers = apiUserHeaders(name);
 
     await apiCreateUser(request, name);
@@ -52,7 +52,7 @@ test.describe('events', () => {
   });
 
   test('logout propagation', async ({browser, request}) => {
-    const name = `ev-logout-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
+    const name = `ev-logout-${randomString(8)}`;
 
     await apiCreateUser(request, name);
 

tests/e2e/milestone.test.ts

@@ -1,9 +1,9 @@
 import {env} from 'node:process';
 import {test, expect} from '@playwright/test';
-import {login, apiCreateRepo, apiDeleteRepo} from './utils.ts';
+import {login, apiCreateRepo, apiDeleteRepo, randomString} from './utils.ts';
 
 test('create a milestone', async ({page}) => {
-  const repoName = `e2e-milestone-${Date.now()}`;
+  const repoName = `e2e-milestone-${randomString(8)}`;
   await login(page);
   await apiCreateRepo(page.request, {name: repoName});
   await page.goto(`/${env.GITEA_TEST_E2E_USER}/${repoName}/milestones/new`);

tests/e2e/org.test.ts

@@ -1,8 +1,8 @@
 import {test, expect} from '@playwright/test';
-import {login, apiDeleteOrg} from './utils.ts';
+import {login, apiDeleteOrg, randomString} from './utils.ts';
 
 test('create an organization', async ({page}) => {
-  const orgName = `e2e-org-${Date.now()}`;
+  const orgName = `e2e-org-${randomString(8)}`;
   await login(page);
   await page.goto('/org/create');
   await page.getByLabel('Organization Name').fill(orgName);

tests/e2e/reactions.test.ts

@@ -0,0 +1,27 @@
+import {env} from 'node:process';
+import {expect, test} from '@playwright/test';
+import {login, apiCreateRepo, apiCreateIssue, apiDeleteRepo, randomString} from './utils.ts';
+
+test('toggle issue reactions', async ({page, request}) => {
+  const repoName = `e2e-reactions-${randomString(8)}`;
+  const owner = env.GITEA_TEST_E2E_USER;
+  await apiCreateRepo(request, {name: repoName});
+  await Promise.all([
+    apiCreateIssue(request, owner, repoName, {title: 'Reaction test'}),
+    login(page),
+  ]);
+  try {
+    await page.goto(`/${owner}/${repoName}/issues/1`);
+
+    const issueComment = page.locator('.timeline-item.comment.first');
+
+    await issueComment.locator('.select-reaction').click();
+    await issueComment.locator('.select-reaction .item[data-reaction-content="+1"]').click();
+    await expect(issueComment.locator('.bottom-reactions a[role="button"][data-reaction-content="+1"] .reaction-count')).toHaveText('1');
+
+    await issueComment.locator('.bottom-reactions a[role="button"][data-reaction-content="+1"]').click();
+    await expect(issueComment.locator('.bottom-reactions a[role="button"][data-reaction-content="+1"]')).toHaveCount(0);
+  } finally {
+    await apiDeleteRepo(request, owner, repoName);
+  }
+});

tests/e2e/readme.test.ts

@@ -1,9 +1,9 @@
 import {env} from 'node:process';
 import {test, expect} from '@playwright/test';
-import {apiCreateRepo, apiDeleteRepo} from './utils.ts';
+import {apiCreateRepo, apiDeleteRepo, randomString} from './utils.ts';
 
 test('repo readme', async ({page}) => {
-  const repoName = `e2e-readme-${Date.now()}`;
+  const repoName = `e2e-readme-${randomString(8)}`;
   await apiCreateRepo(page.request, {name: repoName});
   await page.goto(`/${env.GITEA_TEST_E2E_USER}/${repoName}`);
   await expect(page.locator('#readme')).toContainText(repoName);

tests/e2e/register.test.ts

@@ -1,6 +1,6 @@
 import {env} from 'node:process';
 import {test, expect} from '@playwright/test';
-import {login, logout, apiDeleteUser} from './utils.ts';
+import {login, logout, apiDeleteUser, randomString} from './utils.ts';
 
 test.beforeEach(async ({page}) => {
   await page.goto('/user/sign_up');
@@ -32,7 +32,7 @@ test('register with mismatched passwords shows error', async ({page}) => {
 });
 
 test('register then login', async ({page}) => {
-  const username = `e2e-register-${Date.now()}`;
+  const username = `e2e-register-${randomString(8)}`;
   const email = `${username}@${env.GITEA_TEST_E2E_DOMAIN}`;
   const password = 'password123!';
 

tests/e2e/repo.test.ts

@@ -1,9 +1,9 @@
 import {env} from 'node:process';
 import {test} from '@playwright/test';
-import {login, apiDeleteRepo} from './utils.ts';
+import {login, apiDeleteRepo, randomString} from './utils.ts';
 
 test('create a repository', async ({page}) => {
-  const repoName = `e2e-repo-${Date.now()}`;
+  const repoName = `e2e-repo-${randomString(8)}`;
   await login(page);
   await page.goto('/repo/create');
   await page.locator('input[name="repo_name"]').fill(repoName);

tests/e2e/user-settings.test.ts

@@ -1,8 +1,8 @@
 import {test, expect} from '@playwright/test';
-import {login} from './utils.ts';
+import {login, randomString} from './utils.ts';
 
 test('update profile biography', async ({page}) => {
-  const bio = `e2e-bio-${Date.now()}`;
+  const bio = `e2e-bio-${randomString(8)}`;
   await login(page);
   await page.goto('/user/settings');
   await page.getByLabel('Biography').fill(bio);

tests/e2e/utils.ts

@@ -5,6 +5,11 @@ import type {APIRequestContext, Locator, Page} from '@playwright/test';
 
 export const timeoutFactor = Number(env.GITEA_TEST_E2E_TIMEOUT_FACTOR) || 1;
 
+/** Generate a random hex string. */
+export function randomString(length: number) {
+  return randomBytes(Math.ceil(length / 2)).toString('hex').slice(0, length);
+}
+
 export function baseUrl() {
   return env.GITEA_TEST_E2E_URL?.replace(/\/$/g, '');
 }