Browser+LibWeb+WebContent: Show style for pseudo-elements :^)

This expands the InspectorWidget::Selection to include an optional
PseudoElement, which is then passed over IPC to request style
information for it.

As noted, this has some pretty big limitations because pseudo-elements
don't have DOM nodes:
- Declared style has to be recalculated when it's requested.
- We don't display the computed style.
- We don't display custom properties.

3 files changed, 22 insertions, 3 deletions

diff --git a/Userland/Services/WebContent/ConnectionFromClient.cpp b/Userland/Services/WebContent/ConnectionFromClient.cpp
index e40e1054f5..009dc65f8e 100644
--- a/Userland/Services/WebContent/ConnectionFromClient.cpp
+++ b/Userland/Services/WebContent/ConnectionFromClient.cpp
@@ -245,7 +245,7 @@ void ConnectionFromClient::inspect_dom_tree()
     }
 }
 
-Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect_dom_node(i32 node_id)
+Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect_dom_node(i32 node_id, Optional<Web::CSS::Selector::PseudoElement> const& pseudo_element)
 {
     auto& top_context = page().top_level_browsing_context();
 
@@ -261,6 +261,7 @@ Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect
         return { false, "", "", "", "" };
     }
 
+    // FIXME: Pass the pseudo-element here.
     node->document().set_inspected_node(node);
 
     if (node->is_element()) {
@@ -326,6 +327,23 @@ Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect
             MUST(serializer.finish());
             return builder.to_string();
         };
+
+        if (pseudo_element.has_value()) {
+            auto pseudo_element_node = element.get_pseudo_element_node(pseudo_element.value());
+            if (pseudo_element_node.is_null())
+                return { false, "", "", "", "" };
+
+            // FIXME: Pseudo-elements only exist as Layout::Nodes, which don't have style information
+            //        in a format we can use. So, we run the StyleComputer again to get the specified
+            //        values, and have to ignore the computed values and custom properties.
+            auto pseudo_element_style = page().focused_context().active_document()->style_computer().compute_style(element, pseudo_element);
+            String specified_values_json = serialize_json(pseudo_element_style);
+            String computed_values_json = "{}";
+            String custom_properties_json = "{}";
+            String node_box_sizing_json = "{}";
+            return { true, specified_values_json, computed_values_json, custom_properties_json, node_box_sizing_json };
+        }
+
         String specified_values_json = serialize_json(*element.specified_css_values());
         String computed_values_json = serialize_json(element.computed_style());
         String custom_properties_json = serialize_custom_properties_json(element);
diff --git a/Userland/Services/WebContent/ConnectionFromClient.h b/Userland/Services/WebContent/ConnectionFromClient.h
index ba2bbaa072..18a3a9ab8a 100644
--- a/Userland/Services/WebContent/ConnectionFromClient.h
+++ b/Userland/Services/WebContent/ConnectionFromClient.h
@@ -55,7 +55,7 @@ private:
     virtual void debug_request(String const&, String const&) override;
     virtual void get_source() override;
     virtual void inspect_dom_tree() override;
-    virtual Messages::WebContentServer::InspectDomNodeResponse inspect_dom_node(i32) override;
+    virtual Messages::WebContentServer::InspectDomNodeResponse inspect_dom_node(i32 node_id, Optional<Web::CSS::Selector::PseudoElement> const& pseudo_element) override;
     virtual Messages::WebContentServer::GetHoveredNodeIdResponse get_hovered_node_id() override;
     virtual Messages::WebContentServer::DumpLayoutTreeResponse dump_layout_tree() override;
     virtual void set_content_filters(Vector<String> const&) override;
diff --git a/Userland/Services/WebContent/WebContentServer.ipc b/Userland/Services/WebContent/WebContentServer.ipc
index 5c8988a39c..b5a10d8711 100644
--- a/Userland/Services/WebContent/WebContentServer.ipc
+++ b/Userland/Services/WebContent/WebContentServer.ipc
@@ -2,6 +2,7 @@
 #include <LibCore/AnonymousBuffer.h>
 #include <LibGfx/ShareableBitmap.h>
 #include <LibWeb/CSS/PreferredColorScheme.h>
+#include <LibWeb/CSS/Selector.h>
 
 endpoint WebContentServer
 {
@@ -29,7 +30,7 @@ endpoint WebContentServer
     debug_request(String request, String argument) =|
     get_source() =|
     inspect_dom_tree() =|
-    inspect_dom_node(i32 node_id) => (bool has_style, String specified_style, String computed_style, String custom_properties, String node_box_sizing)
+    inspect_dom_node(i32 node_id, Optional<Web::CSS::Selector::PseudoElement> pseudo_element) => (bool has_style, String specified_style, String computed_style, String custom_properties, String node_box_sizing)
     get_hovered_node_id() => (i32 node_id)
     js_console_input(String js_source) =|
     js_console_request_messages(i32 start_index) =|