LibWeb: Colorize tag names in layout tree dumps + show element IDs

Showing element IDs in layout tree dumps makes it much easier to
compare against the DOM.
This commit is contained in:
Andreas Kling 2020-05-23 21:05:26 +02:00
parent e45c8b842c
commit a01fd7ecc5
Notes: sideshowbarker 2024-07-19 06:12:12 +09:00

View file

@ -24,6 +24,7 @@
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
#include <AK/StringBuilder.h>
#include <AK/Utf8View.h>
#include <LibWeb/CSS/PropertyID.h>
#include <LibWeb/CSS/StyleSheet.h>
@ -90,13 +91,25 @@ void dump_tree(const LayoutNode& layout_node)
else
tag_name = "???";
String identifier = "";
if (layout_node.node() && is<Element>(*layout_node.node())) {
auto id = to<Element>(*layout_node.node()).attribute("id");
if (!id.is_empty()) {
StringBuilder builder;
builder.append('#');
builder.append(id);
identifier = builder.to_string();
}
}
if (!layout_node.is_box()) {
dbgprintf("%s {%s}\n", layout_node.class_name(), tag_name.characters());
dbgprintf("%s {\033[33m%s\033[0m%s}\n", layout_node.class_name(), tag_name.characters(), identifier.characters());
} else {
auto& layout_box = to<LayoutBox>(layout_node);
dbgprintf("%s {%s} at (%g,%g) size %gx%g",
dbgprintf("%s {\033[34m%s\033[0m%s} at (%g,%g) size %gx%g",
layout_box.class_name(),
tag_name.characters(),
identifier.characters(),
layout_box.x(),
layout_box.y(),
layout_box.width(),