Old browser support issues, especially iOS/Safari

[sidewayss]

This issue is open as a reminder to consider eliminating some of these backwards compatibility workarounds. The numbered list is in reverse historical order, most recent to oldest.

Number 8 is the reason that backwards compatibility is stuck at iOS/Safari 12.2. There is a workaround, but it requires a change to the template structure and the way that structure is parsed. The two structures are not compatible, so I'll wait to see if anyone needs iOS 11 or 10 support. The limit is iOS 10.3, the first release to support custom HTML elements. Support for iOS 12 goes all the way back to iPhone 5s, which is the first 64bit iPhone, so I'm hoping this is not a serious issue for anyone.

Numbers 1, 5, and 7 occur a total of five times, all in the apps, not in the library itself. I worked around them all in-place. Babel uses polyfills for these and I'd rather avoid that. The six workarounds are tiny.

Numbers 2, 3, and 4 are transpiled by Babel. See the babel.config.json file in the root folder of the repo.

Number 6 is a template SVG/CSS issue that the built-in template works around. The CSS is up to you, as is the template file in the end.

1. Array.prototype.at() - iOS 15.4. Thankfully it's only in the one test app. Worked around manually. Commented with //@
2. static class fields - iOS 14.5. Even observedAttributes has to be moved outside the class. Handled by babel-plugin-private-to-public.
3. ?? nullish coalescing assignment operator - iOS 14. Handled by @babel/plugin-transform-nullish-coalescing-operator.
4. ?. optional chaining operator - iOS 13.4. Handled by @babel/plugin-transform-optional-chaining
5. String.prototype.replaceAll()- iOS 13.4. Twice in apps/common.js and once in the input-num app. Worked around in-situ with replace(/"old"/g, "new");. Commented with //&
6. part and ::part - iOS 13.4. Added to templates: built-in styles that you can override with ::part.
7. Array.prototype.flat() - iOS 12. Only in multi-state/index.js::load(), in one spot. Worked around in-place. Commented with //~
8. SVG href vs xlink:href - iOS 12.2. But there is a bigger problem: iOS11 doesn't seem to support use elements at all in the shadow DOM. A workaround would require a different template structure and code that uses visibility for multiple elements instead of href for a single element.