Support underlines in codeblock syntax highlighting (#221)

* refactor(tests): Allow for customizing test interpreter

* fix(style): Support basic underlines in spans

src/color.rs

@@ -81,6 +81,11 @@ impl Theme {
             code_highlighter,
         }
     }
+
+    pub fn code_highlighter(mut self, theme: SyntectTheme) -> Self {
+        self.code_highlighter = theme;
+        self
+    }
 }
 
 #[derive(Clone, Debug, PartialEq, Eq)]

src/interpreter/html.rs

@@ -106,6 +106,11 @@ impl<'style> Iterator for StyleIter<'style> {
                 return Some(Style::FontWeight(w));
             } else if let Some(s) = part.strip_prefix("font-style:").and_then(FontStyle::new) {
                 return Some(Style::FontStyle(s));
+            } else if let Some(d) = part
+                .strip_prefix("text-decoration:")
+                .and_then(TextDecoration::new)
+            {
+                return Some(Style::TextDecoration(d));
             }
         }
     }
@@ -116,6 +121,7 @@ pub enum Style {
     Color(u32),
     FontWeight(FontWeight),
     FontStyle(FontStyle),
+    TextDecoration(TextDecoration),
 }
 
 #[derive(Default, PartialEq, Eq)]
@@ -150,6 +156,22 @@ impl FontStyle {
     }
 }
 
+#[derive(Default, PartialEq, Eq)]
+pub enum TextDecoration {
+    #[default]
+    Normal,
+    Underline,
+}
+
+impl TextDecoration {
+    pub fn new(s: &str) -> Option<Self> {
+        match s {
+            "underline" => Some(Self::Underline),
+            _ => None,
+        }
+    }
+}
+
 pub enum HeaderType {
     H1,
     H2,

src/interpreter/mod.rs

@@ -15,7 +15,7 @@ use crate::table::Table;
 use crate::text::{Text, TextBox};
 use crate::utils::{markdown_to_html, Align};
 use crate::{Element, ImageCache, InlyneEvent};
-use html::{Attr, AttrIter, FontStyle, FontWeight, Style, StyleIter};
+use html::{Attr, AttrIter, FontStyle, FontWeight, Style, StyleIter, TextDecoration};
 
 use glyphon::FamilyOwned;
 use html5ever::tendril::*;
@@ -35,6 +35,7 @@ struct State {
     span_color: [f32; 4],
     span_weight: FontWeight,
     span_style: FontStyle,
+    span_decor: TextDecoration,
     // Stores the row and a counter of newlines after each image
     inline_images: Option<(Row, usize)>,
     pending_anchor: Option<String>,
@@ -493,6 +494,7 @@ impl TokenSink for HtmlInterpreter {
                                     }
                                     Style::FontWeight(weight) => self.state.span_weight = weight,
                                     Style::FontStyle(style) => self.state.span_style = style,
+                                    Style::TextDecoration(decor) => self.state.span_decor = decor,
                                     _ => {}
                                 }
                             }
