mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2026-05-12 22:10:25 +00:00
085d449bc5
**Backport:** https://codeberg.org/forgejo/forgejo/pulls/11932 Fixes https://codeberg.org/forgejo/forgejo/issues/11880. Adding `hx-on::after-settle="this.querySelector('button').focus()"` restores focus after the content has been swapped and the DOM has been setled. I tried `hx-on::after-swap` first since it's mentioned more often in https://github.com/bigskysoftware/htmx/issues/1869, but it didn't work. The demo attached in `focus.mp4` runs through a series of repeated clicks on both buttons. You can hear the screen reader announce the button's new label when focus is restored. ### Documentation - [ ] I created a pull request [to the documentation](https://codeberg.org/forgejo/docs) to explain to Forgejo users how to use this change. - [ ] I did not document these changes and I do not expect someone else to do it. ### Release notes - [x] This change will be noticed by a Forgejo user or admin (feature, bug fix, performance, etc.). I suggest to include a release note for this change. - [ ] This change is not visible to a Forgejo user or admin (refactor, dependency upgrade, etc.). I think there is no need to add a release note for this change. *The decision if the pull request will be shown in the release notes is up to the mergers / release team.* The content of the `release-notes/<pull request number>.md` file will serve as the basis for the release notes. If the file does not exist, the title of the pull request will be used instead. <!--start release-notes-assistant--> ## Release notes <!--URL:https://codeberg.org/forgejo/forgejo--> - Bug fixes - [PR](https://codeberg.org/forgejo/forgejo/pulls/12033): <!--number 12033 --><!--line 0 --><!--description UHJlc2VydmUgZm9jdXMgb24gc3Rhci91bnN0YXIgJiB3YXRjaC91bndhdGNoIGJ1dHRvbnMgYWZ0ZXIgY2xpY2s=-->Preserve focus on star/unstar & watch/unwatch buttons after click<!--description--> <!--end release-notes-assistant--> Co-authored-by: Henry Catalini Smith <henry@catalinismith.se> Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/12033 Reviewed-by: Mathieu Fenniak <mfenniak@noreply.codeberg.org> Co-authored-by: forgejo-backport-action <forgejo-backport-action@noreply.codeberg.org> Co-committed-by: forgejo-backport-action <forgejo-backport-action@noreply.codeberg.org>
71 lines
2.8 KiB
TypeScript
71 lines
2.8 KiB
TypeScript
// Copyright 2025 The Forgejo Authors. All rights reserved.
|
|
// SPDX-License-Identifier: GPL-3.0-or-later
|
|
|
|
// @watch start
|
|
// web_src/js/components/RepoBranchTagSelector.vue
|
|
// web_src/js/features/common-global.js
|
|
// web_src/css/repo.css
|
|
// web_src/css/modules/stats-bar.css
|
|
// @watch end
|
|
|
|
import {expect} from '@playwright/test';
|
|
import {test} from './utils_e2e.ts';
|
|
import {screenshot} from './shared/screenshots.ts';
|
|
|
|
test.use({user: 'user2'});
|
|
|
|
test('Language stats bar', async ({browser}) => {
|
|
// This test doesn't need JS and runs a little faster without it
|
|
const context = await browser.newContext({javaScriptEnabled: false});
|
|
const page = await context.newPage();
|
|
|
|
const response = await page.goto('/user2/language-stats-test');
|
|
expect(response?.status()).toBe(200);
|
|
|
|
await expect(page.locator('#language-stats ul')).toBeHidden();
|
|
|
|
await page.click('#language-stats summary');
|
|
await expect(page.locator('#language-stats ul')).toBeVisible();
|
|
await screenshot(page);
|
|
|
|
await page.click('#language-stats summary');
|
|
await expect(page.locator('#language-stats ul')).toBeHidden();
|
|
await screenshot(page);
|
|
});
|
|
|
|
test('Repo title', async ({browser}) => {
|
|
const context = await browser.newContext({javaScriptEnabled: false});
|
|
const page = await context.newPage();
|
|
|
|
const response = await page.goto('/user2/repo1');
|
|
expect(response?.status()).toBe(200);
|
|
|
|
const repoHeader = page.locator('.repo-header');
|
|
expect(await repoHeader.locator('.flex-item-title').evaluate((el) => getComputedStyle(el).fontWeight)).toBe('400');
|
|
expect(await repoHeader.locator('.flex-item-title a[href="/user2"]').evaluate((el) => getComputedStyle(el).fontWeight)).toBe('400');
|
|
expect(await repoHeader.locator('.flex-item-title a[href="/user2/repo1"]').evaluate((el) => getComputedStyle(el).fontWeight)).toBe('600');
|
|
});
|
|
|
|
test('Branch selector commit icon', async ({page}) => {
|
|
const response = await page.goto('/user2/repo1');
|
|
expect(response?.status()).toBe(200);
|
|
|
|
await expect(page.locator('.branch-dropdown-button svg.octicon-git-branch')).toBeVisible();
|
|
await expect(page.locator('.branch-dropdown-button')).toHaveText('master');
|
|
|
|
await page.goto('/user2/repo1/src/commit/65f1bf27bc3bf70f64657658635e66094edbcb4d');
|
|
await expect(page.locator('.branch-dropdown-button svg.octicon-git-commit')).toBeVisible();
|
|
await expect(page.locator('.branch-dropdown-button')).toHaveText('65f1bf27bc');
|
|
});
|
|
|
|
test('Star button focus retention', async ({page}) => {
|
|
const response = await page.goto('/user2/repo1');
|
|
expect(response?.status()).toBe(200);
|
|
|
|
const starButton = page.locator('button[aria-label="Star"], button[aria-label="Unstar"]');
|
|
await starButton.click();
|
|
|
|
await expect(
|
|
page.locator('button[aria-label="Star"]:focus, button[aria-label="Unstar"]:focus'),
|
|
).toBeVisible();
|
|
});
|