Skip to content

[SF][ObjectPage]: [a11y]Heading levels should only increase by one, and Heading hierarchy is not correctly defined on the page #7043

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
1 task done
VidhiNPatel opened this issue Mar 5, 2025 · 2 comments · Fixed by #7186

Comments

@VidhiNPatel
Copy link

Describe the bug

Incorrect Heading Levels in Different Scenarios
When Tabstrip Is Present for Multiple Sections Navigation:

  1. The first section tab is missing a heading level.
  2. If a form is configured inside a subsection, its title is assigned an H6 heading, skipping the H5 heading.

When Tabstrip Is NOT Present:

  1. The subsection title is assigned an H4 heading, skipping the H3 heading level.
  2. If a form is configured inside a subsection, its title is assigned an H6 heading, skipping the H5 heading.

Isolated Example

No response

Reproduction steps

1.Go to https://sap.github.io/ui5-webcomponents-react/v2/?path=/story/layouts-floorplans-objectpage--default
2. Turn on screen reader
3. Focus to Object status
4. Check the announcement

Expected Behaviour

Heading levels should only increase by one
Ensure the order of headings is semantically correct.

Screenshots or Videos

Image

UI5 Web Components for React Version

2.7.2

UI5 Web Components Version

2.7.3

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output

Organization

Successfactors

Declaration

  • I’m not disclosing any internal or sensitive information.
@VidhiNPatel VidhiNPatel changed the title [ObjectPage]: [[a11y]Heading levels should only increase by one, and Heading hierarchy is not correctly defined on the page] [ObjectPage]: [a11y]Heading levels should only increase by one, and Heading hierarchy is not correctly defined on the page Mar 5, 2025
@VidhiNPatel VidhiNPatel changed the title [ObjectPage]: [a11y]Heading levels should only increase by one, and Heading hierarchy is not correctly defined on the page [SF][ObjectPage]: [a11y]Heading levels should only increase by one, and Heading hierarchy is not correctly defined on the page Mar 25, 2025
@Lukas742
Copy link
Contributor

Lukas742 commented Apr 3, 2025

Hi @VidhiNPatel

The first section tab is missing a heading level.

This will be fixed with the linked PR.

If a form is configured inside a subsection, its title is assigned an H6 heading, skipping the H5 heading.

There's currently no API to change the heading level of FormGroups. Please open a feature request for this in the ui5-webcomponents repo, as the component is developed there.

When Tabstrip Is NOT Present:

This is not supported. An ObjectPage should always implement ObjectPageSections (except when a placeholder is rendered), if this is not required the DynamicPage can be used.


Additionally you can define the heading levels of sections and subsections yourself by setting the titleTextLevel prop.

@ui5-webcomponents-react-bot
Copy link
Contributor

🎉 This issue has been resolved in version v2.8.2 🎉

The release is available on v2.8.2

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: 🆕 New
Development

Successfully merging a pull request may close this issue.

3 participants