The output elements with accessible names.

Published:

Note: review additional tests for more detailed announcements. These tests are solely looking to determine if the visible text and accessible names are accessible.

Important note concerning TalkBack:

If output elements are given an accessible name, or contain content by default, TalkBack paired with Chrome will auto-announce the accessible name, any default content, and role (status) of at least one, if not all, instances of outputs on initial document load or refresh.

Add content to an empty output with aria-label

results

Expectation: should announce flattened text string and accessible name. Visible text should be accessible. Role should be announced either in live announcement, or when navigated to.

  • macOS 10.14.5 VoiceOver with Safari 12.1.1:
    Live announcement of accessible name, followed by injected content. Navigating to element announces "'accessible name', output". VO can enter element and announce visible content. VO can navigate to the output and its accessible name and role will announce, without injected content.
  • macOS 10.14.5 VoiceOver with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element announces "'accessible name', status". VO can enter element and announce visible content. VO can navigate to the output and its accessible name and role will announce, without injected content.
  • JAWS 2019 (june) with IE11:
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name.
  • JAWS 2019 (june) with Edge 77 dev:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output.
  • JAWS 2019 (june) with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output.
  • JAWS 2019 (june) with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • NVDA 2019.1.1 with IE11:
    No live announcement made. Prior to injecting content, can navigate with virtual cursor and hear "'edit' accessible name". After content is injected, announces "'edit' new content".
  • NVDA 2019.1.1 with Edge 77 dev:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content.
  • NVDA 2019.1.1 with Chrome 75:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content.
  • NVDA 2019.1.1 with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • Android 8.1 TalkBack 7.3 with Firefox 68.0 (preview):
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name. output is not accessible without injected content.
  • Android 8.1 TalkBack 7.3 with Chrome 75:
    Announces accessible name (twice) and "status" role. Injected content is not announced. Navigating to injected content only announces accessible name provided by aria-label and status role.
  • iOS 12.3.1 VoiceOver with Safari:
    Live announcement of injected content, intended accessible name not announced. When navigated to, visible text announced, but not intended accessible name. output is not accessible without injected content.

Add content to an empty output with label association

results

Expectation: should announce flattened text string and accessible name. Visible text should be accessible. Role should be announced either in live announcement, or when navigated to.

  • macOS 10.14.5 VoiceOver with Safari 12.1.1:
    Live announcement of accessible name, followed by injected content. Navigating to element announces "'label', 'injected content'". No role is announced. Webkit does not appear to properly associate a label with an output even though its an element that can be labelled.
  • macOS 10.14.5 VoiceOver with Chrome 75:
    Live announcement injected content. Navigating to element announces "'label', 'injected content'". No role is announced. Blink does not appear to properly associate a label with an output even though its an element that can be labelled.
  • JAWS 2019 (june) with IE11:
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name.
  • JAWS 2019 (june) with Edge 77 dev:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output.
  • JAWS 2019 (june) with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output.
  • JAWS 2019 (june) with Firefox 67.0.4:
    No live announcement. Label element text and injected content text treated as single focus stop when navigated to. No role announcement.
  • NVDA 2019.1.1 with IE11:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • NVDA 2019.1.1 with Edge 77 dev:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content.
  • NVDA 2019.1.1 with Chrome 75:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content.
  • NVDA 2019.1.1 with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • Android 8.1 TalkBack 7.3 with Firefox 68.0 (preview):
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name. output is not accessible without injected content.
  • Android 8.1 TalkBack 7.3 with Chrome 75:
    Announces accessible name (twice) and "status" role. Injected content is not announced. Navigating to injected content only announces accessible name provided by label element and status role.
  • iOS 12.3.1 VoiceOver with Safari:
    Live announcement of injected content, intended accessible name not announced. When navigated to, visible text announced, but not intended accessible name. output is not accessible without injected content.

Add content to an empty output with title attribute

results

