Tweak HTML pretty printing (#5745)

2 files changed, 96 insertions, 50 deletions

diff --git a/crates/typst-html/src/encode.rs b/crates/typst-html/src/encode.rs
index 71422a0f..612f923f 100644
--- a/crates/typst-html/src/encode.rs
+++ b/crates/typst-html/src/encode.rs
@@ -2,7 +2,7 @@ use std::fmt::Write;
 
 use typst_library::diag::{bail, At, SourceResult, StrResult};
 use typst_library::foundations::Repr;
-use typst_library::html::{charsets, tag, HtmlDocument, HtmlElement, HtmlNode};
+use typst_library::html::{charsets, tag, HtmlDocument, HtmlElement, HtmlNode, HtmlTag};
 use typst_library::layout::Frame;
 use typst_syntax::Span;
 
@@ -20,10 +20,11 @@ pub fn html(document: &HtmlDocument) -> SourceResult<String> {
 
 #[derive(Default)]
 struct Writer {
+    /// The output buffer.
     buf: String,
-    /// current indentation level
+    /// The current indentation level
     level: usize,
-    /// pretty printing enabled?
+    /// Whether pretty printing is enabled.
     pretty: bool,
 }
 
@@ -88,26 +89,32 @@ fn write_element(w: &mut Writer, element: &HtmlElement) -> SourceResult<()> {
 
     let pretty = w.pretty;
     if !element.children.is_empty() {
-        w.pretty &= is_pretty(element);
+        let pretty_inside = allows_pretty_inside(element.tag)
+            && element.children.iter().any(|node| match node {
+                HtmlNode::Element(child) => wants_pretty_around(child.tag),
+                _ => false,
+            });
+
+        w.pretty &= pretty_inside;
         let mut indent = w.pretty;
 
         w.level += 1;
         for c in &element.children {
-            let pretty_child = match c {
+            let pretty_around = match c {
                 HtmlNode::Tag(_) => continue,
-                HtmlNode::Element(element) => is_pretty(element),
+                HtmlNode::Element(child) => w.pretty && wants_pretty_around(child.tag),
                 HtmlNode::Text(..) | HtmlNode::Frame(_) => false,
             };
 
-            if core::mem::take(&mut indent) || pretty_child {
+            if core::mem::take(&mut indent) || pretty_around {
                 write_indent(w);
             }
             write_node(w, c)?;
-            indent = pretty_child;
+            indent = pretty_around;
         }
         w.level -= 1;
 
-        write_indent(w)
+        write_indent(w);
     }
     w.pretty = pretty;
 
@@ -118,12 +125,27 @@ fn write_element(w: &mut Writer, element: &HtmlElement) -> SourceResult<()> {
     Ok(())
 }
 
-/// Whether the element should be pretty-printed.
-fn is_pretty(element: &HtmlElement) -> bool {
-    matches!(
-        element.tag,
-        tag::meta | tag::table | tag::thead | tag::tbody | tag::tfoot | tag::tr
-    ) || tag::is_block_by_default(element.tag)
+/// Whether we are allowed to add an extra newline at the start and end of the
+/// element's contents.
+///
+/// Technically, users can change CSS `display` properties such that the
+/// insertion of whitespace may actually impact the visual output. For example,
+/// <https://www.w3.org/TR/css-text-3/#example-af2745cd> shows how adding CSS
+/// rules to `<p>` can make it sensitive to whitespace. For this reason, we
+/// should also respect the `style` tag in the future.
+fn allows_pretty_inside(tag: HtmlTag) -> bool {
+    (tag::is_block_by_default(tag) && tag != tag::pre)
+        || tag::is_tabular_by_default(tag)
+        || tag == tag::li
+}
+
+/// Whether newlines should be added before and after the element if the parent
+/// allows it.
+///
+/// In contrast to `allows_pretty_inside`, which is purely spec-driven, this is
+/// more subjective and depends on preference.
+fn wants_pretty_around(tag: HtmlTag) -> bool {
+    allows_pretty_inside(tag) || tag::is_metadata(tag) || tag == tag::pre
 }
 
 /// Escape a character.
diff --git a/crates/typst-library/src/html/dom.rs b/crates/typst-library/src/html/dom.rs
index 2acd839d..1b725d54 100644
--- a/crates/typst-library/src/html/dom.rs
+++ b/crates/typst-library/src/html/dom.rs
@@ -475,17 +475,55 @@ pub mod tag {
         wbr
     }
 
+    /// Whether this is a void tag whose associated element may not have a
+    /// children.
+    pub fn is_void(tag: HtmlTag) -> bool {
+        matches!(
+            tag,
+            self::area
+                | self::base
+                | self::br
+                | self::col
+                | self::embed
+                | self::hr
+                | self::img
+                | self::input
+                | self::link
+                | self::meta
+                | self::param
+                | self::source
+                | self::track
+                | self::wbr
+        )
+    }
+
+    /// Whether this is a tag containing raw text.
+    pub fn is_raw(tag: HtmlTag) -> bool {
+        matches!(tag, self::script | self::style)
+    }
+
+    /// Whether this is a tag containing escapable raw text.
+    pub fn is_escapable_raw(tag: HtmlTag) -> bool {
+        matches!(tag, self::textarea | self::title)
+    }
+
+    /// Whether an element is considered metadata.
+    pub fn is_metadata(tag: HtmlTag) -> bool {
+        matches!(
+            tag,
+            self::base
+                | self::link
+                | self::meta
+                | self::noscript
+                | self::script
+                | self::style
+                | self::template
+                | self::title
+        )
+    }
+
     /// Whether nodes with the tag have the CSS property `display: block` by
     /// default.
-    ///
-    /// If this is true, then pretty-printing can insert spaces around such
-    /// nodes and around the contents of such nodes.
-    ///
-    /// However, when users change the properties of such tags via CSS, the
-    /// insertion of whitespace may actually impact the visual output; for
-    /// example, <https://www.w3.org/TR/css-text-3/#example-af2745cd> shows how
-    /// adding CSS rules to `<p>` can make it sensitive to whitespace. In such
-    /// cases, users should disable pretty-printing.
     pub fn is_block_by_default(tag: HtmlTag) -> bool {
         matches!(
             tag,
@@ -572,37 +610,23 @@ pub mod tag {
         )
     }
 
-    /// Whether this is a void tag whose associated element may not have a
-    /// children.
-    pub fn is_void(tag: HtmlTag) -> bool {
+    /// Whether nodes with the tag have the CSS property `display: table(-.*)?`
+    /// by default.
+    pub fn is_tabular_by_default(tag: HtmlTag) -> bool {
         matches!(
             tag,
-            self::area
-                | self::base
-                | self::br
+            self::table
+                | self::thead
+                | self::tbody
+                | self::tfoot
+                | self::tr
+                | self::th
+                | self::td
+                | self::caption
                 | self::col
-                | self::embed
-                | self::hr
-                | self::img
-                | self::input
-                | self::link
-                | self::meta
-                | self::param
-                | self::source
-                | self::track
-                | self::wbr
+                | self::colgroup
         )
     }
-
-    /// Whether this is a tag containing raw text.
-    pub fn is_raw(tag: HtmlTag) -> bool {
-        matches!(tag, self::script | self::style)
-    }
-
-    /// Whether this is a tag containing escapable raw text.
-    pub fn is_escapable_raw(tag: HtmlTag) -> bool {
-        matches!(tag, self::textarea | self::title)
-    }
 }
 
 /// Predefined constants for HTML attributes.