Browser+WebContent: Fixup some DOM inspector weirdness

This fixes a few things I noticed whilst working on the inspector
for Ladybird.

1.
The computed and resolved values were being passed swapped around
from the inspect_dom_node() IPC call. I.e. computed values were
passed as resolved values and vice versa. This was then fixed by
swapping them again in the InspectorWidget (two errors canceled out).

2.
Resolved values were called "specified values" seemingly only in the
inspect_dom_node() IPC calls. This was a little confusing so I've
renamed them to back to "resolved values" for consistency.

3.
The inspector took and stored the DOM JSON strings unnecessarily,
all the models immediately parse the JSON and don't need the strings
to hang around.
This commit is contained in:
MacDue 2022-12-18 22:49:09 +00:00 committed by Tim Flynn
parent e3ad5731f7
commit 3de5dcf383
Notes: sideshowbarker 2024-07-17 03:03:37 +09:00
9 changed files with 39 additions and 58 deletions

View file

@ -23,7 +23,7 @@ namespace Browser {
void InspectorWidget::set_selection(Selection selection)
{
if (!m_dom_json.has_value()) {
if (!m_dom_loaded) {
// DOM Tree hasn't been loaded yet, so make a note to inspect it later.
m_pending_selection = move(selection);
return;
@ -32,7 +32,7 @@ void InspectorWidget::set_selection(Selection selection)
auto* model = verify_cast<WebView::DOMTreeModel>(m_dom_tree_view->model());
auto index = model->index_for_node(selection.dom_node_id, selection.pseudo_element);
if (!index.is_valid()) {
dbgln("InspectorWidget told to inspect non-existent node: {}", selection.to_deprecated_string());
dbgln("InspectorWidget told to inspect non-existent node: {}", selection.to_string());
return;
}
@ -64,7 +64,7 @@ void InspectorWidget::set_selection(GUI::ModelIndex const index)
auto maybe_inspected_node_properties = m_web_view->inspect_dom_node(m_selection.dom_node_id, m_selection.pseudo_element);
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);
load_style_json(inspected_node_properties.computed_values_json, inspected_node_properties.resolved_values_json, inspected_node_properties.custom_properties_json);
update_node_box_model(inspected_node_properties.node_box_sizing_json);
} else {
clear_style_json();
@ -126,60 +126,49 @@ void InspectorWidget::select_default_node()
m_dom_tree_view->set_cursor({}, GUI::AbstractView::SelectionUpdate::ClearIfNotSelected);
}
void InspectorWidget::set_dom_json(DeprecatedString json)
void InspectorWidget::set_dom_json(StringView json)
{
if (m_dom_json.has_value() && m_dom_json.value() == json)
return;
m_dom_json = json;
m_dom_tree_view->set_model(WebView::DOMTreeModel::create(m_dom_json->view(), *m_dom_tree_view));
if (m_pending_selection.has_value()) {
m_dom_tree_view->set_model(WebView::DOMTreeModel::create(json, *m_dom_tree_view));
if (m_pending_selection.has_value())
set_selection(m_pending_selection.release_value());
} else {
else
select_default_node();
}
m_dom_loaded = true;
}
void InspectorWidget::clear_dom_json()
{
m_dom_json.clear();
m_dom_tree_view->set_model(nullptr);
clear_style_json();
m_dom_loaded = false;
}
void InspectorWidget::set_dom_node_properties_json(Selection selection, DeprecatedString specified_values_json, DeprecatedString computed_values_json, DeprecatedString custom_properties_json, DeprecatedString node_box_sizing_json)
void InspectorWidget::set_dom_node_properties_json(Selection selection, StringView computed_values_json, StringView resolved_values_json, StringView custom_properties_json, StringView node_box_sizing_json)
{
if (selection != m_selection) {
dbgln("Got data for the wrong node id! Wanted ({}), got ({})", m_selection.to_deprecated_string(), selection.to_deprecated_string());
dbgln("Got data for the wrong node id! Wanted ({}), got ({})", m_selection.to_string(), selection.to_string());
return;
}
load_style_json(specified_values_json, computed_values_json, custom_properties_json);
load_style_json(computed_values_json, resolved_values_json, custom_properties_json);
update_node_box_model(node_box_sizing_json);
}
void InspectorWidget::load_style_json(DeprecatedString specified_values_json, DeprecatedString computed_values_json, DeprecatedString custom_properties_json)
void InspectorWidget::load_style_json(StringView computed_values_json, StringView resolved_values_json, StringView custom_properties_json)
{
m_selection_specified_values_json = specified_values_json;
m_computed_style_table_view->set_model(WebView::StylePropertiesModel::create(m_selection_specified_values_json.value().view()));
m_computed_style_table_view->set_model(WebView::StylePropertiesModel::create(computed_values_json));
m_computed_style_table_view->set_searchable(true);
m_selection_computed_values_json = computed_values_json;
m_resolved_style_table_view->set_model(WebView::StylePropertiesModel::create(m_selection_computed_values_json.value().view()));
m_resolved_style_table_view->set_model(WebView::StylePropertiesModel::create(resolved_values_json));
m_resolved_style_table_view->set_searchable(true);
m_selection_custom_properties_json = custom_properties_json;
m_custom_properties_table_view->set_model(WebView::StylePropertiesModel::create(m_selection_custom_properties_json.value().view()));
m_custom_properties_table_view->set_model(WebView::StylePropertiesModel::create(custom_properties_json));
m_custom_properties_table_view->set_searchable(true);
}
void InspectorWidget::update_node_box_model(Optional<DeprecatedString> node_box_sizing_json)
void InspectorWidget::update_node_box_model(StringView node_box_sizing_json)
{
if (!node_box_sizing_json.has_value()) {
return;
}
auto json_or_error = JsonValue::from_string(node_box_sizing_json.value());
auto json_or_error = JsonValue::from_string(node_box_sizing_json);
if (json_or_error.is_error() || !json_or_error.value().is_object()) {
return;
}
@ -214,13 +203,8 @@ void InspectorWidget::clear_node_box_model()
void InspectorWidget::clear_style_json()
{
m_selection_specified_values_json.clear();
m_computed_style_table_view->set_model(nullptr);
m_selection_computed_values_json.clear();
m_resolved_style_table_view->set_model(nullptr);
m_selection_custom_properties_json.clear();
m_custom_properties_table_view->set_model(nullptr);
m_element_size_view->set_box_model({});

View file

@ -9,12 +9,12 @@
#pragma once
#include "ElementSizePreviewWidget.h"
#include <AK/String.h>
#include <LibGUI/Widget.h>
#include <LibWeb/CSS/Selector.h>
#include <LibWeb/Forward.h>
#include <LibWeb/Layout/BoxModelMetrics.h>
#include <LibWebView/Forward.h>
namespace Browser {
class InspectorWidget final : public GUI::Widget {
@ -29,20 +29,20 @@ public:
return dom_node_id == other.dom_node_id && pseudo_element == other.pseudo_element;
}
DeprecatedString to_deprecated_string() const
ErrorOr<String> to_string() const
{
if (pseudo_element.has_value())
return DeprecatedString::formatted("id: {}, pseudo: {}", dom_node_id, Web::CSS::pseudo_element_name(pseudo_element.value()));
return DeprecatedString::formatted("id: {}", dom_node_id);
return String::formatted("id: {}, pseudo: {}", dom_node_id, Web::CSS::pseudo_element_name(pseudo_element.value()));
return String::formatted("id: {}", dom_node_id);
}
};
virtual ~InspectorWidget() = default;
void set_web_view(NonnullRefPtr<WebView::OutOfProcessWebView> web_view) { m_web_view = web_view; }
void set_dom_json(DeprecatedString);
void set_dom_json(StringView);
void clear_dom_json();
void set_dom_node_properties_json(Selection, DeprecatedString specified_values_json, DeprecatedString computed_values_json, DeprecatedString custom_properties_json, DeprecatedString node_box_sizing_json);
void set_dom_node_properties_json(Selection, StringView computed_values_json, StringView resolved_values_json, StringView custom_properties_json, StringView node_box_sizing_json);
void set_selection(Selection);
void select_default_node();
@ -51,8 +51,8 @@ private:
InspectorWidget();
void set_selection(GUI::ModelIndex);
void load_style_json(DeprecatedString specified_values_json, DeprecatedString computed_values_json, DeprecatedString custom_properties_json);
void update_node_box_model(Optional<DeprecatedString> node_box_sizing_json);
void load_style_json(StringView computed_values_json, StringView resolved_values_json, StringView custom_properties_json);
void update_node_box_model(StringView node_box_sizing_json);
void clear_style_json();
void clear_node_box_model();
@ -66,12 +66,9 @@ private:
Web::Layout::BoxModelMetrics m_node_box_sizing;
Optional<DeprecatedString> m_dom_json;
Optional<Selection> m_pending_selection;
Selection m_selection;
Optional<DeprecatedString> m_selection_specified_values_json;
Optional<DeprecatedString> m_selection_computed_values_json;
Optional<DeprecatedString> m_selection_custom_properties_json;
bool m_dom_loaded { false };
};
}

View file

@ -416,10 +416,10 @@ void OutOfProcessWebView::notify_server_did_get_dom_tree(DeprecatedString const&
on_get_dom_tree(dom_tree);
}
void OutOfProcessWebView::notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing)
void OutOfProcessWebView::notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing)
{
if (on_get_dom_node_properties)
on_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties, node_box_sizing);
on_get_dom_node_properties(node_id, computed_style, resolved_style, custom_properties, node_box_sizing);
}
void OutOfProcessWebView::notify_server_did_output_js_console_message(i32 message_index)
@ -577,8 +577,8 @@ Optional<OutOfProcessWebView::DOMNodeProperties> OutOfProcessWebView::inspect_do
if (!response.has_style())
return {};
return DOMNodeProperties {
.specified_values_json = response.specified_style(),
.computed_values_json = response.computed_style(),
.resolved_values_json = response.resolved_style(),
.custom_properties_json = response.custom_properties(),
.node_box_sizing_json = response.node_box_sizing()
};

