HtmlBoxWidget: help MuPDF with block elements it doesn't know

MuPDF's own stylesheet is incomplete, and doesn't specify that a few common (and uncommon) elements are display:block, so it would consider them inline, and render them badly (MuPDF also doesn't handle well <BR/> inside inline elements, so this fixes <br/> ones in these elements). Fix this in HtmlBoxWidget so it solves any issue in HTML dict and popup footnote. For popup footnotes, also include crengine internal block elements, as we may indeed get them in the HTML content.
4 weeks ago · 96312bfa10
parent 837b32906a
commit 96312bfa10
2 changed files with 21 additions and 3 deletions
--- a/frontend/ui/widget/footnotewidget.lua
+++ b/frontend/ui/widget/footnotewidget.lua
@ -72,6 +72,10 @@ body > li { list-style-type: none; }
 /* Remove any (possibly multiple) backlinks in Wikipedia EPUBs footnotes */
 .noprint { display: none; }

+/* Let MuPDF know about crengine internal block elements,
+ * so it doesn't render them inline */
+autoBoxing, floatBox, tabularBox { display: block; }
+
 /* Style some FB2 tags not known to MuPDF */
 strike, strikethrough { text-decoration: line-through; }
 underline   { text-decoration: underline; }
--- a/frontend/ui/widget/htmlboxwidget.lua
+++ b/frontend/ui/widget/htmlboxwidget.lua
@ -36,13 +36,27 @@ function HtmlBoxWidget:init()
    end
 end

-function HtmlBoxWidget:setContent(body, css, default_font_size, is_xhtml)
+-- These are generic "fixes" to MuPDF HTML stylesheet:
+-- - MuPDF doesn't set some elements as being display:block, and would
+--   consider them inline, and would badly handle <BR/> inside them.
+--   Note: this is a generic issue with <BR/> inside inline elements, see:
+--   https://github.com/koreader/koreader/issues/12258#issuecomment-2267629234
+local mupdf_css_fixes = [[
+article, aside, button, canvas, datalist, details, dialog, dir, fieldset, figcaption,
+figure, footer, form, frame, frameset, header, hgroup, iframe, legend, listing,
+main, map, marquee, multicol, nav, noembed, noframes, noscript, optgroup, output,
+plaintext, search, select, summary, template, textarea, video, xmp {
+  display: block;
+}
+]]
+
+function HtmlBoxWidget:setContent(body, css, default_font_size, is_xhtml, no_css_fixes)
    -- fz_set_user_css is tied to the context instead of the document so to easily support multiple
    -- HTML dictionaries with different CSS, we embed the stylesheet into the HTML instead of using
    -- that function.
    local head = ""
-    if css then
-        head = string.format("<head><style>%s</style></head>", css)
+    if css or not no_css_fixes then
+        head = string.format("<head><style>\n%s\n%s</style></head>", mupdf_css_fixes, css or "")
    end
    local html = string.format("<html>%s<body>%s</body></html>", head, body)