VoiceOver screenreader can't read KaTeX's hidden MathML

The KaTeX demo page has some math equations that render visually hidden MathML output and a visible equation that has aria-hidden=true. What this problem does is prevents mobile screen reader users like VoiceOver for iOS from using touch exploration (explore-by-touch) with their screen reader enabled to move their fingers on the screen and set focus onto the MathML equation. They can't touch the visible equations (non-MathML) directly because the visible equations have aria-hidden=true which prevents screen reader focus.

The screen reader user on iOS can get to the MathML equations but they can only do it through linear navigation, e.g. swipe to the next element one at a time, or use VoiceOver+arrow key navigation. Touch exploration is disabled though and the MathML is skipped over if just moving your finger along the screen trying to focus on the equation.

My suggestion to solve this problem would be to do something like detecting browsers that support MathML like Safari and then render the MathML as visible equations rather than visually hidden.

Steps to reproduce:

1. Visit https://khan.github.io/KaTeX/ on an iPhone or iPad
2. Turn on the VoiceOver Screen reader.
3. Set focus with your finger to the Math equations.

Expected Results: VoiceOver speaks the Math equations out in an accessible format after you touch them to set focus.

Actual Results: VoiceOver makes a "ding, ding, ding" noise as you try to touch the Math equations and you can't actually set focus to the match equations by directly touching them.

Code that is used to visually hide the accessible MathML: .katex .katex-mathml { position: absolute; clip: rect(1px, 1px, 1px, 1px); padding: 0; border: 0; height: 1px; width: 1px; overflow: hidden }

Happy to help answer any follow up questions and provide more info!

Thanks!