RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 18:17:44 +00:00
Code Issues Activity Actions

Ladybird: Add the node properties tabs to the inspector

Browse source 
This now allows you to view the computed and resolved style values,
along with the CSS variables of a node.
This commit is contained in:
MacDue 2022-12-18 21:12:14 +00:00 • committed by Andrew Kaster
parent aa85a88158
commit 33249c727a
5 changed files with 103 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

14
Ladybird/InspectorWidget.h
View file

@ -6,6 +6,7 @@
#pragma once
#include "DOMNodeProperties.h"
#include "ModelTranslator.h"
#include <AK/Optional.h>
#include <AK/StringView.h>
@ -13,6 +14,7 @@
#include <QWidget>
class QTreeView;
class QTableView;
namespace Ladybird {
@ -31,16 +33,22 @@ public:
void clear_dom_json();
void set_dom_json(StringView dom_json);
Function<void(i32, Optional<Web::CSS::Selector::PseudoElement>)> on_dom_node_inspected;
void load_style_json(StringView computed_style_json, StringView resolved_style_json, StringView custom_properties_json);
void clear_style_json();
Function<ErrorOr<DOMNodeProperties>(i32, Optional<Web::CSS::Selector::PseudoElement>)> on_dom_node_inspected;
Function<void()> on_close;
private:
void set_selection(GUI::ModelIndex);
void closeEvent(QCloseEvent*) override;
QTreeView* m_tree_view { nullptr };
ModelTranslator m_dom_model {};
Selection m_selection;
ModelTranslator m_dom_model {};
ModelTranslator m_computed_style_model {};
ModelTranslator m_resolved_style_model {};
ModelTranslator m_custom_properties_model {};
};
}