Expectation: should announce flattened text string and accessible name. Visible text should be accessible. Role should be announced either in live announcement, or when navigated to.

  • macOS 10.14.5 VoiceOver with Safari 12.1.1:
    Live announcement of injected content. Navigating to element announces the injected content. VO can navigate to the output and its accessible name and output role will announce if there is no subtree content. The title is not treated as an accessible description when subtree content exists.
  • macOS 10.14.5 VoiceOver with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element announces "'accessible name', status". VO can enter element and announce visible content. VO can navigate to the output and its accessible name and role will announce, without injected content. The title is not treated as an accessible description when subtree content exists.
  • JAWS 2019 (june) with IE11:
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name.
  • JAWS 2019 (june) with Edge 77 dev:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output. title doesn't announce as accessible description when subtree content is injected into it. output is not accessible without injected content.
  • JAWS 2019 (june) with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element announces injected content, but not intended accessible name of output. title doesn't announce as accessible description when subtree content is injected into it. output is not accessible without injected content.
  • JAWS 2019 (june) with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • NVDA 2019.1.1 with IE11:
    No live announcement made. Prior to injecting content, can navigate with virtual cursor and hear "accessible name". After content is injected, only announced injected content. title provides no announced accessible description.
  • NVDA 2019.1.1 with Edge 77 dev:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content. title is not announced as accessible description when content is injected.
  • NVDA 2019.1.1 with Chrome 75:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to injecting content, navigating to empty output will announce intended accessible name. After injecting content, intended accessible name is not announced, only the injected content. title is not announced as accessible description when content is injected.
  • NVDA 2019.1.1 with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to. title is not announced as accessible description when content is injected.
  • Android 8.1 TalkBack 7.3 with Firefox 68.0 (preview):
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name (nor as accessible description). output is not accessible without injected content.
  • Android 8.1 TalkBack 7.3 with Chrome 75:
    Announces accessible name (twice) and "status" role. Injected content is not announced. Navigating to injected content only announces accessible name provided by title attribute and status role. title not used as accessible description, even though output has subtree content.
  • iOS 12.3.1 VoiceOver with Safari:
    Live announcement of injected content, intended accessible name not announced. When navigated to, visible text announced, but not intended accessible name (nor as accessible description). output is not accessible without injected content.

Update content in an output with default text and accessible name from aria-label

Default text string
results

Expectation: should announce flattened text string.

  • macOS 10.14.5 VoiceOver with Safari 12.1.1:
    Live announcement of accessible name, followed by injected content. Navigating to element, before or after injection, announces "'accessible name', output". VO can enter element and announce visible content.
  • macOS 10.14.5 VoiceOver with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element, before or after injection, announces "'accessible name', status". VO can enter element and announce visible content.
  • JAWS 2019 (june) with IE11:
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name.
  • JAWS 2019 (june) with Edge 77 dev:
    Live announcement of accessible name, followed by injected content. Navigating to element before or after injected content announces subtree content, but not intended accessible name of output.
  • JAWS 2019 (june) with Chrome 75:
    Live announcement of accessible name, followed by injected content. Navigating to element before or after injected content announces subtree content, but not intended accessible name of output.
  • JAWS 2019 (june) with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • NVDA 2019.1.1 with IE11:
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name. Visible content announced with the word 'edit'.
  • NVDA 2019.1.1 with Edge 77 dev:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to, and after injecting content, navigating to the output will announce visible content, but not the intended accessible name.
  • NVDA 2019.1.1 with Chrome 75:
    Live announcement of injected content, followed by accessible name. No role announced. Prior to, and after injecting content, navigating to the output will announce visible content, but not the intended accessible name.
  • NVDA 2019.1.1 with Firefox 67.0.4:
    No live announcement. No announcement of intended accessible name, or role, when navigated to.
  • Android 8.1 TalkBack 7.3 with Firefox 68.0 (preview):
    No live announcement of injected content. When navigated to, visible text announced, but not intended accessible name.
  • Android 8.1 TalkBack 7.3 with Chrome 75:
    Announces accessible name (twice) and "status" role. Injected content is not announced. Navigating to injected content only announces accessible name provided by aria-label and status role.
  • iOS 12.3.1 VoiceOver with Safari:
    Live announcement of injected content, intended accessible name not announced, before or after injected content. When navigated to, visible text announced, but not intended accessible name.