Edge renders bidi control characters (FSI/PDI) as mojibake

[tsjensen]

On Microsoft Edge (Windows), bidi control characters (FSI/PDI) are rendered as mojibake. This is really ugly and impacts overall element sizing for CivBuddy:

This bug is only relevant for the Edge browser.

[tsjensen]

This bug is actually an Edge bug, not a CivBuddy bug (bug id 6831905).
The FSI/PDI are (correctly) inserted by the fluent framework, who also have an issue about this (projectfluent/fluent.js#173).
CivBuddy does not use fluent.js directly, but rather as a transitive dependency from l20n.js, who also have an issue about this (l20n/l20n.js#178).

The fluent.js team appears to be under the impression that Microsoft has fixed the Edge bug, but on May 1, 2018, Microsoft changed their minds and decided against the fix, blaming some external entity.

So, the solution for now seems to be to disable bidi on a fluent.js level as described (incompletely) here, mostly by setting useIsolating: false in the fluent.js options. Unfortunately, l20n.js does not allow setting of fluent.js options.

[tsjensen]

Implemented a workaround. We now patch l20n during build so that the useIsolating flag is cleared upon l20n initialization. This is OK for CivBuddy, as we support no RTL locales, and the Edge bug no longer triggers.
One day, l20n might be extended to pass fluent options along from the application. When that happens, we'll upgrade and get rid of our patch.