Metadata-level security toggles need visible focus

Open Beginner friendly
#6,531 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
72/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
angular, typescript

Research direction

Find the metadata security toggle used on the Administer page's Metadata tab, then inspect its keyboard focus behavior alongside the Edit button styling. Reproduce the issue by tabbing through an item with metadata-level security controls enabled; done when the toggle receives visible focus while navigating by keyboard.

Written by the indexing model from the issue text.

Description

accessibility affects: 10.x affects: main bug ux

Describe the bug

Metadata-level security toggles need visible focus so that they can be fully operable via keyboard.

To Reproduce

  1. Enable Metadata-level security controls (See documentation) for some test field.
  2. Go to the Administer page, Metadata tab of an item with metadata-level security controls enabled. For example on demo site, https://demo.dspace.org/entities/person/5d0098fc-344a-4067-a57d-457092b72e82/edit/metadata
  3. Try to navigate the page via the "Tab" key; you'll see focus go to all the various Edit buttons but skip over the toggle element next to person.birthDate (in the demo site example from step 2)
  4. You can actually click space to activate the toggle, but the element has no focus styling so you can't see that it gets focus

Expected behavior

The toggle component should have focus styling just like the other buttons on the metadata administration page.

See an example of focus styling on the Edit button:

Screenshot 2026-11-12 at 2 03 46 PM

Related

This element was introduced with the first half of DSpace-CRIS features via https://github.com/DSpace/dspace-angular/pull/5145.

Dominant language
TypeScript
Stars
180
Forks
577
Avg merge
2d 1h
Merged PRs (30d)
100

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from DSpace/dspace-angular

All issues in DSpace/dspace-angular

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.