View file

@ -44,8 +44,8 @@ public:
void inspect_dom_tree();
struct DOMNodeProperties {
DeprecatedString specified_values_json;
DeprecatedString computed_values_json;
DeprecatedString resolved_values_json;
DeprecatedString custom_properties_json;
DeprecatedString node_box_sizing_json;
};
@ -96,7 +96,7 @@ public:
Function<void(Web::DOM::Document*)> on_set_document;
Function<void(const AK::URL&, DeprecatedString const&)> on_get_source;
Function<void(DeprecatedString const&)> on_get_dom_tree;
Function<void(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing)> on_get_dom_node_properties;
Function<void(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString 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<DeprecatedString> const& message_types, Vector<DeprecatedString> const& messages)> on_get_js_console_messages;
Function<Vector<Web::Cookie::Cookie>(AK::URL const& url)> on_get_all_cookies;
@ -169,7 +169,7 @@ private:
virtual void notify_server_did_request_dismiss_dialog(Badge<WebContentClient>) override;
virtual void notify_server_did_get_source(const AK::URL& url, DeprecatedString const& source) override;
virtual void notify_server_did_get_dom_tree(DeprecatedString const& dom_tree) override;
virtual void notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing) override;
virtual void notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing) override;
virtual void notify_server_did_output_js_console_message(i32 message_index) override;
virtual void notify_server_did_get_js_console_messages(i32 start_index, Vector<DeprecatedString> const& message_types, Vector<DeprecatedString> const& messages) override;
virtual void notify_server_did_change_favicon(Gfx::Bitmap const& favicon) override;

