Polyfill support for elementary math

My holiday project was to create an elementary math polyfill. It handles
all of the MathML 3 elementary math elements and almost all of their
attributes. It does this by creating an HTML table for the layout. This
means it should work in all modern browsers regardless of their MathML
support. I have tried it in FireFox and Chrome. Here are two examples from
Chrome (the regular build, not the Igalia build):
[image: image.png]   [image: image.png]

Long division layout looks a bit clunky -- I'm sure someone with better CSS
skills could improve the layout.

Sadly, I couldn't make use of shadow DOM because HTML currently prevents
creating a shadow root for the MathML elements. It would be trivial to
switch it over to using shadow DOM if/once that is allowed. It is a rather
large polyfill and may raise some issues that smaller ones don't because it
handles many MathML elements. In any case, it may be food for thought when
considering allowing MathML elements to be shadowed.

The polyfill can be found at
https://github.com/mathml-refresh/mathml-polyfills/tree/master/elem-math.
There is a very large test file that is part of the commit. Despite this,
I'm sure there are bugs, so please file an issue if you try it out and find
a bug.

I'm looking forward to seeing what great things others do in this new year.

Happy New Year/Decade,

    Neil

Received on Thursday, 2 January 2020 07:50:24 UTC