diff --git a/Base/res/ladybird/inspector.html b/Base/res/ladybird/inspector.html new file mode 100644 index 00000000000..3d997cacb57 --- /dev/null +++ b/Base/res/ladybird/inspector.html @@ -0,0 +1,87 @@ + + + + + Inspector + + + + + +
+
+
+
+ +
+ + + +
+ +
+ +
+
+ +
+
+ +
+
+ +
+ +
+
+
+ +
+ + + + + +
+ +
+
+
+ +
+ + + + + +
+ +
+
+ +
+
+
+
+ + + +
+
+
+ + @COMPUTED_STYLE@ + @RESOVLED_STYLE@ + @CUSTOM_PROPERTIES@ + +
+
+
+
+
+ + + + diff --git a/Ladybird/cmake/ResourceFiles.cmake b/Ladybird/cmake/ResourceFiles.cmake index 26b5a8b217f..39699911a2b 100644 --- a/Ladybird/cmake/ResourceFiles.cmake +++ b/Ladybird/cmake/ResourceFiles.cmake @@ -63,6 +63,7 @@ list(TRANSFORM BROWSER_ICONS PREPEND "${LADYBIRD_SOURCE_DIR}/Base/res/icons/brow set(WEB_RESOURCES about.html inspector.css + inspector.html inspector.js newtab.html ) diff --git a/Userland/Libraries/LibWebView/InspectorClient.cpp b/Userland/Libraries/LibWebView/InspectorClient.cpp index 9e3fcd7ccad..34a30176247 100644 --- a/Userland/Libraries/LibWebView/InspectorClient.cpp +++ b/Userland/Libraries/LibWebView/InspectorClient.cpp @@ -8,6 +8,7 @@ #include #include #include +#include #include #include #include @@ -20,6 +21,7 @@ namespace WebView { +static constexpr auto INSPECTOR_HTML = "resource://ladybird/inspector.html"sv; static constexpr auto INSPECTOR_CSS = "resource://ladybird/inspector.css"sv; static constexpr auto INSPECTOR_JS = "resource://ladybird/inspector.js"sv; @@ -437,82 +439,10 @@ void InspectorClient::context_menu_copy_dom_node_attribute_value() void InspectorClient::load_inspector() { - StringBuilder builder; - - builder.append(R"~~~( - - - - - Inspector - - - - -
-
-
-
-
- - - -
-
- -
-
-
-
-
-
- -
-
-
-
-
- - - - - -
-
-
-
-
- - - - - -
-
-
-
-
-
-
- - - -
-
-
-)~~~", - INSPECTOR_CSS); + auto inspector_html = MUST(Core::Resource::load_from_uri(INSPECTOR_HTML)); auto generate_property_table = [&](auto name) { - builder.appendff(R"~~~( + return MUST(String::formatted(R"~~~(
@@ -526,33 +456,21 @@ void InspectorClient::load_inspector()
)~~~", - name); + name)); }; - generate_property_table("computed-style"sv); - generate_property_table("resolved-style"sv); - generate_property_table("custom-properties"sv); + StringBuilder builder; - builder.append(R"~~~( -
-
-
-
-
-
-)~~~"sv); + SourceGenerator generator { builder }; + generator.set("INSPECTOR_CSS"sv, INSPECTOR_CSS); + generator.set("INSPECTOR_JS"sv, INSPECTOR_JS); + generator.set("INSPECTOR_STYLE"sv, HTML_HIGHLIGHTER_STYLE); + generator.set("COMPUTED_STYLE"sv, generate_property_table("computed-style"sv)); + generator.set("RESOVLED_STYLE"sv, generate_property_table("resolved-style"sv)); + generator.set("CUSTOM_PROPERTIES"sv, generate_property_table("custom-properties"sv)); + generator.append(inspector_html->data()); - builder.appendff(R"~~~( -
-
- - - - -)~~~", - INSPECTOR_JS); - - m_inspector_web_view.load_html(builder.string_view()); + m_inspector_web_view.load_html(generator.as_string_view()); } template