copy: Style KaTeX annotations to be included in copy HTML.

We've for a while been finding that copy/paste of LaTeX only worked if
we had a more JS-heavy copy handler that directly copies the HTML/text
using events, rather than just allowing the browser's native copying
logic to do its thing.

We've discovered the bug was that the `<annotation>` tag in MathML is
not rendered in some browsers which results in default copy behavior
of the browser breaking KaTeX copy-pasting and quoting by omitting the
`<annotation>` in the copied HTML as Chrome and possibly other
browsers select only what is visible.

From https://www.w3.org/TR/selection-api/

> Chrome 16 dev behaves as you'd expect given its Selection
implementation. It refuses to select anything that's not visible, so
it's almost always wrong. Opera 11.50 just does nothing in all my
tests, as usual.

This can be observed in the `paste_html` fixtures present in
https://github.com/zulip/zulip/pull/33993#issuecomment-2725417637.

We fix this by simply overriding the `display:none` property from the
<annotation> tag in the user agent stylesheet, which lets the browser
select and ultimately copy it which results in the annotation being
present in the `paste_html` and restore the working of KaTeX
quoting/copy-pasting.

This appears to have no visible impact, since browsers don't actually
have a way to display the annotations.
This commit is contained in:
apoorvapendse
2025-03-14 12:01:51 +05:30
committed by Tim Abbott
parent a4fff91e96
commit 353f57e518

View File

@@ -280,6 +280,16 @@
overflow: auto hidden;
}
.katex-mathml annotation {
/* Because annotations are never displayable, browser user-agent
stylesheets mark them as not displayable, which has the
side effect of having them not be included in the HTML
version of copying the content. Override this, so KaTeX can
be copy/pasted within Zulip. */
user-select: all;
display: inline;
}
.tex-error {
color: hsl(0deg 0% 50%);
}