From f1395a2c3859fce1daddb385582433c072ebf052 Mon Sep 17 00:00:00 2001
From: Timothy Flynn <trflynn89@pm.me>
Date: Tue, 3 Sep 2024 14:14:06 -0400
Subject: [PATCH] LibWebView: Properly handle new lines inside styled
 view-source elements

When we want to inject a CSS counter for a line, we need to be sure to
handle if we had previously opened a styled span for the current source
substring. For example, if we see a new line in the middle of a comment,
we will have previously opened the following tag:

    <span class="comment">

So when injecting a new line and the <span class="line"> element (for
CSS counters), we need to close the previous span and insert a newly
opened tag to continue using the style.
---
 .../LibWebView/SourceHighlighter.cpp          | 31 ++++++++++++-------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/Userland/Libraries/LibWebView/SourceHighlighter.cpp b/Userland/Libraries/LibWebView/SourceHighlighter.cpp
index b45ca6ba11e..1a97a49483b 100644
--- a/Userland/Libraries/LibWebView/SourceHighlighter.cpp
+++ b/Userland/Libraries/LibWebView/SourceHighlighter.cpp
@@ -79,27 +79,36 @@ String highlight_source(URL::URL const& url, StringView source)
 
         auto segment = source.substring_view(previous_position, end_position - previous_position);
 
-        if (class_name.has_value())
-            builder.appendff("<span class=\"{}\">"sv, *class_name);
+        auto append_class_start = [&]() {
+            if (class_name.has_value())
+                builder.appendff("<span class=\"{}\">"sv, *class_name);
+        };
+        auto append_class_end = [&]() {
+            if (class_name.has_value())
+                builder.append("</span>"sv);
+        };
+
+        append_class_start();
 
         for (auto code_point : Utf8View { segment }) {
-            if (code_point == '&')
+            if (code_point == '&') {
                 builder.append("&amp;"sv);
-            else if (code_point == 0xA0)
+            } else if (code_point == 0xA0) {
                 builder.append("&nbsp;"sv);
-            else if (code_point == '<')
+            } else if (code_point == '<') {
                 builder.append("&lt;"sv);
-            else if (code_point == '>')
+            } else if (code_point == '>') {
                 builder.append("&gt;"sv);
-            else if (code_point == '\n')
+            } else if (code_point == '\n') {
+                append_class_end();
                 builder.append("</span>\n<span class=\"line\">"sv);
-            else
+                append_class_start();
+            } else {
                 builder.append_code_point(code_point);
+            }
         }
 
-        if (class_name.has_value())
-            builder.append("</span>"sv);
-
+        append_class_end();
         previous_position = end_position;
     };