There's a similar bug affecting comments reported on meta.SE. In both cases, the proper fix would be the same: apply the unicode-bidi: isolate
CSS3 style (with appropriate vendor prefixes, until browser support stabilizes) to any text-level elements that may contain arbitrary user input, like this:
.comment-copy, .comment-user, .user-details a {
unicode-bidi: embed; /* fallback for browsers that don't support isolate at all */
unicode-bidi: -moz-isolate;
unicode-bidi: -webkit-isolate;
unicode-bidi: isolate;
}
Unfortunately, using this CSS feature seems to break Safari in a really weird way, so, until somebody comes up with a workaround for this Safari bug (or until Safari fixes their CSS support), we'll need to rely on other hacks solutions.
One such solution could be to automatically append a Unicode Left-to-Right Mark (‎
) after the username link. This won't protect against malicious attacks using BiDi override characters, but those could be prevented simply by disallowing such characters in usernames, if they aren't already.
In this particular case, though, an even better solution might be to style the username link as an inline-block; this should stop any BiDi formatting from leaking out of it:
.user-details a { display: inline-block }
At least based on my quick testing in Firefox and Chrome, this change doesn't seem to have any adverse visual effects, and it does stop this bug from occurring.
(In any case, I've added the unicode-bidi: isolate
fix to the devel branch of SOUP, or rather, extended the existing fix that only applied to comments; since SOUP does not currently support Safari anyway, due to its lack of working user script support and my lack of access to Safari for testing, I don't really have to worry about working around Safari bugs.)