@@ -648,6 +650,7 @@ impl TokenSink for HtmlInterpreter {
                                 native_color(self.theme.code_color, &self.surface_format);
                             self.state.span_weight = FontWeight::default();
                             self.state.span_style = FontStyle::default();
+                            self.state.span_decor = TextDecoration::default();
                         }
                         "details" => {
                             self.push_current_textbox();
@@ -752,6 +755,9 @@ impl TokenSink for HtmlInterpreter {
                         if self.state.span_style == FontStyle::Italic {
                             text = text.make_italic(true);
                         }
+                        if self.state.span_decor == TextDecoration::Underline {
+                            text = text.make_underlined(true);
+                        }
                         //.with_size(18.)
                     }
                     for elem in self.state.element_stack.iter().rev() {

src/interpreter/snapshots/inlyne__interpreter__tests__aligned_table.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n| left default | left forced | centered | right | left default |\n| ------------ | :---------- | :------: | ----: | ------------ |\n| text         | text        |   text   |  text | text         |\n\n\n --- html\n\n<table>\n<thead>\n<tr>\n<th>left default</th>\n<th align=\"left\">left forced</th>\n<th align=\"center\">centered</th>\n<th align=\"right\">right</th>\n<th>left default</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>text</td>\n<td align=\"left\">text</td>\n<td align=\"center\">text</td>\n<td align=\"right\">text</td>\n<td>text</td>\n</tr>\n</tbody>\n</table>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     Spacer(

src/interpreter/snapshots/inlyne__interpreter__tests__bare_link_gets_autolinked.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\nIn a paragraph https://example.org\n\n- In a list https://example.org\n\n\n --- html\n\n<p>In a paragraph <a href=\"https://example.org\">https://example.org</a></p>\n<ul>\n<li>In a list <a href=\"https://example.org\">https://example.org</a></li>\n</ul>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__checklist_has_no_text_prefix.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
-description: " --- md\n\n- [x] Completed task\n- [ ] Incomplete task\n\n --- html\n\n<ul>\n<li><input type=\"checkbox\" disabled=\"\" checked=\"\" /> Completed task</li>\n<li><input type=\"checkbox\" disabled=\"\" /> Incomplete task</li>\n</ul>\n"
-expression: interpret_md(text)
+description: " --- md\n\n- [x] Completed task\n- [ ] Incomplete task\n\n --- html\n\n<ul>\n<li><input type=\"checkbox\" checked=\"\" disabled=\"\" /> Completed task</li>\n<li><input type=\"checkbox\" disabled=\"\" /> Incomplete task</li>\n</ul>\n"
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__code_block_bg_color.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n```\nFenced code block with no language tag\n```\n\n```rust\n// Rust code\nfn main() {}\n```\n\n --- html\n\n<pre style=\"background-color:#f6f8fa;\"><code><span style=\"color:#333333;\">Fenced code block with no language tag\n</span></code></pre>\n<pre style=\"background-color:#f6f8fa;\"><code class=\"language-rust\"><span style=\"color:#969896;\">// Rust code\n</span><span style=\"color:#a71d5d;\">fn </span><span style=\"color:#795da3;\">main</span><span style=\"color:#333333;\">() {}\n</span></code></pre>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__code_in_ordered_list.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n1. 1st item\n\n    ```rust\n    fn main() {}\n    ```\n\n2. 2nd item\n\n\n --- html\n\n<ol>\n<li>\n<p>1st item</p>\n<pre style=\"background-color:#f6f8fa;\"><code class=\"language-rust\"><span style=\"color:#a71d5d;\">fn </span><span style=\"color:#795da3;\">main</span><span style=\"color:#333333;\">() {}\n</span></code></pre>\n</li>\n<li>\n<p>2nd item</p>\n</li>\n</ol>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__footnotes_list_prefix.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
-description: " --- md\n\nThis sentence[^1] has two footnotes[^2]\n\n[^1]: 1st footnote\n[^2]: 2nd footnote\n\n --- html\n\n<p>This sentence<sup class=\"footnote-ref\"><a href=\"#fn-1\" id=\"fnref-1\" data-footnote-ref>1</a></sup> has two footnotes<sup class=\"footnote-ref\"><a href=\"#fn-2\" id=\"fnref-2\" data-footnote-ref>2</a></sup></p>\n<section class=\"footnotes\" data-footnotes>\n<ol>\n<li id=\"fn-1\">\n<p>1st footnote <a href=\"#fnref-1\" class=\"footnote-backref\" data-footnote-backref aria-label=\"Back to content\">↩</a></p>\n</li>\n<li id=\"fn-2\">\n<p>2nd footnote <a href=\"#fnref-2\" class=\"footnote-backref\" data-footnote-backref aria-label=\"Back to content\">↩</a></p>\n</li>\n</ol>\n</section>\n"
-expression: interpret_md(text)
+description: " --- md\n\nThis sentence[^1] has two footnotes[^2]\n\n[^1]: 1st footnote\n[^2]: 2nd footnote\n\n --- html\n\n<p>This sentence<sup class=\"footnote-ref\"><a href=\"#fn-1\" id=\"fnref-1\" data-footnote-ref>1</a></sup> has two footnotes<sup class=\"footnote-ref\"><a href=\"#fn-2\" id=\"fnref-2\" data-footnote-ref>2</a></sup></p>\n<section class=\"footnotes\" data-footnotes>\n<ol>\n<li id=\"fn-1\">\n<p>1st footnote <a href=\"#fnref-1\" class=\"footnote-backref\" data-footnote-backref data-footnote-backref-idx=\"1\" aria-label=\"Back to reference 1\">↩</a></p>\n</li>\n<li id=\"fn-2\">\n<p>2nd footnote <a href=\"#fnref-2\" class=\"footnote-backref\" data-footnote-backref data-footnote-backref-idx=\"2\" aria-label=\"Back to reference 2\">↩</a></p>\n</li>\n</ol>\n</section>\n"
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__handles_comma_in_info_str.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n```rust,ignore\nlet v = 1;\n```\n\n\n --- html\n\n<pre style=\"background-color:#f6f8fa;\"><code class=\"language-rust,ignore\"><span style=\"color:#a71d5d;\">let</span><span style=\"color:#333333;\"> v </span><span style=\"color:#a71d5d;\">= </span><span style=\"color:#0086b3;\">1</span><span style=\"color:#333333;\">;\n</span></code></pre>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__nested_ordered_list.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n1. 1st outer\n    1. 1st inner\n2. 2nd outer\n\n\n --- html\n\n<ol>\n<li>1st outer\n<ol>\n<li>1st inner</li>\n</ol>\n</li>\n<li>2nd outer</li>\n</ol>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__ordered_list_in_unordered.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n- bullet\n    1. 1st inner\n- bullet\n\n\n --- html\n\n<ul>\n<li>bullet\n<ol>\n<li>1st inner</li>\n</ol>\n</li>\n<li>bullet</li>\n</ul>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__para_in_ordered_list.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n1. 1st item\n\n    Nested paragraph\n\n2. 2nd item\n\n\n --- html\n\n<ol>\n<li>\n<p>1st item</p>\n<p>Nested paragraph</p>\n</li>\n<li>\n<p>2nd item</p>\n</li>\n</ol>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__toml_gets_highlighted.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
-description: " --- md\n\n```toml\nkey = 123\n```\n\n\n --- html\n\n<pre style=\"background-color:#f6f8fa;\"><code class=\"language-toml\"><span style=\"color:#63a35c;\">key </span><span style=\"color:#323232;\">= </span><span style=\"color:#0086b3;\">123\n</span></code></pre>\n"
-expression: interpret_md(text)
+description: " --- md\n\n```toml\nkey = 123\n```\n\n\n --- html\n\n<pre style=\"background-color:#f6f8fa;\"><code class=\"language-toml\"><span style=\"color:#63a35c;\">key </span><span style=\"color:#333333;\">= </span><span style=\"color:#0086b3;\">123\n</span></code></pre>\n"
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__underline_in_codeblock.snap

@@ -0,0 +1,50 @@
+---
+source: src/interpreter/tests.rs
+description: " --- md\n\n```rust\nuse std::io;\n```\n\n --- html\n\n<pre style=\"background-color:#282a36;\"><code class=\"language-rust\"><span style=\"color:#ff79c6;\">use </span><span style=\"text-decoration:underline;color:#66d9ef;\">std</span><span style=\"text-decoration:underline;color:#ff79c6;\">::</span><span style=\"color:#f8f8f2;\">io;\n</span></code></pre>\n"
+expression: "interpret_md_with_opts(text, opts)"
+---
+[
+    TextBox(
+        TextBox {
+            background_color: Some(Color { r: 0.02, g: 0.02, b: 0.04 }),
+            is_code_block: true,
+            texts: [
+                Text {
+                    text: "use ",
+                    font_family: Monospace,
+                    color: Some(Color { r: 1.00, g: 0.19, b: 0.56 }),
+                    ..
+                },
+                Text {
+                    text: "std",
+                    font_family: Monospace,
+                    color: Some(Color { r: 0.13, g: 0.69, b: 0.86 }),
+                    style: UNDERLINED ,
+                    ..
+                },
+                Text {
+                    text: "::",
+                    font_family: Monospace,
+                    color: Some(Color { r: 1.00, g: 0.19, b: 0.56 }),
+                    style: UNDERLINED ,
+                    ..
+                },
+                Text {
+                    text: "io;",
+                    font_family: Monospace,
+                    color: Some(Color { r: 0.94, g: 0.94, b: 0.89 }),
+                    ..
+                },
+                Text {
+                    text: "\n",
+                    default_color: Color(BLACK),
+                    ..
+                },
+            ],
+            ..
+        },
+    ),
+    Spacer(
+        InvisibleSpacer(5),
+    ),
+]

src/interpreter/snapshots/inlyne__interpreter__tests__unordered_list_in_ordered.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n1. 1st outer\n    - bullet\n2. 2nd outer\n\n\n --- html\n\n<ol>\n<li>1st outer\n<ul>\n<li>bullet</li>\n</ul>\n</li>\n<li>2nd outer</li>\n</ol>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     TextBox(

src/interpreter/snapshots/inlyne__interpreter__tests__yaml_frontmatter.snap

@@ -1,7 +1,7 @@
 ---
 source: src/interpreter/tests.rs
 description: " --- md\n\n---\ndate: 2018-05-01\ntags:\n  - another tag\n---\n# Markdown h1 header\n\n\n --- html\n\n<table>\n<thead>\n<tr>\n<th align=\"center\">date</th>\n<th align=\"center\">tags</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td align=\"center\">2018-05-01</td>\n<td align=\"center\">{Skipped nested table}</td>\n</tr>\n</tbody>\n</table>\n<h1>Markdown h1 header</h1>\n"
-expression: interpret_md(text)
+expression: "interpret_md_with_opts(text, opts)"
 ---
 [
     Spacer(