/* * Copyright (c) 2018-2020, Andreas Kling * Copyright (c) 2021-2022, Sam Atkins * Copyright (c) 2022, the SerenityOS developers. * * SPDX-License-Identifier: BSD-2-Clause */ #include "InspectorWidget.h" #include "ModelAdapter.h" #include #include #include #include #include #include namespace Browser { NonnullRefPtr InspectorWidget::create(WebView::OutOfProcessWebView& content_view) { return adopt_ref(*new (nothrow) InspectorWidget(content_view)); } InspectorWidget::InspectorWidget(WebView::OutOfProcessWebView& content_view) { set_layout(4); set_fill_with_background_color(true); auto& splitter = add(); m_inspector_view = splitter.add(); m_inspector_client = make(content_view, *m_inspector_view); m_inspector_client->on_dom_node_properties_received = [this](auto properties_or_error) { if (properties_or_error.is_error()) { clear_style_json(); clear_node_box_model(); } else { auto properties = properties_or_error.release_value(); load_style_json(properties.computed_style_json, properties.resolved_style_json, properties.custom_properties_json); update_node_box_model(properties.node_box_sizing_json); update_aria_properties_state_model(properties.aria_properties_state_json); } }; auto& bottom_tab_widget = splitter.add(); auto& computed_style_table_container = bottom_tab_widget.add_tab("Computed"_string); computed_style_table_container.set_layout(4); m_computed_style_table_view = computed_style_table_container.add(); auto& resolved_style_table_container = bottom_tab_widget.add_tab("Resolved"_string); resolved_style_table_container.set_layout(4); m_resolved_style_table_view = resolved_style_table_container.add(); auto& custom_properties_table_container = bottom_tab_widget.add_tab("Variables"_string); custom_properties_table_container.set_layout(4); m_custom_properties_table_view = custom_properties_table_container.add(); auto& box_model_widget = bottom_tab_widget.add_tab("Box Model"_string); box_model_widget.set_layout(4); m_element_size_view = box_model_widget.add(); m_element_size_view->set_should_hide_unnecessary_scrollbars(true); auto& aria_properties_state_widget = bottom_tab_widget.add_tab("ARIA"_string); aria_properties_state_widget.set_layout(4); m_aria_properties_state_view = aria_properties_state_widget.add(); m_inspector_view->set_focus(true); } InspectorWidget::~InspectorWidget() = default; void InspectorWidget::inspect() { m_inspector_client->inspect(); } void InspectorWidget::reset() { m_inspector_client->reset(); clear_style_json(); clear_node_box_model(); } void InspectorWidget::select_default_node() { m_inspector_client->select_default_node(); } void InspectorWidget::select_hovered_node() { m_inspector_client->select_hovered_node(); } void InspectorWidget::load_style_json(StringView computed_values_json, StringView resolved_values_json, StringView custom_properties_json) { m_computed_style_table_view->set_model(PropertyTableModel::create(PropertyTableModel::Type::StyleProperties, computed_values_json).release_value_but_fixme_should_propagate_errors()); m_computed_style_table_view->set_searchable(true); m_resolved_style_table_view->set_model(PropertyTableModel::create(PropertyTableModel::Type::StyleProperties, resolved_values_json).release_value_but_fixme_should_propagate_errors()); m_resolved_style_table_view->set_searchable(true); m_custom_properties_table_view->set_model(PropertyTableModel::create(PropertyTableModel::Type::StyleProperties, custom_properties_json).release_value_but_fixme_should_propagate_errors()); m_custom_properties_table_view->set_searchable(true); } void InspectorWidget::clear_style_json() { m_computed_style_table_view->set_model(nullptr); m_resolved_style_table_view->set_model(nullptr); m_custom_properties_table_view->set_model(nullptr); m_aria_properties_state_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); } void InspectorWidget::update_node_box_model(StringView node_box_sizing_json) { auto json_or_error = JsonValue::from_string(node_box_sizing_json); if (json_or_error.is_error() || !json_or_error.value().is_object()) { return; } auto json_value = json_or_error.release_value(); auto const& json_object = json_value.as_object(); m_node_box_sizing.margin.top = Web::CSSPixels(json_object.get_float("margin_top"sv).value_or(0)); m_node_box_sizing.margin.right = Web::CSSPixels(json_object.get_float("margin_right"sv).value_or(0)); m_node_box_sizing.margin.bottom = Web::CSSPixels(json_object.get_float("margin_bottom"sv).value_or(0)); m_node_box_sizing.margin.left = Web::CSSPixels(json_object.get_float("margin_left"sv).value_or(0)); m_node_box_sizing.padding.top = Web::CSSPixels(json_object.get_float("padding_top"sv).value_or(0)); m_node_box_sizing.padding.right = Web::CSSPixels(json_object.get_float("padding_right"sv).value_or(0)); m_node_box_sizing.padding.bottom = Web::CSSPixels(json_object.get_float("padding_bottom"sv).value_or(0)); m_node_box_sizing.padding.left = Web::CSSPixels(json_object.get_float("padding_left"sv).value_or(0)); m_node_box_sizing.border.top = Web::CSSPixels(json_object.get_float("border_top"sv).value_or(0)); m_node_box_sizing.border.right = Web::CSSPixels(json_object.get_float("border_right"sv).value_or(0)); m_node_box_sizing.border.bottom = Web::CSSPixels(json_object.get_float("border_bottom"sv).value_or(0)); m_node_box_sizing.border.left = Web::CSSPixels(json_object.get_float("border_left"sv).value_or(0)); m_element_size_view->set_node_content_width(json_object.get_float("content_width"sv).value_or(0)); m_element_size_view->set_node_content_height(json_object.get_float("content_height"sv).value_or(0)); m_element_size_view->set_box_model(m_node_box_sizing); } void InspectorWidget::clear_node_box_model() { m_node_box_sizing = Web::Layout::BoxModelMetrics {}; m_element_size_view->set_node_content_width(0); m_element_size_view->set_node_content_height(0); m_element_size_view->set_box_model(m_node_box_sizing); } void InspectorWidget::update_aria_properties_state_model(StringView aria_properties_state_json) { m_aria_properties_state_view->set_model(PropertyTableModel::create(PropertyTableModel::Type::ARIAProperties, aria_properties_state_json).release_value_but_fixme_should_propagate_errors()); m_aria_properties_state_view->set_searchable(true); } }