Notification

User stories

The following user stories can be used to understand when this component should be used, and how to know when it's been implemented correctly.

• As someone using the component, I want to be able to quickly understand the purpose of the notification from it's heading.
• As someone with a colour vision deficiency, I want to be able to read all the content, regardless of the colour used to display text.
• As a screen reader user, I want the notification to be announced as it becomes present.
  

Test steps

Use these steps to check that the Notification component has been implemented correctly:

1. Turn on a screen reader.
2. Trigger the notification to appear and verify that it is announced by the screen reader.
3. Verify that the notification's title is announced as a heading.

---

Known defects

We're aware of the following defects and have provided ways that these can be manually resolved, until this component is updated:

• The title for the notification should be marked up as a heading. Where possible use a heading level 2 element (<h2>) for the notification's title.
• When using the warning variant of the Notification, hovered links have an insufficient colour contrast ratio, making them difficult to perceive. Where possible, add CSS to make the hovered link text colour darker, consistent with the way that the TextLink component works.

---