3. onsen Button and ARIA

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

onsen Button and ARIA

  • R

    I am trying to get a good ARIA accessability experience on my OnsenUI app. testing on Android. I am an OnsenUI and ARIA newb

    <Button onClick={clickHandler} modifier='large'>New</Button>

    Aria sais “New”, but I want “New button” (I think)
    Aria only highlights button text

    <Button role="button" onClick={clickHandler} modifier='large'>New</Button>

    Aria sais "New button New"
    Aria highlights the whole button (instead of just button text) which is good

    <div role="button" aria-label="New" onClick={clickHandler}>
  <Button aria-hidden="true" modifier='large'>New</Button>
</div>

    Aria sais "New button"
    Aria highlights the whole button

    The last example fullfills my (hopefully correct) requirements but seems a bit of a kludge.
    Maybe OnsenUI needs a little ARIA love?

    0