The latest articles on DEV Community by Alessia (@alessia). https://dev.to/alessia https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F631022%2Fdad8e5cf-7040-4ca1-a004-0dae848453e7.JPG https://dev.to/alessia en Alessia Fri, 14 May 2021 09:36:58 +0000 https://dev.to/alessia/design-pattern-slider-weirdness-regarding-voiceover-nvda-2eo0 https://dev.to/alessia/design-pattern-slider-weirdness-regarding-voiceover-nvda-2eo0 <p><a href="https://www.w3.org/TR/wai-aria-practices-1.1/#slider">Design Pattern - Slider</a></p> <p><strong>Version</strong></p> <ul> <li> <strong>VoiceOver</strong> Utility: Version 9 (562.860) on macOS Mojave Version 10.14.6</li> <li>NonVisual Desktop Access(<strong>NVDA</strong>): Version 2020.3</li> </ul> <p><strong>Weirdness</strong><br> When <strong>using arrow keys to change</strong> the value of the slider by one step, if the value of <code>aria-valuenow</code> is something like 0.56 (between 0 and 1), Voiceover will only read out 0.5 at the first change then stop announcing anything regardless of the value change, while NVDA will read out 0.560...001 or something similar (more decimal places out of nowhere).</p> <p>If the value of <code>aria-valuenow</code> is 1.3 (one decimal place) or <strong>integer</strong>, Voiceover can work as expected (announce the value as it is). NVDA is still acting weirdly with value having one decimal place.</p> <p><strong>Conclusion</strong><br> Better use integer for <code>aria-valuetext</code> or <code>aria-valuenow</code>.</p> <p><strong>Known Inconsistent Behaviour</strong><br> VoiceOver will read out current status at first while NVDA will do at last (eg. voiceOver: <code>aria-valuetext</code> or <code>aria-valuenow</code>, <code>aria-label</code>; NVDA: <code>aria-label</code>, <code>aria-valuetext</code> or <code>aria-valuenow</code>)</p> a11y