mirrors
/
forgejo
mirror of
1
Fork 0
Code Issues Releases Activity

New release form semantics 

- correctly render labels without help text
- accessibility: fix external release button focus
- accessibility: test form aspects in browser test
This commit is contained in:
Otto Richter 2024-09-11 12:37:04 +02:00
parent 28643cc276
commit a62521f241
3 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
templates/repo/release/new.tmpl
View File

@ -99,9 +99,9 @@
{{ctx.Locale.Tr "remove"}} {{ctx.Locale.Tr "remove"}}
</a> </a>
</div> </div>
<a class="ui mini button tw-float-right tw-mb-4 tw-mt-2" id="add-external-link"> <button type="button" class="ui mini button tw-float-right tw-mb-4 tw-mt-2" id="add-external-link">
{{ctx.Locale.Tr "repo.release.add_external_asset"}} {{ctx.Locale.Tr "repo.release.add_external_asset"}}
</a> </button>
{{if .IsAttachmentEnabled}} {{if .IsAttachmentEnabled}}
<div class="field"> <div class="field">
{{template "repo/upload" .}} {{template "repo/upload" .}}
@ -116,7 +116,6 @@
<label> <label>
<input type="checkbox" name="add_tag_msg"> <input type="checkbox" name="add_tag_msg">
{{ctx.Locale.Tr "repo.release.add_tag_msg"}} {{ctx.Locale.Tr "repo.release.add_tag_msg"}}
<span class="help"></span>
</label> </label>
{{else}} {{else}}
<input type="hidden" name="add_tag_msg" value="false"> <input type="hidden" name="add_tag_msg" value="false">

3
tests/e2e/release.test.e2e.js
View File

@ -1,6 +1,7 @@
// @ts-check // @ts-check
import {expect} from '@playwright/test'; import {expect} from '@playwright/test';
import {test, login_user, save_visual, load_logged_in_context} from './utils_e2e.js'; import {test, login_user, save_visual, load_logged_in_context} from './utils_e2e.js';
import {validate_form} from './shared/forms.js';
test.beforeAll(async ({browser}, workerInfo) => { test.beforeAll(async ({browser}, workerInfo) => {
await login_user(browser, workerInfo, 'user2'); await login_user(browser, workerInfo, 'user2');
@ -23,6 +24,7 @@ test('External Release Attachments', async ({browser, isMobile}, workerInfo) =>
// Fill out form and create new release // Fill out form and create new release
await expect(page).toHaveURL('/user2/repo2/releases/new'); await expect(page).toHaveURL('/user2/repo2/releases/new');
await validate_form({page}, 'fieldset');
await page.fill('input[name=tag_name]', '2.0'); await page.fill('input[name=tag_name]', '2.0');
await page.fill('input[name=title]', '2.0'); await page.fill('input[name=title]', '2.0');
await page.click('#add-external-link'); await page.click('#add-external-link');
@ -43,6 +45,7 @@ test('External Release Attachments', async ({browser, isMobile}, workerInfo) =>
// Validate edit page and edit the release // Validate edit page and edit the release
await expect(page).toHaveURL('/user2/repo2/releases/edit/2.0'); await expect(page).toHaveURL('/user2/repo2/releases/edit/2.0');
await validate_form({page}, 'fieldset');
await expect(page.locator('.attachment_edit:visible')).toHaveCount(2); await expect(page.locator('.attachment_edit:visible')).toHaveCount(2);
await expect(page.locator('.attachment_edit:visible').nth(0)).toHaveValue('Test'); await expect(page.locator('.attachment_edit:visible').nth(0)).toHaveValue('Test');
await expect(page.locator('.attachment_edit:visible').nth(1)).toHaveValue('https://forgejo.org/'); await expect(page.locator('.attachment_edit:visible').nth(1)).toHaveValue('https://forgejo.org/');

7
web_src/css/form.css
View File

@ -10,6 +10,7 @@ fieldset legend {
fieldset label { fieldset label {
display: block; display: block;
margin-bottom: 0.6em;
} }
fieldset label:has(input[type="text"]), fieldset label:has(input[type="text"]),
@ -19,7 +20,11 @@ fieldset label:has(input[type="number"]) {
fieldset .help { fieldset .help {
font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal);
display: block !important; /* overrides another rule in this file, remove when obsolete */ }
.form fieldset .help { /* overrides other .form .help rules in this file, remove when obsolete */
display: block !important;
padding-bottom: 0;
} }
fieldset input[type="checkbox"], fieldset input[type="checkbox"],