Screenreader output
- Win 10 / IE 11 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Chrome 58 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / NVDA 2017.1: Supported. "Extend timeout to 20 minutes - Eingabefeld mit Autovervollständigung, 20 markiert"
- Win 10 / Chrome 58 / NVDA 2017.1: Supported. Extend time-out to - 20 - minutes - Eingabefeld - 20 markiert"
- Win 10 / IE 11 / NVDA 2017.1: Not supported. "Extend timeout to Eingabefeld 20 markiert"
- iOS 10.3 / Safari / VoiceOver: Not supported. "Extend timeout to 20 - text field"
Same example with tabindex=-1 on "Minutes" (attempt to tackle an IE bug)
Screenreader output
- Win 10 / IE 11 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein">
- Win 10 / Chrome 58 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / NVDA 2017.1: Supported. "Extend timeout to 20 minutes - Eingabefeld mit Autovervollständigung, 20 markiert"
- Win 10 / Chrome 58 / NVDA 2017.1: Supported. "Extend time-out to - 20 - minutes - Eingabefeld - 20 markiert"
- Win 10 / IE 11 / NVDA 2017.1: Partial support. "Extend timeout to - minutes - Eingabefeld - 20 markiert"
- iOS 10.3 / Safari / VoiceOver: Not supported. "Extend timeout to 20 - text field"
Same example with label elements around both components drawn in by aria-labelledby
Screenreader output
- Win 10 / IE 11 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein">
- Win 10 / Chrome 58 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / NVDA 2017.1: Supported. "Extend timeout to 20 minutes - Eingabefeld mit Autovervollständigung, 20 markiert"
- Win 10 / Chrome 58 / NVDA 2017.1: Supported. Extend time-out to - 20 - minutes - Eingabefeld - 20 markiert"
- Win 10 / IE 11 / NVDA 2017.1: Not supported. "Extend timeout to - Extend timeout to - minutes - Eingabefeld - 20 markiert"
- iOS 10.3 / Safari / VoiceOver: Not supported. "Extend timeout to 20 - text field"
Same example with a role tooltip on span Minutes
This is not recommended practice - just an attempt to trick IE into accepting the third element, Minutes, as part if the concatenated label.
Screenreader output
- Win 10 / IE 11 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein">
- Win 10 / Chrome 58 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / JAWS 17: Supported. "Extend time dash out to - 20 - minutes - Eingabefeld - 20 - Geben Sie Text ein"
- Win 10 / Firefox 53 / NVDA 2017.1: Supported. "Extend timeout to 20 minutes - Eingabefeld mit Autovervollständigung, 20 markiert"
- Win 10 / Chrome 58 / NVDA 2017.1: Supported. Extend time-out to - 20 - minutes - Eingabefeld - 20 markiert"
- Win 10 / IE 11 / NVDA 2017.1: Not supported. "Extend timeout to - Extend timeout to - minutes - Eingabefeld - 20 markiert"
- iOS 10.3 / Safari / VoiceOver: Not supported. "Extend timeout to 20 - text field"