mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-11-26 09:30:24 +00:00
Browser: Implement "Inspect Element" context menu action
This is finally working for OOPWV! :^)
This commit is contained in:
parent
1ccf10789e
commit
97379ace25
Notes:
sideshowbarker
2024-07-18 04:51:41 +09:00
Author: https://github.com/AtkinsSJ Commit: https://github.com/SerenityOS/serenity/commit/97379ace25e Pull-request: https://github.com/SerenityOS/serenity/pull/9725 Issue: https://github.com/SerenityOS/serenity/issues/8935 Reviewed-by: https://github.com/awesomekling
3 changed files with 44 additions and 14 deletions
|
@ -19,6 +19,26 @@
|
|||
|
||||
namespace Browser {
|
||||
|
||||
void InspectorWidget::set_inspected_node(i32 node_id)
|
||||
{
|
||||
if (!m_dom_json.has_value()) {
|
||||
// DOM Tree hasn't been loaded yet, so make a note to inspect it later.
|
||||
m_pending_inspect_node_id = node_id;
|
||||
return;
|
||||
}
|
||||
|
||||
auto* model = verify_cast<Web::DOMTreeModel>(m_dom_tree_view->model());
|
||||
auto index = model->index_for_node(node_id);
|
||||
if (!index.is_valid()) {
|
||||
dbgln("InspectorWidget told to inspect non-existent node, id={}", node_id);
|
||||
return;
|
||||
}
|
||||
|
||||
m_dom_tree_view->expand_all_parents_of(index);
|
||||
m_dom_tree_view->set_cursor(index, GUI::AbstractView::SelectionUpdate::Set);
|
||||
set_inspected_node(index);
|
||||
}
|
||||
|
||||
void InspectorWidget::set_inspected_node(GUI::ModelIndex const index)
|
||||
{
|
||||
auto* json = static_cast<JsonObject const*>(index.internal_data());
|
||||
|
@ -27,16 +47,10 @@ void InspectorWidget::set_inspected_node(GUI::ModelIndex const index)
|
|||
return;
|
||||
m_inspected_node_id = inspected_node;
|
||||
|
||||
m_dom_tree_view->set_cursor(index, GUI::AbstractView::SelectionUpdate::Set);
|
||||
m_dom_tree_view->expand_all_parents_of(index);
|
||||
|
||||
auto maybe_inspected_node_properties = m_web_view->inspect_dom_node(m_inspected_node_id);
|
||||
if (maybe_inspected_node_properties.has_value()) {
|
||||
auto inspected_node_properties = maybe_inspected_node_properties.value();
|
||||
m_inspected_node_specified_values_json = inspected_node_properties.specified_values_json;
|
||||
m_inspected_node_computed_values_json = inspected_node_properties.computed_values_json;
|
||||
m_style_table_view->set_model(Web::StylePropertiesModel::create(m_inspected_node_specified_values_json.value().view()));
|
||||
m_computed_style_table_view->set_model(Web::StylePropertiesModel::create(m_inspected_node_computed_values_json.value().view()));
|
||||
load_style_json(inspected_node_properties.specified_values_json, inspected_node_properties.computed_values_json);
|
||||
} else {
|
||||
m_inspected_node_specified_values_json.clear();
|
||||
m_inspected_node_computed_values_json.clear();
|
||||
|
@ -84,6 +98,12 @@ void InspectorWidget::set_dom_json(String json)
|
|||
|
||||
// FIXME: Support the LayoutTreeModel
|
||||
// m_layout_tree_view->set_model(Web::LayoutTreeModel::create(*document));
|
||||
|
||||
if (m_pending_inspect_node_id.has_value()) {
|
||||
i32 node_id = m_pending_inspect_node_id.value();
|
||||
m_pending_inspect_node_id.clear();
|
||||
set_inspected_node(node_id);
|
||||
}
|
||||
}
|
||||
|
||||
void InspectorWidget::set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json)
|
||||
|
@ -93,6 +113,11 @@ void InspectorWidget::set_dom_node_properties_json(i32 node_id, String specified
|
|||
return;
|
||||
}
|
||||
|
||||
load_style_json(specified_values_json, computed_values_json);
|
||||
}
|
||||
|
||||
void InspectorWidget::load_style_json(String specified_values_json, String computed_values_json)
|
||||
{
|
||||
m_inspected_node_specified_values_json = specified_values_json;
|
||||
m_inspected_node_computed_values_json = computed_values_json;
|
||||
m_style_table_view->set_model(Web::StylePropertiesModel::create(m_inspected_node_specified_values_json.value().view()));
|
||||
|
|
|
@ -18,14 +18,16 @@ public:
|
|||
virtual ~InspectorWidget();
|
||||
|
||||
void set_web_view(NonnullRefPtr<Web::OutOfProcessWebView> web_view) { m_web_view = web_view; }
|
||||
|
||||
void set_dom_json(String);
|
||||
void set_dom_node_properties_json(i32 node_id, String specified_values_json, String computed_values_json);
|
||||
|
||||
void set_inspected_node(i32 node_id);
|
||||
|
||||
private:
|
||||
InspectorWidget();
|
||||
|
||||
void set_inspected_node(GUI::ModelIndex);
|
||||
void load_style_json(String specified_values_json, String computed_values_json);
|
||||
|
||||
RefPtr<Web::OutOfProcessWebView> m_web_view;
|
||||
|
||||
|
@ -35,8 +37,9 @@ private:
|
|||
RefPtr<GUI::TableView> m_computed_style_table_view;
|
||||
|
||||
// Multi-process mode
|
||||
Optional<String> m_dom_json;
|
||||
Optional<i32> m_pending_inspect_node_id;
|
||||
i32 m_inspected_node_id;
|
||||
Optional<String> m_dom_json;
|
||||
Optional<String> m_inspected_node_specified_values_json;
|
||||
Optional<String> m_inspected_node_computed_values_json;
|
||||
};
|
||||
|
|
|
@ -340,9 +340,6 @@ Tab::Tab(BrowserWindow& window)
|
|||
hooks().on_context_menu_request = [&](auto& screen_position) {
|
||||
m_page_context_menu->popup(screen_position);
|
||||
};
|
||||
|
||||
// FIXME: This is temporary, until the OOPWV properly supports the DOM Inspector
|
||||
window.inspect_dom_node_action().set_enabled(false);
|
||||
}
|
||||
|
||||
Tab::~Tab()
|
||||
|
@ -469,7 +466,7 @@ BrowserWindow& Tab::window()
|
|||
return static_cast<BrowserWindow&>(*Widget::window());
|
||||
}
|
||||
|
||||
void Tab::show_inspector_window(Browser::Tab::InspectorTarget)
|
||||
void Tab::show_inspector_window(Browser::Tab::InspectorTarget inspector_target)
|
||||
{
|
||||
if (!m_dom_inspector_widget) {
|
||||
auto window = GUI::Window::construct(&this->window());
|
||||
|
@ -482,9 +479,14 @@ void Tab::show_inspector_window(Browser::Tab::InspectorTarget)
|
|||
m_dom_inspector_widget = window->set_main_widget<InspectorWidget>();
|
||||
m_dom_inspector_widget->set_web_view(*m_web_content_view);
|
||||
}
|
||||
|
||||
m_web_content_view->inspect_dom_tree();
|
||||
|
||||
if (inspector_target == InspectorTarget::HoveredElement) {
|
||||
Optional<i32> hovered_node = m_web_content_view->get_hovered_node_id();
|
||||
VERIFY(hovered_node.has_value());
|
||||
m_dom_inspector_widget->set_inspected_node(hovered_node.value());
|
||||
}
|
||||
|
||||
auto* window = m_dom_inspector_widget->window();
|
||||
window->show();
|
||||
window->move_to_front();
|
||||
|
|
Loading…
Reference in a new issue