View file

@ -49,7 +49,7 @@ public:
virtual void notify_server_did_request_dismiss_dialog(Badge<WebContentClient>) = 0;
virtual void notify_server_did_get_source(const AK::URL& url, DeprecatedString const& source) = 0;
virtual void notify_server_did_get_dom_tree(DeprecatedString const& dom_tree) = 0;
virtual void notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing) = 0;
virtual void notify_server_did_get_dom_node_properties(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing) = 0;
virtual void notify_server_did_output_js_console_message(i32 message_index) = 0;
virtual void notify_server_did_get_js_console_messages(i32 start_index, Vector<DeprecatedString> const& message_types, Vector<DeprecatedString> const& messages) = 0;
virtual void notify_server_did_change_favicon(Gfx::Bitmap const& favicon) = 0;

View file

@ -161,9 +161,9 @@ void WebContentClient::did_get_dom_tree(DeprecatedString const& dom_tree)
m_view.notify_server_did_get_dom_tree(dom_tree);
}
void WebContentClient::did_get_dom_node_properties(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing)
void WebContentClient::did_get_dom_node_properties(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing)
{
m_view.notify_server_did_get_dom_node_properties(node_id, specified_style, computed_style, custom_properties, node_box_sizing);
m_view.notify_server_did_get_dom_node_properties(node_id, computed_style, resolved_style, custom_properties, node_box_sizing);
}
void WebContentClient::did_output_js_console_message(i32 message_index)

View file

@ -53,7 +53,7 @@ private:
virtual void did_request_image_context_menu(Gfx::IntPoint, AK::URL const&, DeprecatedString const&, unsigned, Gfx::ShareableBitmap const&) override;
virtual void did_get_source(AK::URL const&, DeprecatedString const&) override;
virtual void did_get_dom_tree(DeprecatedString const&) override;
virtual void did_get_dom_node_properties(i32 node_id, DeprecatedString const& specified_style, DeprecatedString const& computed_style, DeprecatedString const& custom_properties, DeprecatedString const& node_box_sizing) override;
virtual void did_get_dom_node_properties(i32 node_id, DeprecatedString const& computed_style, DeprecatedString const& resolved_style, DeprecatedString const& custom_properties, DeprecatedString 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<DeprecatedString> const& message_types, Vector<DeprecatedString> const& messages) override;
virtual void did_change_favicon(Gfx::ShareableBitmap const&) override;

View file

@ -37,7 +37,7 @@ endpoint WebContentClient
did_request_dismiss_dialog() =|
did_get_source(URL url, DeprecatedString source) =|
did_get_dom_tree(DeprecatedString dom_tree) =|
did_get_dom_node_properties(i32 node_id, DeprecatedString specified_style, DeprecatedString computed_style, DeprecatedString custom_properties, DeprecatedString node_box_sizing_json) =|
did_get_dom_node_properties(i32 node_id, DeprecatedString computed_style, DeprecatedString resolved_style, DeprecatedString custom_properties, DeprecatedString node_box_sizing_json) =|
did_change_favicon(Gfx::ShareableBitmap favicon) =|
did_request_all_cookies(URL url) => (Vector<Web::Cookie::Cookie> cookies)
did_request_named_cookie(URL url, DeprecatedString name) => (Optional<Web::Cookie::Cookie> cookie)

View file

@ -36,7 +36,7 @@ endpoint WebContentServer
debug_request(DeprecatedString request, DeprecatedString argument) =|
get_source() =|
inspect_dom_tree() =|
inspect_dom_node(i32 node_id, Optional<Web::CSS::Selector::PseudoElement> pseudo_element) => (bool has_style, DeprecatedString specified_style, DeprecatedString computed_style, DeprecatedString custom_properties, DeprecatedString node_box_sizing)
inspect_dom_node(i32 node_id, Optional<Web::CSS::Selector::PseudoElement> pseudo_element) => (bool has_style, DeprecatedString computed_style, DeprecatedString resolved_style, DeprecatedString custom_properties, DeprecatedString node_box_sizing)
get_hovered_node_id() => (i32 node_id)
js_console_input(DeprecatedString js_source) =|
js_console_request_messages(i32 start_index) =|