How to add aria-live property to notice

  • Andrea Roenning

    (@awetz583)


    3 weeks, 3 days ago

    The developer documentation states that in the block editor, the notice will accept a property of politeness with a value of assertive or polite. In testing a warning notice with a politeness value of polite, I am unable to see an aria-live property on the notice HTML.

    • This topic was modified 3 weeks, 3 days ago by James Huff. Reason: moved to Accessibility, since this is an accessibility issue

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Thread Starter Andrea Roenning

    (@awetz583)

    3 weeks ago

    When I test the following JSX, I don’t see an aria-live attribute added to the HTML output in the editor

    JSX
    <Notice status="warning" politeness="polite" isDismissible={false}> Here is a test notice</Notice>

    HTML
    <div class="components-notice is-warning"><div data-wp-c16t="true" data-wp-component="VisuallyHidden" class="components-visually-hidden ec-fd-ad-ac-adbdbfb-0 e19lxcc00" style="border: 0px; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; overflow-wrap: normal;">Warning notice</div><div class="components-notice__content">Here is a test notice<div class="components-notice__actions"></div></div></div>

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.