Skip to content

Bug - Alert - forcing text to be a heading is causing accessibility issues #8402

@kdoberst

Description

@kdoberst

Describe the problem
If an alert doesn't have any child elements, forcing the alert text to be a heading is an accessibility issue.

For example, if there is an inline alert with no children elements. The content in the title attribute isn't a header at all, in that it doesn't describe the content below it.

So if I have an inline alert, the content below the alert may not be described by the alert itself.

Here's an example:

<dl>
<dt>Service Level Agreement</dt>
<dd>
   Self-support, 60 day trial
   <Alert variant="warning" isInline isPlain title="1 day remaining" />
</dd>
<dt>Cluster ID</dt>
<dd>
my_crazy_long_cluster_id
</dd>
</dl>

The alert warning text of "1 day remaining" doesn't really describe what is below - in this case, the cluster ID. A header at any level is not appropriate in this case.

How do you reproduce the problem?
See the: https://www.patternfly.org/v4/components/alert

Expected behavior
If needed have the ability to have the text (aka title) wrapped in a non-heading tag (for example p, span, div).

Is this issue blocking you?
The only workaround is to create a custom component.

What is your product and what release date are you targeting?
OCM

Any other information?
This was originally reported as part of #6444 and that issue was closed without addressing this issue.

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

Status

Done

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions