HTML: prevent gratuitious emojification on iOS.

iOS chooses to render a number of Unicode entities,
including '↩', as big colorful emoji.  This can be
defeated by appending Unicode
VARIATION SELECTOR-15'/'VARIATION SELECTOR-16'.
So we now append this character when escaping
strings, for both '↩' and '↔'.

If other characters prove problematic, they can
simply be added to needsVariationSelector.

Closes #5469.
This commit is contained in:
John MacFarlane 2019-04-30 22:17:31 -07:00
parent 2b2d9baaa8
commit f11d0c9dc8
4 changed files with 21 additions and 12 deletions

View file

@ -108,11 +108,20 @@ defaultWriterState = WriterState {stNotes= [], stMath = False, stQuotes = False,
strToHtml :: String -> Html
strToHtml ('\'':xs) = preEscapedString "\'" `mappend` strToHtml xs
strToHtml ('"' :xs) = preEscapedString "\"" `mappend` strToHtml xs
strToHtml xs@(_:_) = case break (\c -> c == '\'' || c == '"') xs of
strToHtml (x:xs) | needsVariationSelector x
= preEscapedString [x, '\xFE0E'] `mappend` strToHtml xs
strToHtml xs@(_:_) = case break (\c -> c == '\'' || c == '"' ||
needsVariationSelector c) xs of
(_ ,[]) -> toHtml xs
(ys,zs) -> toHtml ys `mappend` strToHtml zs
strToHtml [] = ""
-- See #5469: this prevents iOS from substituting emojis.
needsVariationSelector :: Char -> Bool
needsVariationSelector '↩' = True
needsVariationSelector '↔' = True
needsVariationSelector _ = False
-- | Hard linebreak.
nl :: WriterOptions -> Html
nl opts = if writerWrapText opts == WrapNone

View file

@ -6,7 +6,7 @@ This.^[Has a footnote.]
<section class="footnotes" role="doc-endnotes">
<hr />
<ol>
<li id="foofn1" role="doc-endnote"><p>Has a footnote.<a href="#foofnref1" class="footnote-back" role="doc-backlink"></a></p></li>
<li id="foofn1" role="doc-endnote"><p>Has a footnote.<a href="#foofnref1" class="footnote-back" role="doc-backlink"></a></p></li>
</ol>
</section>
```

View file

@ -535,14 +535,14 @@ Blah
<div class="footnotes">
<hr />
<ol>
<li id="fn1"><p>Here is the footnote. It can go anywhere after the footnote reference. It need not be placed at the end of the document.<a href="#fnref1" class="footnote-back">↩</a></p></li>
<li id="fn1"><p>Here is the footnote. It can go anywhere after the footnote reference. It need not be placed at the end of the document.<a href="#fnref1" class="footnote-back">↩</a></p></li>
<li id="fn2"><p>Heres the long note. This one contains multiple blocks.</p>
<p>Subsequent blocks are indented to show that they belong to the footnote (as with list items).</p>
<pre><code> { &lt;code&gt; }</code></pre>
<p>If you want, you can indent every line, but you can also be lazy and just indent the first line of each block.<a href="#fnref2" class="footnote-back">↩</a></p></li>
<li id="fn3"><p>This is <em>easier</em> to type. Inline notes may contain <a href="http://google.com">links</a> and <code>]</code> verbatim characters, as well as [bracketed text].<a href="#fnref3" class="footnote-back">↩</a></p></li>
<li id="fn4"><p>In quote.<a href="#fnref4" class="footnote-back">↩</a></p></li>
<li id="fn5"><p>In list.<a href="#fnref5" class="footnote-back">↩</a></p></li>
<p>If you want, you can indent every line, but you can also be lazy and just indent the first line of each block.<a href="#fnref2" class="footnote-back">↩</a></p></li>
<li id="fn3"><p>This is <em>easier</em> to type. Inline notes may contain <a href="http://google.com">links</a> and <code>]</code> verbatim characters, as well as [bracketed text].<a href="#fnref3" class="footnote-back">↩</a></p></li>
<li id="fn4"><p>In quote.<a href="#fnref4" class="footnote-back">↩</a></p></li>
<li id="fn5"><p>In list.<a href="#fnref5" class="footnote-back">↩</a></p></li>
</ol>
</div>
</body>

View file

@ -537,14 +537,14 @@ Blah
<section class="footnotes" role="doc-endnotes">
<hr />
<ol>
<li id="fn1" role="doc-endnote"><p>Here is the footnote. It can go anywhere after the footnote reference. It need not be placed at the end of the document.<a href="#fnref1" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn1" role="doc-endnote"><p>Here is the footnote. It can go anywhere after the footnote reference. It need not be placed at the end of the document.<a href="#fnref1" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn2" role="doc-endnote"><p>Heres the long note. This one contains multiple blocks.</p>
<p>Subsequent blocks are indented to show that they belong to the footnote (as with list items).</p>
<pre><code> { &lt;code&gt; }</code></pre>
<p>If you want, you can indent every line, but you can also be lazy and just indent the first line of each block.<a href="#fnref2" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn3" role="doc-endnote"><p>This is <em>easier</em> to type. Inline notes may contain <a href="http://google.com">links</a> and <code>]</code> verbatim characters, as well as [bracketed text].<a href="#fnref3" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn4" role="doc-endnote"><p>In quote.<a href="#fnref4" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn5" role="doc-endnote"><p>In list.<a href="#fnref5" class="footnote-back" role="doc-backlink">↩</a></p></li>
<p>If you want, you can indent every line, but you can also be lazy and just indent the first line of each block.<a href="#fnref2" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn3" role="doc-endnote"><p>This is <em>easier</em> to type. Inline notes may contain <a href="http://google.com">links</a> and <code>]</code> verbatim characters, as well as [bracketed text].<a href="#fnref3" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn4" role="doc-endnote"><p>In quote.<a href="#fnref4" class="footnote-back" role="doc-backlink">↩</a></p></li>
<li id="fn5" role="doc-endnote"><p>In list.<a href="#fnref5" class="footnote-back" role="doc-backlink">↩</a></p></li>
</ol>
</section>
</body>