mirror of
https://github.com/go-gitea/gitea.git
synced 2026-10-26 06:16:56 +09:00
silverwindandwxiaoguang
e645afbb3f
Replace Fomantic's hard-forked jQuery modal with native `<dialog>` elements, advancing https://github.com/go-gitea/gitea/issues/29849. The UI is visually unchanged. Dialogs open with `show()` over an `inert` page, so tooltips, popups and toasts mounted on `<body>` stay usable above them, unlike with `showModal()` (https://github.com/whatwg/html/issues/9936). - Remove the Fomantic modal and dimmer, add `showModal` and `hideModal` - Declare modals as `<dialog class="modal-dialog">`, shown inside a `.modal-backdrop`, instead of `ui modal` with its unused size classes - Remove two modals that could never be opened - Block the page while a modal is open, close the topmost one on Escape and restore focus to its opener - Allow stacked modals, use a confirm modal instead of `window.confirm` for deleting content history - Hide popups and toasts when a modal opens or closes - Keep the release notes modal open when generating notes fails Fixes: https://github.com/go-gitea/gitea/issues/39643 Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
73 lines
3.6 KiB
TypeScript
73 lines
3.6 KiB
TypeScript
import {env} from 'node:process';
|
|
import {test, expect} from '@playwright/test';
|
|
import {login, apiCreateRepo, apiCreateIssue, apiEditIssue, randomString} from './utils.ts';
|
|
|
|
test('comment on and close an issue', async ({page, request}) => {
|
|
const repoName = `e2e-issue-comment-${randomString(8)}`;
|
|
const owner = env.GITEA_TEST_E2E_USER;
|
|
await apiCreateRepo(request, {name: repoName, autoInit: false});
|
|
await Promise.all([
|
|
apiCreateIssue(request, {owner, repo: repoName, title: 'Comment test'}),
|
|
login(page),
|
|
]);
|
|
await page.goto(`/${owner}/${repoName}/issues/1`);
|
|
|
|
const body = `e2e-comment-${randomString(8)}`;
|
|
await page.getByPlaceholder('Leave a comment').fill(body);
|
|
// exact match: the status button reads "Close with Comment" while the box has content, which substring-matches "Comment"
|
|
await page.getByRole('button', {name: 'Comment', exact: true}).click();
|
|
await expect(page.locator('.comment-body').filter({hasText: body})).toBeVisible();
|
|
|
|
// wait for the form to re-initialize (the empty box disables the comment button); a close click
|
|
// before that does a native submit which lands on a raw JSON page instead of reloading the issue
|
|
await expect(page.getByRole('button', {name: 'Comment', exact: true})).toBeDisabled();
|
|
await page.getByRole('button', {name: 'Close Issue'}).click();
|
|
await expect(page.getByRole('button', {name: 'Reopen Issue'})).toBeVisible();
|
|
});
|
|
|
|
test('emoji autocompletion in issue description', async ({page, request}) => {
|
|
const repoName = `e2e-emoji-${randomString(8)}`;
|
|
await Promise.all([apiCreateRepo(request, {name: repoName, autoInit: false}), login(page)]);
|
|
await page.goto(`/${env.GITEA_TEST_E2E_USER}/${repoName}/issues/new`);
|
|
const textarea = page.getByPlaceholder('Leave a comment');
|
|
await textarea.focus();
|
|
await textarea.pressSequentially(':tada');
|
|
await expect(page.getByRole('option', {name: '🎉 tada'})).toBeVisible();
|
|
await textarea.press('Tab');
|
|
await expect(textarea).toHaveValue('🎉');
|
|
});
|
|
|
|
test('unsaved issue description prompts before leaving', async ({page, request}) => {
|
|
const repoName = `e2e-are-you-sure-${randomString(8)}`;
|
|
await Promise.all([apiCreateRepo(request, {name: repoName, autoInit: false}), login(page)]);
|
|
await page.goto(`/${env.GITEA_TEST_E2E_USER}/${repoName}/issues/new`);
|
|
await page.getByPlaceholder('Leave a comment').press('a');
|
|
const dialogPromise = page.waitForEvent('dialog');
|
|
page.once('dialog', (dialog) => dialog.dismiss());
|
|
await page.getByRole('link', {name: 'Dashboard'}).click();
|
|
expect((await dialogPromise).type()).toBe('beforeunload');
|
|
await expect(page).toHaveURL(/\/issues\/new$/);
|
|
});
|
|
|
|
test('delete an edit history entry via a confirm over the history modal', async ({page, request}) => {
|
|
const repoName = `e2e-issue-history-${randomString(8)}`;
|
|
const owner = env.GITEA_TEST_E2E_USER;
|
|
await Promise.all([
|
|
(async () => {
|
|
await apiCreateRepo(request, {name: repoName, autoInit: false});
|
|
await apiCreateIssue(request, {owner, repo: repoName, title: 'History test', body: 'first'});
|
|
await apiEditIssue(request, owner, repoName, 1, {body: 'second'});
|
|
})(),
|
|
login(page),
|
|
]);
|
|
await page.goto(`/${owner}/${repoName}/issues/1`);
|
|
const historyMenu = page.locator('.content-history-menu');
|
|
await historyMenu.click();
|
|
await historyMenu.getByRole('menuitem').last().click();
|
|
const history = page.getByRole('dialog');
|
|
await history.getByText('Options').click();
|
|
await history.getByRole('menuitem', {name: 'Delete from history'}).click();
|
|
await page.getByRole('dialog', {name: 'Delete from history?'}).getByRole('button', {name: 'Confirm'}).click();
|
|
await expect(page.getByRole('dialog')).toHaveCount(0);
|
|
});
|