test: issue sidebar testing using playwright (#4319)

Conclusion of https://codeberg.org/forgejo/forgejo/issues/3499

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/4319
Co-authored-by: Otto Richter <git@otto.splvs.net>
Co-committed-by: Otto Richter <git@otto.splvs.net>
(cherry picked from commit fafc4f6ad9)
This commit is contained in:
Otto Richter 2024-07-05 05:03:45 +00:00 committed by GitHub
parent de115cff02
commit b890d90874
2 changed files with 112 additions and 0 deletions

View file

@ -20,6 +20,32 @@ make clean frontend
npx playwright install-deps
```
## Interactive testing
You can make use of Playwright's integrated UI mode to run individual tests,
get feedback and visually trace what your browser is doing.
To do so, launch the debugserver using:
```
make test-e2e-debugserver
```
Then launch the Playwright UI:
```
npx playwright test --ui
```
You can also run individual tests while the debugserver using:
```
npx playwright test actions.test.e2e.js:9
```
First, specify the complete test filename,
and after the colon you can put the linenumber where the test is defined.
## Run all tests via local act_runner
```

View file

@ -0,0 +1,86 @@
// @ts-check
import {test, expect} from '@playwright/test';
import {login_user, load_logged_in_context} from './utils_e2e.js';
test.beforeAll(async ({browser}, workerInfo) => {
await login_user(browser, workerInfo, 'user2');
});
async function login({browser}, workerInfo) {
const context = await load_logged_in_context(browser, workerInfo, 'user2');
return await context.newPage();
}
// belongs to test: Pull: Toggle WIP
const prTitle = 'pull5';
async function click_toggle_wip({page}) {
await page.locator('.toggle-wip>a').click();
await page.waitForLoadState('networkidle');
}
async function check_wip({page}, is) {
const elemTitle = '#issue-title-display';
const stateLabel = '.issue-state-label';
await expect(page.locator(elemTitle)).toContainText(prTitle);
await expect(page.locator(elemTitle)).toContainText('#5');
if (is) {
await expect(page.locator(elemTitle)).toContainText('WIP');
await expect(page.locator(stateLabel)).toContainText('Draft');
} else {
await expect(page.locator(elemTitle)).not.toContainText('WIP');
await expect(page.locator(stateLabel)).toContainText('Open');
}
}
test('Pull: Toggle WIP', async ({browser}, workerInfo) => {
test.skip(workerInfo.project.name === 'Mobile Safari', 'Unable to get tests working on Safari Mobile, see https://codeberg.org/forgejo/forgejo/pulls/3445#issuecomment-1789636');
const page = await login({browser}, workerInfo);
const response = await page.goto('/user2/repo1/pulls/5');
await expect(response?.status()).toBe(200); // Status OK
// initial state
await check_wip({page}, false);
// toggle to WIP
await click_toggle_wip({page});
await check_wip({page}, true);
// remove WIP
await click_toggle_wip({page});
await check_wip({page}, false);
// manually edit title to another prefix
await page.locator('#issue-title-edit-show').click();
await page.locator('#issue-title-editor input').fill(`[WIP] ${prTitle}`);
await page.getByText('Save').click();
await page.waitForLoadState('networkidle');
await check_wip({page}, true);
// remove again
await click_toggle_wip({page});
await check_wip({page}, false);
});
test('Issue: Labels', async ({browser}, workerInfo) => {
test.skip(workerInfo.project.name === 'Mobile Safari', 'Unable to get tests working on Safari Mobile, see https://codeberg.org/forgejo/forgejo/pulls/3445#issuecomment-1789636');
const page = await login({browser}, workerInfo);
// select label list in sidebar only
const labelList = page.locator('.issue-content-right .labels-list a');
const response = await page.goto('/user2/repo1/issues/1');
await expect(response?.status()).toBe(200);
// preconditions
await expect(labelList.filter({hasText: 'label1'})).toBeVisible();
await expect(labelList.filter({hasText: 'label2'})).not.toBeVisible();
// add label2
await page.locator('.select-label').click();
// label search could be tested this way:
// await page.locator('.select-label input').fill('label2');
await page.locator('.select-label .item').filter({hasText: 'label2'}).click();
await page.locator('.select-label').click();
await page.waitForLoadState('networkidle');
await expect(labelList.filter({hasText: 'label2'})).toBeVisible();
// test removing label again
await page.locator('.select-label').click();
await page.locator('.select-label .item').filter({hasText: 'label2'}).click();
await page.locator('.select-label').click();
await page.waitForLoadState('networkidle');
await expect(labelList.filter({hasText: 'label2'})).not.toBeVisible();
await expect(labelList.filter({hasText: 'label1'})).toBeVisible();
});