mirror of
https://github.com/SerenityOS/serenity.git
synced 2025-01-26 19:32:06 -05:00
LibWeb: Make layout tree dumps nicer
This patch removes a bunch of the less generally useful information from layout tree dumps and puts it behind some optional bool params. We also show layout units as integers instead of floats for now, since fractional layout almost never happen anyway (yet) and this makes it much easier to read.
This commit is contained in:
parent
17e25890be
commit
5b0deba49c
2 changed files with 59 additions and 52 deletions
|
@ -80,11 +80,11 @@ void dump_tree(const DOM::Node& node)
|
|||
--indent;
|
||||
}
|
||||
|
||||
void dump_tree(const Layout::Node& layout_node)
|
||||
void dump_tree(const Layout::Node& layout_node, bool show_box_model, bool show_specified_style)
|
||||
{
|
||||
static size_t indent = 0;
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" ");
|
||||
|
||||
FlyString tag_name;
|
||||
if (layout_node.is_anonymous())
|
||||
|
@ -115,87 +115,94 @@ void dump_tree(const Layout::Node& layout_node)
|
|||
}
|
||||
|
||||
if (!layout_node.is_box()) {
|
||||
dbgprintf("%s {\033[33m%s\033[0m%s}\n", layout_node.class_name(), tag_name.characters(), identifier.characters());
|
||||
dbgprintf("\033[33m%s\033[0m {\033[33m%s\033[0m%s} @%p\n", layout_node.class_name(), tag_name.characters(), identifier.characters(), &layout_node);
|
||||
} else {
|
||||
auto& layout_box = downcast<Layout::Box>(layout_node);
|
||||
dbgprintf("%s {\033[34m%s\033[0m%s} at (%g,%g) size %gx%g",
|
||||
layout_box.class_name(),
|
||||
auto& box = downcast<Layout::Box>(layout_node);
|
||||
dbgprintf("\033[34m%s\033[0m {\033[34m%s\033[0m%s} @%p at (%d,%d) size %dx%d",
|
||||
box.class_name(),
|
||||
tag_name.characters(),
|
||||
identifier.characters(),
|
||||
layout_box.absolute_x(),
|
||||
layout_box.absolute_y(),
|
||||
layout_box.width(),
|
||||
layout_box.height());
|
||||
&layout_node,
|
||||
(int)box.absolute_x(),
|
||||
(int)box.absolute_y(),
|
||||
(int)box.width(),
|
||||
(int)box.height());
|
||||
|
||||
// Dump the horizontal box properties
|
||||
dbgprintf(" [%g+%g+%g %g %g+%g+%g]",
|
||||
layout_box.box_model().margin.left.to_px(layout_box),
|
||||
layout_box.box_model().border.left.to_px(layout_box),
|
||||
layout_box.box_model().padding.left.to_px(layout_box),
|
||||
layout_box.width(),
|
||||
layout_box.box_model().padding.right.to_px(layout_box),
|
||||
layout_box.box_model().border.right.to_px(layout_box),
|
||||
layout_box.box_model().margin.right.to_px(layout_box));
|
||||
if (box.is_positioned())
|
||||
dbgprintf(" \033[31;1mpositioned\033[0m");
|
||||
if (box.is_floating())
|
||||
dbgprintf(" \033[32;1mfloating\033[0m");
|
||||
|
||||
// And the vertical box properties
|
||||
dbgprintf(" [%g+%g+%g %g %g+%g+%g]",
|
||||
layout_box.box_model().margin.top.to_px(layout_box),
|
||||
layout_box.box_model().border.top.to_px(layout_box),
|
||||
layout_box.box_model().padding.top.to_px(layout_box),
|
||||
layout_box.height(),
|
||||
layout_box.box_model().padding.bottom.to_px(layout_box),
|
||||
layout_box.box_model().border.bottom.to_px(layout_box),
|
||||
layout_box.box_model().margin.bottom.to_px(layout_box));
|
||||
if (show_box_model) {
|
||||
// Dump the horizontal box properties
|
||||
dbgprintf(" [%g+%g+%g %g %g+%g+%g]",
|
||||
box.box_model().margin.left.to_px(box),
|
||||
box.box_model().border.left.to_px(box),
|
||||
box.box_model().padding.left.to_px(box),
|
||||
box.width(),
|
||||
box.box_model().padding.right.to_px(box),
|
||||
box.box_model().border.right.to_px(box),
|
||||
box.box_model().margin.right.to_px(box));
|
||||
|
||||
// And the vertical box properties
|
||||
dbgprintf(" [%g+%g+%g %g %g+%g+%g]",
|
||||
box.box_model().margin.top.to_px(box),
|
||||
box.box_model().border.top.to_px(box),
|
||||
box.box_model().padding.top.to_px(box),
|
||||
box.height(),
|
||||
box.box_model().padding.bottom.to_px(box),
|
||||
box.box_model().border.bottom.to_px(box),
|
||||
box.box_model().margin.bottom.to_px(box));
|
||||
}
|
||||
|
||||
dbgprintf("\n");
|
||||
}
|
||||
|
||||
if (layout_node.is_block() && static_cast<const Layout::BlockBox&>(layout_node).children_are_inline()) {
|
||||
auto& block = static_cast<const Layout::BlockBox&>(layout_node);
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" Line boxes (%d):\n", block.line_boxes().size());
|
||||
for (size_t line_box_index = 0; line_box_index < block.line_boxes().size(); ++line_box_index) {
|
||||
auto& line_box = block.line_boxes()[line_box_index];
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" [%d] width: %g\n", line_box_index, line_box.width());
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" \033[34;1mline %d\033[0m width: %d\n", line_box_index, (int)line_box.width());
|
||||
for (size_t fragment_index = 0; fragment_index < line_box.fragments().size(); ++fragment_index) {
|
||||
auto& fragment = line_box.fragments()[fragment_index];
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" [%d] layout_node: %s{%p}, start: %d, length: %d, rect: %s\n",
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" \033[35;1mfrag %d\033[0m from %s @%p, start: %d, length: %d, rect: %s\n",
|
||||
fragment_index,
|
||||
fragment.layout_node().class_name(),
|
||||
&fragment.layout_node(),
|
||||
fragment.start(),
|
||||
fragment.length(),
|
||||
fragment.absolute_rect().to_string().characters());
|
||||
enclosing_int_rect(fragment.absolute_rect()).to_string().characters());
|
||||
if (fragment.layout_node().is_text()) {
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" ");
|
||||
auto& layout_text = static_cast<const Layout::TextNode&>(fragment.layout_node());
|
||||
auto fragment_text = layout_text.text_for_rendering().substring(fragment.start(), fragment.length());
|
||||
dbgprintf(" text: \"%s\"\n", fragment_text.characters());
|
||||
dbgprintf(" \"%s\"\n", fragment_text.characters());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
struct NameAndValue {
|
||||
String name;
|
||||
String value;
|
||||
};
|
||||
Vector<NameAndValue> properties;
|
||||
layout_node.specified_style().for_each_property([&](auto property_id, auto& value) {
|
||||
properties.append({ CSS::string_from_property_id(property_id), value.to_string() });
|
||||
});
|
||||
quick_sort(properties, [](auto& a, auto& b) { return a.name < b.name; });
|
||||
if (show_specified_style) {
|
||||
struct NameAndValue {
|
||||
String name;
|
||||
String value;
|
||||
};
|
||||
Vector<NameAndValue> properties;
|
||||
layout_node.specified_style().for_each_property([&](auto property_id, auto& value) {
|
||||
properties.append({ CSS::string_from_property_id(property_id), value.to_string() });
|
||||
});
|
||||
quick_sort(properties, [](auto& a, auto& b) { return a.name < b.name; });
|
||||
|
||||
for (auto& property : properties) {
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" (%s: %s)\n", property.name.characters(), property.value.characters());
|
||||
for (auto& property : properties) {
|
||||
for (size_t i = 0; i < indent; ++i)
|
||||
dbgprintf(" ");
|
||||
dbgprintf(" (%s: %s)\n", property.name.characters(), property.value.characters());
|
||||
}
|
||||
}
|
||||
|
||||
++indent;
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
namespace Web {
|
||||
|
||||
void dump_tree(const DOM::Node&);
|
||||
void dump_tree(const Layout::Node&);
|
||||
void dump_tree(const Layout::Node&, bool show_box_model = false, bool show_specified_style = false);
|
||||
void dump_sheet(const CSS::StyleSheet&);
|
||||
void dump_rule(const CSS::StyleRule&);
|
||||
void dump_selector(const CSS::Selector&);
|
||||
|
|
Loading…
Add table
Reference in a new issue