Formula wrapping does not work in webkit browsers (Safari, Epiphany...)

[gwhitney]

This is a known bug in the implementation of MathML in Webkit. There are two possible workarounds, listed with better option first:

1. We are currently using the temml package for MathML generation from the mathjs formula. It uses one of two possible strategies for allowing line wrapping in math elements: enclose each unwrappable portion of the formula in an mrow element; then the browser should be able to wrap at any boundary between mrows. Gecko and chrome do so, webkit does not. The other strategy is to place linebreak attributes on all mo (math operator) elements in the formula. I am not clear on the support in the three major engines for wrapping with this strategy. We could/should test this strategy, and if it is supported in all three engines, then: There is an open issue in mathjs to directly generate mathml from its expression objects. It doesn't actually look like a terrible amount of work. So implement that feature in mathjs, I can probably facilitate its getting merged quickly, and use the mo attribute strategy in the generated MathML. Once that's in mathjs, switch to direct generation of MathML, which would have the benefit of allowing us to cut temml out of our dependencies.

2. Detect if the browser is webkit (there are various hacks out there to do this, but not clear there is a 100% reliable way), and if a temml-generated formula is overflowing, then take it and split it up into each of its mrow elements, each wrapped in its own math element, and then replace the formula with an inline flexbox with each of those math elements packed together with no padding in between. Then the browser's flexbox algorithm should perform more-or-less the same line breaking that MathML is supposed to.

[gwhitney]

We need to discuss the priority of this issue at an upcoming meeting: alpha, beta, or "whenever someone gets to it"