summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--Userland/Applications/Browser/CMakeLists.txt1
-rw-r--r--Userland/Applications/Browser/ElementSizePreviewWidget.cpp108
-rw-r--r--Userland/Applications/Browser/ElementSizePreviewWidget.h31
-rw-r--r--Userland/Applications/Browser/InspectorWidget.cpp45
-rw-r--r--Userland/Applications/Browser/InspectorWidget.h8
-rw-r--r--Userland/Applications/Browser/Tab.cpp4
-rw-r--r--Userland/Libraries/LibWeb/OutOfProcessWebView.cpp7
-rw-r--r--Userland/Libraries/LibWeb/OutOfProcessWebView.h3
-rw-r--r--Userland/Libraries/LibWeb/WebContentClient.cpp4
-rw-r--r--Userland/Libraries/LibWeb/WebContentClient.h2
-rw-r--r--Userland/Libraries/LibWeb/WebViewHooks.h2
-rw-r--r--Userland/Services/WebContent/ConnectionFromClient.cpp33
-rw-r--r--Userland/Services/WebContent/WebContentClient.ipc2
-rw-r--r--Userland/Services/WebContent/WebContentServer.ipc2
14 files changed, 234 insertions, 18 deletions
diff --git a/Userland/Applications/Browser/CMakeLists.txt b/Userland/Applications/Browser/CMakeLists.txt
index 47f1ce133a..42a91864eb 100644
--- a/Userland/Applications/Browser/CMakeLists.txt
+++ b/Userland/Applications/Browser/CMakeLists.txt
@@ -21,6 +21,7 @@ set(SOURCES
CookiesTabGML.h
DownloadWidget.cpp
EditBookmarkGML.h
+ ElementSizePreviewWidget.cpp
History.cpp
IconBag.cpp
InspectorWidget.cpp
diff --git a/Userland/Applications/Browser/ElementSizePreviewWidget.cpp b/Userland/Applications/Browser/ElementSizePreviewWidget.cpp
new file mode 100644
index 0000000000..c8c628af18
--- /dev/null
+++ b/Userland/Applications/Browser/ElementSizePreviewWidget.cpp
@@ -0,0 +1,108 @@
+/*
+ * Copyright (c) 2022, Michiel Vrins
+ *
+ * SPDX-License-Identifier: BSD-2-Clause
+ */
+
+#include "ElementSizePreviewWidget.h"
+#include <LibGUI/Painter.h>
+
+namespace Browser {
+
+void ElementSizePreviewWidget::paint_event(GUI::PaintEvent& event)
+{
+ GUI::Frame::paint_event(event);
+ GUI::Painter painter(*this);
+ painter.fill_rect(frame_inner_rect(), Color::White);
+
+ int outer_margin = 10;
+ int text_width_padding = 4;
+ int text_height_padding = 4;
+ int inner_content_width = 100;
+ int inner_content_height = max(15, font().glyph_height() + 2 * text_height_padding);
+
+ auto format_size_text = [&](float size) {
+ return String::formatted("{:.4f}", size);
+ };
+
+ auto compute_text_string_width = [&](float size) {
+ return font().width(format_size_text(size)) + 2 * text_width_padding;
+ };
+
+ int margin_left_width = max(25, compute_text_string_width(m_node_box_sizing.margin.left));
+ int margin_right_width = max(25, compute_text_string_width(m_node_box_sizing.margin.right));
+
+ int border_left_width = max(25, compute_text_string_width(m_node_box_sizing.border.left));
+ int border_right_width = max(25, compute_text_string_width(m_node_box_sizing.border.right));
+
+ int padding_left_width = max(25, compute_text_string_width(m_node_box_sizing.padding.left));
+ int padding_right_width = max(25, compute_text_string_width(m_node_box_sizing.padding.right));
+
+ // outer rect
+ auto margin_rect = to_widget_rect({ outer_margin,
+ outer_margin,
+ inner_content_width + border_left_width + border_right_width + margin_left_width + margin_right_width + padding_left_width + padding_right_width,
+ inner_content_height * 7 });
+
+ Gfx::IntSize content_size { margin_rect.width() + 2 * outer_margin, margin_rect.height() + 2 * outer_margin };
+ set_content_size(content_size);
+ auto border_rect = margin_rect;
+ border_rect.take_from_left(margin_left_width);
+ border_rect.take_from_right(margin_right_width);
+ border_rect.shrink({ 0, inner_content_height * 2 });
+ auto padding_rect = border_rect;
+ padding_rect.take_from_left(border_left_width);
+ padding_rect.take_from_right(border_right_width);
+ padding_rect.shrink({ 0, inner_content_height * 2 });
+ auto content_rect = padding_rect;
+ content_rect.take_from_left(padding_left_width);
+ content_rect.take_from_right(padding_right_width);
+ content_rect.shrink({ 0, inner_content_height * 2 });
+
+ auto draw_borders = [&](Gfx::IntRect rect, Color color) {
+ painter.fill_rect(rect.take_from_top(1), color);
+ painter.fill_rect(rect.take_from_right(1), color);
+ painter.fill_rect(rect.take_from_bottom(1), color);
+ painter.fill_rect(rect.take_from_left(1), color);
+ };
+
+ auto draw_size_texts = [&](Gfx::IntRect rect, Color color, Web::Layout::PixelBox box) {
+ painter.draw_text(rect, format_size_text(box.top), font(), Gfx::TextAlignment::TopCenter, color);
+ painter.draw_text(rect, format_size_text(box.right), font(), Gfx::TextAlignment::CenterRight, color);
+ painter.draw_text(rect, format_size_text(box.bottom), font(), Gfx::TextAlignment::BottomCenter, color);
+ painter.draw_text(rect, format_size_text(box.left), font(), Gfx::TextAlignment::CenterLeft, color);
+ };
+
+ // paint margin box
+ painter.fill_rect(margin_rect, Color(249, 204, 157));
+ draw_borders(margin_rect, Color::Black);
+ margin_rect.shrink(1, 1, 1, 1);
+ margin_rect.shrink(text_height_padding, text_width_padding, text_height_padding, text_width_padding);
+ painter.draw_text(margin_rect, "margin", font(), Gfx::TextAlignment::TopLeft, Color::Black);
+ draw_size_texts(margin_rect, Color::Black, m_node_box_sizing.margin);
+
+ // paint border box
+ painter.fill_rect(border_rect, Color(253, 221, 155));
+ draw_borders(border_rect, Color::Black);
+ border_rect.shrink(1, 1, 1, 1);
+ border_rect.shrink(text_height_padding, text_width_padding, text_height_padding, text_width_padding);
+ painter.draw_text(border_rect, "border", font(), Gfx::TextAlignment::TopLeft, Color::Black);
+ draw_size_texts(border_rect, Color::Black, m_node_box_sizing.border);
+
+ // paint padding box
+ painter.fill_rect(padding_rect, Color(195, 208, 139));
+ draw_borders(padding_rect, Color::Black);
+ padding_rect.shrink(1, 1, 1, 1);
+ padding_rect.shrink(text_height_padding, text_width_padding, text_height_padding, text_width_padding);
+ painter.draw_text(padding_rect, "padding", font(), Gfx::TextAlignment::TopLeft, Color::Black);
+ draw_size_texts(padding_rect, Color::Black, m_node_box_sizing.padding);
+
+ // paint content box
+ auto content_size_text = String::formatted("{}x{}", m_node_content_width, m_node_content_height);
+ painter.fill_rect(content_rect, Color(140, 182, 192));
+ draw_borders(content_rect, Color::Black);
+ content_rect.shrink(1, 1, 1, 1);
+ painter.draw_text(content_rect, content_size_text, font(), Gfx::TextAlignment::Center, Color::Black);
+}
+
+}
diff --git a/Userland/Applications/Browser/ElementSizePreviewWidget.h b/Userland/Applications/Browser/ElementSizePreviewWidget.h
new file mode 100644
index 0000000000..691aaf00a7
--- /dev/null
+++ b/Userland/Applications/Browser/ElementSizePreviewWidget.h
@@ -0,0 +1,31 @@
+/*
+ * Copyright (c) 2022, Michiel Vrins
+ *
+ * SPDX-License-Identifier: BSD-2-Clause
+ */
+
+#pragma once
+
+#include <LibGUI/AbstractScrollableWidget.h>
+#include <LibGUI/Frame.h>
+#include <LibGfx/Rect.h>
+#include <LibWeb/Layout/BoxModelMetrics.h>
+
+namespace Browser {
+
+class ElementSizePreviewWidget final : public GUI::AbstractScrollableWidget {
+ C_OBJECT(ElementSizePreviewWidget)
+
+public:
+ void set_box_model(Web::Layout::BoxModelMetrics box_model) { m_node_box_sizing = box_model; };
+ void set_node_content_height(float height) { m_node_content_height = height; };
+ void set_node_content_width(float width) { m_node_content_width = width; };
+
+private:
+ virtual void paint_event(GUI::PaintEvent&) override;
+ Web::Layout::BoxModelMetrics m_node_box_sizing;
+ float m_node_content_height = 0;
+ float m_node_content_width = 0;
+};
+
+}
diff --git a/Userland/Applications/Browser/InspectorWidget.cpp b/Userland/Applications/Browser/InspectorWidget.cpp
index a2d72b3687..cea07ab32d 100644
--- a/Userland/Applications/Browser/InspectorWidget.cpp
+++ b/Userland/Applications/Browser/InspectorWidget.cpp
@@ -7,6 +7,7 @@
*/
#include "InspectorWidget.h"
+#include "ElementSizePreviewWidget.h"
#include <LibGUI/BoxLayout.h>
#include <LibGUI/Splitter.h>
#include <LibGUI/TabWidget.h>
@@ -52,6 +53,7 @@ void InspectorWidget::set_inspected_node(GUI::ModelIndex const index)
if (maybe_inspected_node_properties.has_value()) {
auto inspected_node_properties = maybe_inspected_node_properties.value();
load_style_json(inspected_node_properties.specified_values_json, inspected_node_properties.computed_values_json, inspected_node_properties.custom_properties_json);
+ update_node_box_model(inspected_node_properties.node_box_sizing_json);
} else {
clear_style_json();
}
@@ -93,6 +95,12 @@ InspectorWidget::InspectorWidget()
custom_properties_table_container.layout()->set_margins({ 4, 4, 4, 4 });
m_custom_properties_table_view = custom_properties_table_container.add<GUI::TableView>();
+ auto& element_size = bottom_tab_widget.add_tab<GUI::Widget>("Element");
+ element_size.set_layout<GUI::VerticalBoxLayout>();
+ element_size.layout()->set_margins({ 4, 4, 4, 4 });
+ m_element_size_view = element_size.add<ElementSizePreviewWidget>();
+ m_element_size_view->set_should_hide_unnecessary_scrollbars(true);
+
m_dom_tree_view->set_focus(true);
}
@@ -129,7 +137,7 @@ void InspectorWidget::clear_dom_json()
clear_style_json();
}
-void InspectorWidget::set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json, String custom_properties_json)
+void InspectorWidget::set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json, String custom_properties_json, String node_box_sizing_json)
{
if (node_id != m_inspected_node_id) {
dbgln("Got data for the wrong node id! Wanted {}, got {}", m_inspected_node_id, node_id);
@@ -137,6 +145,7 @@ void InspectorWidget::set_dom_node_properties_json(i32 node_id, String specified
}
load_style_json(specified_values_json, computed_values_json, custom_properties_json);
+ update_node_box_model(node_box_sizing_json);
}
void InspectorWidget::load_style_json(String specified_values_json, String computed_values_json, String custom_properties_json)
@@ -151,6 +160,36 @@ void InspectorWidget::load_style_json(String specified_values_json, String compu
m_custom_properties_table_view->set_model(Web::StylePropertiesModel::create(m_inspected_node_custom_properties_json.value().view()));
}
+void InspectorWidget::update_node_box_model(Optional<String> node_box_sizing_json)
+{
+ if (!node_box_sizing_json.has_value()) {
+ return;
+ }
+ auto json_or_error = JsonValue::from_string(node_box_sizing_json.value());
+ if (json_or_error.is_error() || !json_or_error.value().is_object()) {
+ return;
+ }
+ auto json_value = json_or_error.release_value();
+ const auto& json_object = json_value.as_object();
+
+ m_node_box_sizing.margin.top = json_object.get("margin_top").to_float();
+ m_node_box_sizing.margin.right = json_object.get("margin_right").to_float();
+ m_node_box_sizing.margin.bottom = json_object.get("margin_bottom").to_float();
+ m_node_box_sizing.margin.left = json_object.get("margin_left").to_float();
+ m_node_box_sizing.padding.top = json_object.get("padding_top").to_float();
+ m_node_box_sizing.padding.right = json_object.get("padding_right").to_float();
+ m_node_box_sizing.padding.bottom = json_object.get("padding_bottom").to_float();
+ m_node_box_sizing.padding.left = json_object.get("padding_left").to_float();
+ m_node_box_sizing.border.top = json_object.get("border_top").to_float();
+ m_node_box_sizing.border.right = json_object.get("border_right").to_float();
+ m_node_box_sizing.border.bottom = json_object.get("border_bottom").to_float();
+ m_node_box_sizing.border.left = json_object.get("border_left").to_float();
+
+ m_element_size_view->set_node_content_width(json_object.get("content_width").to_float());
+ m_element_size_view->set_node_content_height(json_object.get("content_height").to_float());
+ m_element_size_view->set_box_model(m_node_box_sizing);
+}
+
void InspectorWidget::clear_style_json()
{
m_inspected_node_specified_values_json.clear();
@@ -161,6 +200,10 @@ void InspectorWidget::clear_style_json()
m_inspected_node_custom_properties_json.clear();
m_custom_properties_table_view->set_model(nullptr);
+
+ m_element_size_view->set_box_model({});
+ m_element_size_view->set_node_content_width(0);
+ m_element_size_view->set_node_content_height(0);
}
}
diff --git a/Userland/Applications/Browser/InspectorWidget.h b/Userland/Applications/Browser/InspectorWidget.h
index cd02355150..3d7afe5001 100644
--- a/Userland/Applications/Browser/InspectorWidget.h
+++ b/Userland/Applications/Browser/InspectorWidget.h
@@ -8,8 +8,10 @@
#pragma once
+#include "ElementSizePreviewWidget.h"
#include <LibGUI/Widget.h>
#include <LibWeb/Forward.h>
+#include <LibWeb/Layout/BoxModelMetrics.h>
namespace Browser {
@@ -21,7 +23,7 @@ public:
void set_web_view(NonnullRefPtr<Web::OutOfProcessWebView> web_view) { m_web_view = web_view; }
void set_dom_json(String);
void clear_dom_json();
- void set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json, String custom_properties_json);
+ void set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json, String custom_properties_json, String node_box_sizing_json);
void set_inspected_node(i32 node_id);
void select_default_node();
@@ -31,6 +33,7 @@ private:
void set_inspected_node(GUI::ModelIndex);
void load_style_json(String specified_values_json, String computed_values_json, String custom_properties_json);
+ void update_node_box_model(Optional<String> node_box_sizing_json);
void clear_style_json();
RefPtr<Web::OutOfProcessWebView> m_web_view;
@@ -39,6 +42,9 @@ private:
RefPtr<GUI::TableView> m_style_table_view;
RefPtr<GUI::TableView> m_computed_style_table_view;
RefPtr<GUI::TableView> m_custom_properties_table_view;
+ RefPtr<ElementSizePreviewWidget> m_element_size_view;
+
+ Web::Layout::BoxModelMetrics m_node_box_sizing;
// Multi-process mode
Optional<i32> m_pending_inspect_node_id;
diff --git a/Userland/Applications/Browser/Tab.cpp b/Userland/Applications/Browser/Tab.cpp
index 36f596cfc8..1799010089 100644
--- a/Userland/Applications/Browser/Tab.cpp
+++ b/Userland/Applications/Browser/Tab.cpp
@@ -292,8 +292,8 @@ Tab::Tab(BrowserWindow& window)
m_dom_inspector_widget->set_dom_json(dom_tree);
};
- hooks().on_get_dom_node_properties = [this](auto node_id, auto& specified, auto& computed, auto& custom_properties) {
- m_dom_inspector_widget->set_dom_node_properties_json(node_id, specified, computed, custom_properties);
+ hooks().on_get_dom_node_properties = [this](auto node_id, auto& specified, auto& computed, auto& custom_properties, auto& node_box_sizing) {
+ m_dom_inspector_widget->set_dom_node_properties_json(node_id, specified, computed, custom_properties, node_box_sizing);
};
hooks().on_js_console_new_message = [this](auto message_index) {
diff --git a/Userland/Libraries/LibWeb/OutOfProcessWebView.cpp b/Userland/Libraries/LibWeb/OutOfProcessWebView.cpp
index a05bc72b6a..88c56d4180 100644
--- a/Userland/Libraries/LibWeb/OutOfProcessWebView.cpp
+++ b/Userland/Libraries/LibWeb/OutOfProcessWebView.cpp
@@ -354,10 +354,10 @@ void OutOfProcessWebView::notify_server_did_get_dom_tree(const String& dom_tree)
on_get_dom_tree(dom_tree);
}
-void OutOfProcessWebView::notify_server_did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties)
+void OutOfProcessWebView::notify_server_did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties, String const& node_box_sizing)
{
if (on_get_dom_node_properties)
- on_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties);
+ on_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties, node_box_sizing);
}
void OutOfProcessWebView::notify_server_did_output_js_console_message(i32 message_index)
@@ -441,7 +441,8 @@ Optional<OutOfProcessWebView::DOMNodeProperties> OutOfProcessWebView::inspect_do
return DOMNodeProperties {
.specified_values_json = response.specified_style(),
.computed_values_json = response.computed_style(),
- .custom_properties_json = response.custom_properties()
+ .custom_properties_json = response.custom_properties(),
+ .node_box_sizing_json = response.node_box_sizing()
};
}
diff --git a/Userland/Libraries/LibWeb/OutOfProcessWebView.h b/Userland/Libraries/LibWeb/OutOfProcessWebView.h
index 1f89dccbf8..8a4a430ad6 100644
--- a/Userland/Libraries/LibWeb/OutOfProcessWebView.h
+++ b/Userland/Libraries/LibWeb/OutOfProcessWebView.h
@@ -38,6 +38,7 @@ public:
String specified_values_json;
String computed_values_json;
String custom_properties_json;
+ String node_box_sizing_json;
};
Optional<DOMNodeProperties> inspect_dom_node(i32 node_id);
void clear_inspected_dom_node();
@@ -81,7 +82,7 @@ public:
String notify_server_did_request_prompt(Badge<WebContentClient>, const String& message, const String& default_);
void notify_server_did_get_source(const AK::URL& url, const String& source);
void notify_server_did_get_dom_tree(const String& dom_tree);
- void notify_server_did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties);
+ void notify_server_did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties, String const& node_box_sizing);
void notify_server_did_output_js_console_message(i32 message_index);
void notify_server_did_get_js_console_messages(i32 start_index, Vector<String> const& message_types, Vector<String> const& messages);
void notify_server_did_change_favicon(const Gfx::Bitmap& favicon);
diff --git a/Userland/Libraries/LibWeb/WebContentClient.cpp b/Userland/Libraries/LibWeb/WebContentClient.cpp
index 9220a61775..1787e94c09 100644
--- a/Userland/Libraries/LibWeb/WebContentClient.cpp
+++ b/Userland/Libraries/LibWeb/WebContentClient.cpp
@@ -146,9 +146,9 @@ void WebContentClient::did_get_dom_tree(String const& dom_tree)
m_view.notify_server_did_get_dom_tree(dom_tree);
}
-void WebContentClient::did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties)
+void WebContentClient::did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties, String const& node_box_sizing)
{
- m_view.notify_server_did_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties);
+ m_view.notify_server_did_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties, node_box_sizing);
}
void WebContentClient::did_output_js_console_message(i32 message_index)
diff --git a/Userland/Libraries/LibWeb/WebContentClient.h b/Userland/Libraries/LibWeb/WebContentClient.h
index cea2774b96..8c7ac2ed89 100644
--- a/Userland/Libraries/LibWeb/WebContentClient.h
+++ b/Userland/Libraries/LibWeb/WebContentClient.h
@@ -51,7 +51,7 @@ private:
virtual void did_request_image_context_menu(Gfx::IntPoint const&, AK::URL const&, String const&, unsigned, Gfx::ShareableBitmap const&) override;
virtual void did_get_source(AK::URL const&, String const&) override;
virtual void did_get_dom_tree(String const&) override;
- virtual void did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties) override;
+ virtual void did_get_dom_node_properties(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties, String const& node_box_sizing) override;
virtual void did_output_js_console_message(i32 message_index) override;
virtual void did_get_js_console_messages(i32 start_index, Vector<String> const& message_types, Vector<String> const& messages) override;
virtual void did_change_favicon(Gfx::ShareableBitmap const&) override;
diff --git a/Userland/Libraries/LibWeb/WebViewHooks.h b/Userland/Libraries/LibWeb/WebViewHooks.h
index c83afd34af..0a9630b78b 100644
--- a/Userland/Libraries/LibWeb/WebViewHooks.h
+++ b/Userland/Libraries/LibWeb/WebViewHooks.h
@@ -29,7 +29,7 @@ public:
Function<void(DOM::Document*)> on_set_document;
Function<void(const AK::URL&, const String&)> on_get_source;
Function<void(const String&)> on_get_dom_tree;
- Function<void(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties)> on_get_dom_node_properties;
+ Function<void(i32 node_id, String const& specified_style, String const& computed_style, String const& custom_properties, String const& node_box_sizing)> on_get_dom_node_properties;
Function<void(i32 message_id)> on_js_console_new_message;
Function<void(i32 start_index, Vector<String> const& message_types, Vector<String> const& messages)> on_get_js_console_messages;
Function<String(const AK::URL& url, Cookie::Source source)> on_get_cookie;
diff --git a/Userland/Services/WebContent/ConnectionFromClient.cpp b/Userland/Services/WebContent/ConnectionFromClient.cpp
index ecdeecaa63..e40e1054f5 100644
--- a/Userland/Services/WebContent/ConnectionFromClient.cpp
+++ b/Userland/Services/WebContent/ConnectionFromClient.cpp
@@ -258,7 +258,7 @@ Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect
Web::DOM::Node* node = Web::DOM::Node::from_id(node_id);
if (!node) {
- return { false, "", "", "" };
+ return { false, "", "", "", "" };
}
node->document().set_inspected_node(node);
@@ -266,7 +266,7 @@ Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect
if (node->is_element()) {
auto& element = verify_cast<Web::DOM::Element>(*node);
if (!element.specified_css_values())
- return { false, "", "", "" };
+ return { false, "", "", "", "" };
auto serialize_json = [](Web::CSS::StyleProperties const& properties) -> String {
StringBuilder builder;
@@ -301,14 +301,39 @@ Messages::WebContentServer::InspectDomNodeResponse ConnectionFromClient::inspect
return builder.to_string();
};
+ auto serialize_node_box_sizing_json = [](Web::DOM::Element const& element) -> String {
+ if (!element.layout_node()) {
+ return "";
+ }
+ auto box_model = static_cast<Web::Layout::Box const&>(*element.layout_node()).box_model();
+ StringBuilder builder;
+ auto serializer = MUST(JsonObjectSerializer<>::try_create(builder));
+ MUST(serializer.add("padding_top", box_model.padding.top));
+ MUST(serializer.add("padding_right", box_model.padding.right));
+ MUST(serializer.add("padding_bottom", box_model.padding.bottom));
+ MUST(serializer.add("padding_left", box_model.padding.left));
+ MUST(serializer.add("margin_top", box_model.margin.top));
+ MUST(serializer.add("margin_right", box_model.margin.top));
+ MUST(serializer.add("margin_bottom", box_model.margin.top));
+ MUST(serializer.add("margin_left", box_model.margin.top));
+ MUST(serializer.add("border_top", box_model.border.top));
+ MUST(serializer.add("border_right", box_model.border.right));
+ MUST(serializer.add("border_bottom", box_model.border.bottom));
+ MUST(serializer.add("border_left", box_model.border.left));
+ MUST(serializer.add("content_width", static_cast<Web::Layout::Box const&>(*element.layout_node()).content_width()));
+ MUST(serializer.add("content_height", static_cast<Web::Layout::Box const&>(*element.layout_node()).content_height()));
+ MUST(serializer.finish());
+ return builder.to_string();
+ };
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);
- return { true, specified_values_json, computed_values_json, custom_properties_json };
+ String node_box_sizing_json = serialize_node_box_sizing_json(element);
+ return { true, specified_values_json, computed_values_json, custom_properties_json, node_box_sizing_json };
}
- return { false, "", "", "" };
+ return { false, "", "", "", "" };
}
Messages::WebContentServer::GetHoveredNodeIdResponse ConnectionFromClient::get_hovered_node_id()
diff --git a/Userland/Services/WebContent/WebContentClient.ipc b/Userland/Services/WebContent/WebContentClient.ipc
index 82f90abae8..04ab5c4ecf 100644
--- a/Userland/Services/WebContent/WebContentClient.ipc
+++ b/Userland/Services/WebContent/WebContentClient.ipc
@@ -29,7 +29,7 @@ endpoint WebContentClient
did_request_prompt(String message, String default_) => (String response)
did_get_source(URL url, String source) =|
did_get_dom_tree(String dom_tree) =|
- did_get_dom_node_properties(i32 node_id, String specified_style, String computed_style, String custom_properties) =|
+ did_get_dom_node_properties(i32 node_id, String specified_style, String computed_style, String custom_properties, String node_box_sizing_json) =|
did_change_favicon(Gfx::ShareableBitmap favicon) =|
did_request_cookie(URL url, u8 source) => (String cookie)
did_set_cookie(URL url, Web::Cookie::ParsedCookie cookie, u8 source) =|
diff --git a/Userland/Services/WebContent/WebContentServer.ipc b/Userland/Services/WebContent/WebContentServer.ipc
index dbe200512b..5c8988a39c 100644
--- a/Userland/Services/WebContent/WebContentServer.ipc
+++ b/Userland/Services/WebContent/WebContentServer.ipc
@@ -29,7 +29,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)
+ inspect_dom_node(i32 node_id) => (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) =|