Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

ObjectPage: tabIndex=0 set on first ObjectPageSection even for single-section layout causing WCAG 2.1.1 keyboard accessibility violation

Aberta
  • Algo errado?
#9,080 3 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

@Lukas742 já está trabalhando nisso.

Desde 23/10/2026.

  • #9093 de @Lukas742 — aberto

Avaliação

Esta issue ainda não foi avaliada.

Descrição

Bug Description

When ObjectPage is used with a single ObjectPageSection, the component sets tabIndex=0 on that section after mount, making a non-interactive region focusable via the keyboard Tab key.

The library already handles the single section case — hasOnlySingleSection is calculated and used to hide the tab navigation bar. However, the tabIndex effect does not check hasOnlySingleSection and sets tabIndex=0 unconditionally. This is the roving tabindex pattern designed for navigating between multiple sections, which has no purpose when there is only one section.

This causes a WCAG 2.1.1 violation — a non-interactive

element appears as a wasted Tab stop in the keyboard tab order.

Affected Component

ObjectPage, ObjectPageSection

Expected Behaviour

When there is only one ObjectPageSection, the section should not be added to the keyboard Tab order. The tabIndex should remain -1 since there are no other sections to navigate between.

Isolated Example

No response

Steps to Reproduce
  1. Render an ObjectPage with a single ObjectPageSection
  2. Open the page in a browser
  3. Open DevTools and inspect the element with data-component-name="ObjectPageSection"
  4. Press Tab to navigate through the page
  5. Observe that the element receives keyboard focus and has tabindex="0" set on it
Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

2.27.2

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

SAP Labs

Declaration
  • I’m not disclosing any internal or sensitive information.
Linguagem predominante
TypeScript
Estrelas
541
Forks
114
Merge médio
21h 26min
PRs com merge (30d)
82

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de UI5/webcomponents-react

Todas as issues de UI5/webcomponents-react

Issues semelhantes

Mais issues de TypeScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.