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

LibWeb: Make DOM inspector overlay rects a little nicer

Browse source 
Instead of just the outline, fill them with some semi-transparent color.
Also add tag name, ID, classes and coordinates to the little tooltip.
Finally, use the border box instead of the context box for metrics,
same as other browsers.
This commit is contained in:
Andreas Kling 2022-02-26 08:18:14 +01:00
parent c59ab7cc8b
commit 784dbdef8e
3 changed files with 42 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

14
Userland/Libraries/LibWeb/DOM/Node.cpp
View file

@ -959,4 +959,18 @@ NonnullRefPtr<Node> Node::get_root_node(GetRootNodeOptions const& options)
return root();
}
String Node::debug_description() const
{
StringBuilder builder;
builder.append(node_name().to_lowercase());
if (is_element()) {
auto& element = static_cast<DOM::Element const&>(*this);
if (auto id = element.get_attribute(HTML::AttributeNames::id); !id.is_null())
builder.appendff("#{}", id);
for (auto const& class_name : element.class_names())
builder.appendff(".{}", class_name);
}
return builder.to_string();
}
}