LadybirdBrowser/ladybird
1
1
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2024-11-10 13:00:29 +03:00
Code Issues Packages Projects Releases Wiki Activity
ef7d80ced2
ladybird/Userland/Libraries/LibWeb/Dump.cpp

654 lines
27 KiB
C++
Raw Normal View History

Meta: Add license header to source files As suggested by Joshua, this commit adds the 2-clause BSD license as a comment block to the top of every source file. For the first pass, I've just added myself for simplicity. I encourage everyone to add themselves as copyright holders of any file they've added or modified in some significant way. If I've added myself in error somewhere, feel free to replace it with the appropriate copyright holder instead. Going forward, all new source files should include a license header.
2020-01-18 11:38:21 +03:00
/*
LibWeb: Add Painting::Box and move things from Layout::Box into it The "paintable" state in Layout::Box was actually not safe to access until after layout had been performed. As a first step towards making this harder to mess up accidentally, this patch moves painting information from Layout::Box to a new class: Painting::Box. Every layout can have a corresponding paint box, and it holds the final used metrics determined by layout. The paint box is created and populated by FormattingState::commit(). I've also added DOM::Node::paint_box() as a convenient way to access the paint box (if available) of a given DOM node. Going forward, I believe this will allow us to better separate data that belongs to layout vs painting, and also open up opportunities for naturally invalidating caches in the paint box (since it's reconstituted by every layout.)
2022-03-10 01:53:41 +03:00
* Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
* Copyright (c) 2021, the SerenityOS developers.
Meta: Add license header to source files As suggested by Joshua, this commit adds the 2-clause BSD license as a comment block to the top of every source file. For the first pass, I've just added myself for simplicity. I encourage everyone to add themselves as copyright holders of any file they've added or modified in some significant way. If I've added myself in error somewhere, feel free to replace it with the appropriate copyright holder instead. Going forward, all new source files should include a license header.
2020-01-18 11:38:21 +03:00
*
Everything: Move to SPDX license identifiers in all files. SPDX License Identifiers are a more compact / standardized way of representing file license information. See: https://spdx.dev/resources/use/#identifiers This was done with the `ambr` search and replace tool. ambr --no-parent-ignore --key-from-file --rep-from-file key.txt rep.txt *
2021-04-22 11:24:48 +03:00
* SPDX-License-Identifier: BSD-2-Clause
Meta: Add license header to source files As suggested by Joshua, this commit adds the 2-clause BSD license as a comment block to the top of every source file. For the first pass, I've just added myself for simplicity. I encourage everyone to add themselves as copyright holders of any file they've added or modified in some significant way. If I've added myself in error somewhere, feel free to replace it with the appropriate copyright holder instead. Going forward, all new source files should include a license header.
2020-01-18 11:38:21 +03:00
*/
LibWeb: Dump layout node style properties in alphabetical order
2020-06-14 19:47:21 +03:00
#include <AK/QuickSort.h>
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.
2020-05-23 22:05:26 +03:00
#include <AK/StringBuilder.h>
LibHTML: Rewrite inline and text layout Inline layout is now done by LayoutBlock. Blocks with inline children will split them into line boxes during layout. A LayoutBlock can have zero or more LineBox objects. Each LineBox represents one visual line. A LineBox can have any number of LineBoxFragment children. A fragment is an offset+length into a specific LayoutNode. To paint a LayoutBlock with inline children, we walk its line boxes, and walk their fragments, painting each fragment at a time by calling LineBoxFragment::render(), which in turn calls the LayoutNode via LayoutText::render_fragment(). Hit testing works similarly. This is very incomplete and has many bugs, but should make it easier for us to move forward with this code.
2019-10-03 16:20:13 +03:00
#include <AK/Utf8View.h>
LibWeb: Implement initial CSSFontFaceRule and FontFace classes For now, this is the bare minimum that's needed: font-family and src.
2022-03-28 22:30:26 +03:00
#include <LibWeb/CSS/CSSFontFaceRule.h>
LibWeb: Added simple parsing for (at)import rules For now, the parsing is very crude, and parses only the document url. The meta queries for the import are ignored.
2021-02-21 19:36:34 +03:00
#include <LibWeb/CSS/CSSImportRule.h>
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
#include <LibWeb/CSS/CSSMediaRule.h>
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
#include <LibWeb/CSS/CSSRule.h>
LibWeb: Rename StyleRule => CSSStyleRule This matches the CSSOM specification.
2021-03-07 17:00:02 +03:00
#include <LibWeb/CSS/CSSStyleRule.h>
LibWeb: Split CSS::StyleSheet into StyleSheet and CSSStyleSheet This is a little convoluted but matches the CSSOM specification.
2021-03-07 18:14:04 +03:00
#include <LibWeb/CSS/CSSStyleSheet.h>
LibWeb: Implement `@supports` rule :^) The main thing missing is that we don't serialize the supports clause, but for actually using a `@supports (something: cool) {}` rule in CSS, it works!
2021-10-08 19:48:14 +03:00
#include <LibWeb/CSS/CSSSupportsRule.h>
LibWeb: Rename directory LibHTML => LibWeb Let's rename this to LibWeb since it aims to provide more parts of the web platform than just HTML. :^)
2020-03-07 12:32:51 +03:00
#include <LibWeb/CSS/PropertyID.h>
#include <LibWeb/DOM/Comment.h>
#include <LibWeb/DOM/Document.h>
#include <LibWeb/DOM/Element.h>
LibWeb: Include shadow DOM subtrees in DOM dumps
2021-02-10 20:25:05 +03:00
#include <LibWeb/DOM/ShadowRoot.h>
LibWeb: Rename directory LibHTML => LibWeb Let's rename this to LibWeb since it aims to provide more parts of the web platform than just HTML. :^)
2020-03-07 12:32:51 +03:00
#include <LibWeb/DOM/Text.h>
#include <LibWeb/Dump.h>
LibWeb: Implement <template> parsing Note that there is currently no way to display them as we can't currently clone nodes. Adds special case for templates for dumping to console. Doesn't add it to the DOM inspector as I'm not sure how to do it.
2020-08-20 00:30:33 +03:00
#include <LibWeb/HTML/HTMLTemplateElement.h>
LibWeb: Rename Layout::BlockBox => BlockContainer There's a subtle difference here. A "block box" in the spec is a block-level box, while a "block container" is a box whose children are either all inline-level boxes in an IFC, or all block-level boxes participating in a BFC. Notably, an "inline-block" box is a "block container" but not a "block box" since it is itself inline-level.
2021-10-06 21:02:41 +03:00
#include <LibWeb/Layout/BlockContainer.h>
LibWeb: Rename LayoutNode classes and move them into Layout namespace Bring the names of various boxes closer to spec language. This should hopefully make things easier to understand and hack on. :^) Some notable changes: - LayoutNode -> Layout::Node - LayoutBox -> Layout::Box - LayoutBlock -> Layout::BlockBox - LayoutReplaced -> Layout::ReplacedBox - LayoutDocument -> Layout::InitialContainingBlockBox - LayoutText -> Layout::TextNode - LayoutInline -> Layout::InlineNode Note that this is not strictly a "box tree" as we also hang inline/text nodes in the same tree, and they don't generate boxes. (Instead, they contribute line box fragments to their containing block!)
2020-11-22 17:53:01 +03:00
#include <LibWeb/Layout/Node.h>
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
#include <LibWeb/Layout/SVGBox.h>
LibWeb: Rename LayoutNode classes and move them into Layout namespace Bring the names of various boxes closer to spec language. This should hopefully make things easier to understand and hack on. :^) Some notable changes: - LayoutNode -> Layout::Node - LayoutBox -> Layout::Box - LayoutBlock -> Layout::BlockBox - LayoutReplaced -> Layout::ReplacedBox - LayoutDocument -> Layout::InitialContainingBlockBox - LayoutText -> Layout::TextNode - LayoutInline -> Layout::InlineNode Note that this is not strictly a "box tree" as we also hang inline/text nodes in the same tree, and they don't generate boxes. (Instead, they contribute line box fragments to their containing block!)
2020-11-22 17:53:01 +03:00
#include <LibWeb/Layout/TextNode.h>
LibWeb: Move PaintingBox to its own .cpp and .h files
2022-03-11 01:13:37 +03:00
#include <LibWeb/Painting/PaintableBox.h>
LibHTML: Start working on a simple HTML library. I'd like to have rich text, and we might as well use HTML for that. :^)
2019-06-15 19:55:47 +03:00
#include <stdio.h>
LibWeb: Move everything into the Web namespace
2020-03-07 12:27:02 +03:00
namespace Web {
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
static void indent(StringBuilder& builder, int levels)
{
for (int i = 0; i < levels; i++)
builder.append(" ");
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_tree(DOM::Node const& node)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
{
StringBuilder builder;
dump_tree(builder, node);
dbgln("{}", builder.string_view());
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_tree(StringBuilder& builder, DOM::Node const& node)
LibHTML: Start working on a simple HTML library. I'd like to have rich text, and we might as well use HTML for that. :^)
2019-06-15 19:55:47 +03:00
{
static int indent = 0;
for (int i = 0; i < indent; ++i)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append(" ");
LibWeb: Use the DOM::Node::node_name() a bit more in dumps
2021-02-10 19:13:08 +03:00
if (is<DOM::Element>(node)) {
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
builder.appendff("<{}", verify_cast<DOM::Element>(node).local_name());
verify_cast<DOM::Element>(node).for_each_attribute([&](auto& name, auto& value) {
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.appendff(" {}={}", name, value);
LibHTML: Basic element attribute parsing.
2019-06-15 22:08:36 +03:00
});
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append(">\n");
LibWeb: Move DOM classes into the Web::DOM namespace LibWeb keeps growing and the Web namespace is filling up fast. Let's put DOM stuff into Web::DOM, just like we already started doing with SVG stuff in Web::SVG.
2020-07-26 20:37:56 +03:00
} else if (is<DOM::Text>(node)) {
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
builder.appendff("\"{}\"\n", verify_cast<DOM::Text>(node).data());
LibWeb: Use the DOM::Node::node_name() a bit more in dumps
2021-02-10 19:13:08 +03:00
} else {
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.appendff("{}\n", node.node_name());
LibHTML: Start working on a simple HTML library. I'd like to have rich text, and we might as well use HTML for that. :^)
2019-06-15 19:55:47 +03:00
}
++indent;
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
if (is<DOM::Element>(node) && verify_cast<DOM::Element>(node).shadow_root()) {
LibWeb: Fix out-of-order DOM tree dumps There were a few calls to the standalone version of dump_tree() inside the recursive version of dump_tree(), which led to the output getting jumbled out of order.
2021-09-12 13:58:17 +03:00
dump_tree(builder, *verify_cast<DOM::Element>(node).shadow_root());
LibWeb: Include shadow DOM subtrees in DOM dumps
2021-02-10 20:25:05 +03:00
}
LibWeb: Move DOM classes into the Web::DOM namespace LibWeb keeps growing and the Web namespace is filling up fast. Let's put DOM stuff into Web::DOM, just like we already started doing with SVG stuff in Web::SVG.
2020-07-26 20:37:56 +03:00
if (is<DOM::ParentNode>(node)) {
LibWeb: Implement <template> parsing Note that there is currently no way to display them as we can't currently clone nodes. Adds special case for templates for dumping to console. Doesn't add it to the DOM inspector as I'm not sure how to do it.
2020-08-20 00:30:33 +03:00
if (!is<HTML::HTMLTemplateElement>(node)) {
LibWeb: Fix out-of-order DOM tree dumps There were a few calls to the standalone version of dump_tree() inside the recursive version of dump_tree(), which led to the output getting jumbled out of order.
2021-09-12 13:58:17 +03:00
static_cast<DOM::ParentNode const&>(node).for_each_child([&](auto& child) {
dump_tree(builder, child);
LibWeb: Implement <template> parsing Note that there is currently no way to display them as we can't currently clone nodes. Adds special case for templates for dumping to console. Doesn't add it to the DOM inspector as I'm not sure how to do it.
2020-08-20 00:30:33 +03:00
});
} else {
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
auto& template_element = verify_cast<HTML::HTMLTemplateElement>(node);
LibWeb: Fix out-of-order DOM tree dumps There were a few calls to the standalone version of dump_tree() inside the recursive version of dump_tree(), which led to the output getting jumbled out of order.
2021-09-12 13:58:17 +03:00
dump_tree(builder, template_element.content());
LibWeb: Implement <template> parsing Note that there is currently no way to display them as we can't currently clone nodes. Adds special case for templates for dumping to console. Doesn't add it to the DOM inspector as I'm not sure how to do it.
2020-08-20 00:30:33 +03:00
}
LibHTML: Start working on a simple HTML library. I'd like to have rich text, and we might as well use HTML for that. :^)
2019-06-15 19:55:47 +03:00
}
--indent;
}
LibHTML: Start fleshing out a basic layout tree.
2019-06-15 23:49:44 +03:00
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_tree(Layout::Node const& layout_node, bool show_box_model, bool show_specified_style)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
{
StringBuilder builder;
dump_tree(builder, layout_node, show_box_model, show_specified_style, true);
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
dbgln("{}", builder.string_view());
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_tree(StringBuilder& builder, Layout::Node const& layout_node, bool show_box_model, bool show_specified_style, bool interactive)
LibHTML: Start fleshing out a basic layout tree.
2019-06-15 23:49:44 +03:00
{
AK: Make Vector use size_t for its size and capacity
2020-02-25 16:49:47 +03:00
static size_t indent = 0;
for (size_t i = 0; i < indent; ++i)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append(" ");
LibHTML: Give LayoutNodes a rect. Also improve the layout tree dump format somewhat.
2019-06-16 12:28:47 +03:00
LibWeb: Use FlyString for Element tag names This makes selector matching a lot more efficient, and also reduces the number of strings on the heap.
2020-03-22 21:10:43 +03:00
FlyString tag_name;
LibHTML: Give LayoutNodes a rect. Also improve the layout tree dump format somewhat.
2019-06-16 12:28:47 +03:00
if (layout_node.is_anonymous())
tag_name = "(anonymous)";
LibWeb: Rename LayoutNode::node() => LayoutNode::dom_node()
2020-11-22 16:46:36 +03:00
else if (is<DOM::Element>(layout_node.dom_node()))
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
tag_name = verify_cast<DOM::Element>(*layout_node.dom_node()).local_name();
LibHTML: Give LayoutNodes a rect. Also improve the layout tree dump format somewhat.
2019-06-16 12:28:47 +03:00
else
LibWeb: Use the DOM::Node::node_name() a bit more in dumps
2021-02-10 19:13:08 +03:00
tag_name = layout_node.dom_node()->node_name();
LibHTML: Give LayoutNodes a rect. Also improve the layout tree dump format somewhat.
2019-06-16 12:28:47 +03:00
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.
2020-05-23 22:05:26 +03:00
String identifier = "";
LibWeb: Rename LayoutNode::node() => LayoutNode::dom_node()
2020-11-22 16:46:36 +03:00
if (layout_node.dom_node() && is<DOM::Element>(*layout_node.dom_node())) {
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
auto& element = verify_cast<DOM::Element>(*layout_node.dom_node());
LibWeb: Include class names in layout tree dumps This makes it a lot easier to see which layout node is which DOM node.
2020-06-12 14:23:07 +03:00
StringBuilder builder;
auto id = element.attribute(HTML::AttributeNames::id);
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.
2020-05-23 22:05:26 +03:00
if (!id.is_empty()) {
builder.append('#');
builder.append(id);
}
LibWeb: Include class names in layout tree dumps This makes it a lot easier to see which layout node is which DOM node.
2020-06-12 14:23:07 +03:00
for (auto& class_name : element.class_names()) {
builder.append('.');
builder.append(class_name);
}
identifier = builder.to_string();
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.
2020-05-23 22:05:26 +03:00
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
char const* nonbox_color_on = "";
char const* box_color_on = "";
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
char const* svg_box_color_on = "";
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
char const* positioned_color_on = "";
char const* floating_color_on = "";
char const* inline_block_color_on = "";
char const* line_box_color_on = "";
char const* fragment_color_on = "";
char const* flex_color_on = "";
char const* color_off = "";
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
if (interactive) {
nonbox_color_on = "\033[33m";
box_color_on = "\033[34m";
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
svg_box_color_on = "\033[31m";
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
positioned_color_on = "\033[31;1m";
floating_color_on = "\033[32;1m";
inline_block_color_on = "\033[36;1m";
line_box_color_on = "\033[34;1m";
fragment_color_on = "\033[35;1m";
LibWeb: Parse "display: flex" and create BlockBox layout nodes for them I'm not 100% sure that BlockBox is the right layout node for flex containers, but it's the most obviously fitting one we already have.
2021-01-18 19:32:34 +03:00
flex_color_on = "\033[34;1m";
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
color_off = "\033[0m";
}
LibWeb: Remove hand-rolled is_foo() helpers in Layout::Node classes
2021-01-01 20:55:47 +03:00
if (!is<Layout::Box>(layout_node)) {
LibWeb: Fix a tiny appendff() format issue This would've just left the colour on for a few characters, nothing _too_ bad.
2021-02-23 09:27:02 +03:00
builder.appendff("{}{}{} <{}{}{}{}>",
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
nonbox_color_on,
LibWeb: Fix unnecessary wrapping of block boxes in anonymous blocks Outside of tables, we don't need to wrap block-level boxes in anymous blocks. Only inline-level boxes need this treatment.
2021-01-02 05:30:04 +03:00
layout_node.class_name().substring_view(13),
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
color_off,
tag_name,
nonbox_color_on,
identifier,
color_off);
if (interactive)
builder.appendff(" @{:p}", &layout_node);
builder.append("\n");
LibHTML: Introduce LayoutBox and LayoutNodeWithStyleAndBoxModelMetrics To streamline the layout tree and remove irrelevant data from classes that don't need it, this patch adds two new LayoutNode subclasses. LayoutNodeWithStyleAndBoxModelMetrics should be inherited by any layout node that cares about box model metrics (margin, border, and padding.) LayoutBox should be inherited by any layout node that can have a rect. This makes LayoutText significantly smaller (from 140 to 40 bytes) and clarifies a lot of things about the layout tree. I'm also adding next_sibling() and previous_sibling() overloads to LayoutBlock that return a LayoutBlock*. This is okay since blocks only ever have block siblings. Do also note that the semantics of is<T> slightly change in this patch: is<T>(nullptr) now returns true, to facilitate allowing to<T>(nullptr).
2019-10-15 17:48:38 +03:00
} else {
AK: Rename downcast<T> => verify_cast<T> This makes it much clearer what this cast actually does: it will VERIFY that the thing we're casting is a T (using is<T>()).
2021-06-24 20:53:42 +03:00
auto& box = verify_cast<Layout::Box>(layout_node);
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
StringView color_on = is<Layout::SVGBox>(box) ? svg_box_color_on : box_color_on;
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.appendff("{}{}{} <{}{}{}{}> ",
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
color_on,
LibWeb: Fix unnecessary wrapping of block boxes in anonymous blocks Outside of tables, we don't need to wrap block-level boxes in anymous blocks. Only inline-level boxes need this treatment.
2021-01-02 05:30:04 +03:00
box.class_name().substring_view(13),
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
color_off,
LibWeb: Make SVG boxes red in layout tree dumps
2021-09-18 00:03:36 +03:00
color_on,
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
tag_name,
color_off,
identifier.characters());
if (interactive)
builder.appendff("@{:p} ", &layout_node);
LibWeb: Don't crash when dumping layout tree pre-layout If we haven't run layout yet, there aren't any paintables attached to the tree, so we have to null check them.
2022-03-19 00:12:03 +03:00
if (auto const* paint_box = box.paint_box()) {
builder.appendff("at ({},{}) content-size {}x{}",
paint_box->absolute_x(),
paint_box->absolute_y(),
paint_box->content_width(),
paint_box->content_height());
}
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.
2020-12-07 21:36:13 +03:00
if (box.is_positioned())
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.appendff(" {}positioned{}", positioned_color_on, color_off);
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.
2020-12-07 21:36:13 +03:00
if (box.is_floating())
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.appendff(" {}floating{}", floating_color_on, color_off);
if (box.is_inline_block())
builder.appendff(" {}inline-block{}", inline_block_color_on, color_off);
LibWeb: Include flex-direction in layout tree dumps
2021-10-21 01:29:31 +03:00
if (box.computed_values().display().is_flex_inside()) {
StringView direction;
switch (box.computed_values().flex_direction()) {
case CSS::FlexDirection::Column:
direction = "column"sv;
break;
case CSS::FlexDirection::ColumnReverse:
direction = "column-reverse"sv;
break;
case CSS::FlexDirection::Row:
direction = "row"sv;
break;
case CSS::FlexDirection::RowReverse:
direction = "row-reverse"sv;
break;
}
builder.appendff(" {}flex-container({}){}", flex_color_on, direction, color_off);
}
LibWeb: LayoutNodes know whether they are flex-items This is useful for debugging when dumping the layout tree.
2021-05-29 23:36:15 +03:00
if (box.is_flex_item())
builder.appendff(" {}flex-item{}", flex_color_on, color_off);
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.
2020-12-07 21:36:13 +03:00
if (show_box_model) {
// Dump the horizontal box properties
Everywhere: Add `-Wdouble-promotion` warning This warning informs of float-to-double conversions. The best solution seems to be to do math *either* in 32-bit *or* in 64-bit, and only to cross over when absolutely necessary.
2021-04-15 10:36:14 +03:00
builder.appendff(" [{}+{}+{} {} {}+{}+{}]",
LibWeb: Store layout box model metrics as floats Instead of storing them as CSS::Lengths, we now store the resolved values for margin/padding/border/offset top/right/bottom/left with each Layout::NodeWithStyleAndBoxModelMetrics. This simplifies a lot of code since it's no longer necessary to resolve values before using them.
2020-12-12 23:02:06 +03:00
box.box_model().margin.left,
box.box_model().border.left,
box.box_model().padding.left,
LibWeb: Don't crash when dumping layout tree pre-layout If we haven't run layout yet, there aren't any paintables attached to the tree, so we have to null check them.
2022-03-19 00:12:03 +03:00
box.paint_box() ? box.paint_box()->content_width() : 0,
LibWeb: Store layout box model metrics as floats Instead of storing them as CSS::Lengths, we now store the resolved values for margin/padding/border/offset top/right/bottom/left with each Layout::NodeWithStyleAndBoxModelMetrics. This simplifies a lot of code since it's no longer necessary to resolve values before using them.
2020-12-12 23:02:06 +03:00
box.box_model().padding.right,
box.box_model().border.right,
box.box_model().margin.right);
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.
2020-12-07 21:36:13 +03:00
// And the vertical box properties
Everywhere: Add `-Wdouble-promotion` warning This warning informs of float-to-double conversions. The best solution seems to be to do math *either* in 32-bit *or* in 64-bit, and only to cross over when absolutely necessary.
2021-04-15 10:36:14 +03:00
builder.appendff(" [{}+{}+{} {} {}+{}+{}]",
LibWeb: Store layout box model metrics as floats Instead of storing them as CSS::Lengths, we now store the resolved values for margin/padding/border/offset top/right/bottom/left with each Layout::NodeWithStyleAndBoxModelMetrics. This simplifies a lot of code since it's no longer necessary to resolve values before using them.
2020-12-12 23:02:06 +03:00
box.box_model().margin.top,
box.box_model().border.top,
box.box_model().padding.top,
LibWeb: Don't crash when dumping layout tree pre-layout If we haven't run layout yet, there aren't any paintables attached to the tree, so we have to null check them.
2022-03-19 00:12:03 +03:00
box.paint_box() ? box.paint_box()->content_height() : 0,
LibWeb: Store layout box model metrics as floats Instead of storing them as CSS::Lengths, we now store the resolved values for margin/padding/border/offset top/right/bottom/left with each Layout::NodeWithStyleAndBoxModelMetrics. This simplifies a lot of code since it's no longer necessary to resolve values before using them.
2020-12-12 23:02:06 +03:00
box.box_model().padding.bottom,
box.box_model().border.bottom,
box.box_model().margin.bottom);
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.
2020-12-07 21:36:13 +03:00
}
LibHTML: Finish the block width calculation Also add horizontal box values to the layout tree dump.
2019-08-18 09:09:56 +03:00
LibWeb: Include children-are-inline state in layout tree dumps Sometimes it's really helpful to know if a box considers its children to be inline or not.
2022-03-26 02:10:36 +03:00
builder.appendff(" children: {}", box.children_are_inline() ? "inline" : "not-inline");
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append("\n");
LibHTML: Introduce LayoutBox and LayoutNodeWithStyleAndBoxModelMetrics To streamline the layout tree and remove irrelevant data from classes that don't need it, this patch adds two new LayoutNode subclasses. LayoutNodeWithStyleAndBoxModelMetrics should be inherited by any layout node that cares about box model metrics (margin, border, and padding.) LayoutBox should be inherited by any layout node that can have a rect. This makes LayoutText significantly smaller (from 140 to 40 bytes) and clarifies a lot of things about the layout tree. I'm also adding next_sibling() and previous_sibling() overloads to LayoutBlock that return a LayoutBlock*. This is okay since blocks only ever have block siblings. Do also note that the semantics of is<T> slightly change in this patch: is<T>(nullptr) now returns true, to facilitate allowing to<T>(nullptr).
2019-10-15 17:48:38 +03:00
}
LibHTML: Add an empty CSS parser.
2019-06-21 21:54:13 +03:00
LibWeb: Rename Layout::BlockBox => BlockContainer There's a subtle difference here. A "block box" in the spec is a block-level box, while a "block container" is a box whose children are either all inline-level boxes in an IFC, or all block-level boxes participating in a BFC. Notably, an "inline-block" box is a "block container" but not a "block box" since it is itself inline-level.
2021-10-06 21:02:41 +03:00
if (is<Layout::BlockContainer>(layout_node) && static_cast<Layout::BlockContainer const&>(layout_node).children_are_inline()) {
auto& block = static_cast<Layout::BlockContainer const&>(layout_node);
LibWeb: Don't crash when dumping layout tree pre-layout If we haven't run layout yet, there aren't any paintables attached to the tree, so we have to null check them.
2022-03-19 00:12:03 +03:00
for (size_t line_box_index = 0; block.paint_box() && line_box_index < block.paint_box()->line_boxes().size(); ++line_box_index) {
LibWeb: Make Painting::Box virtual and add Painting::BoxWithLines BlockContainer paint boxes are the only ones that have line boxes associated, so let's not waste memory on line boxes in all the other types of boxes. This also adds Layout::Box::paint_box() and the more tightly typed Layout::BlockContainer::paint_box() to get at the paint box from the corresponding layout box.
2022-03-10 13:12:06 +03:00
auto& line_box = block.paint_box()->line_boxes()[line_box_index];
AK: Make Vector use size_t for its size and capacity
2020-02-25 16:49:47 +03:00
for (size_t i = 0; i < indent; ++i)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append(" ");
LibWeb: Bring CSS line-height implementation closer to spec We now distribute the line-height evenly between the space above and below inline-level boxes. This noticeably improves our baseline alignment in many cases. Note that the "vertical-align: <length>" case is quite awkward, as the extra height added by the offset baseline must count towards the line box height. There's a lot of room for improvement here, but this makes the buckets container on Acid3 show up in the right place, with the right size.
2022-03-25 00:45:51 +03:00
builder.appendff(" {}line {}{} width: {}, height: {}, bottom: {}, baseline: {}\n",
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
line_box_color_on,
line_box_index,
color_off,
LibWeb: Store bottom edge location with each LineBox Previously we were computing the bottom edge of a line box by finding the bottommost fragment on the line. That method didn't give correct results for line boxes with no fragments (which is exactly what you get when inserting a bunch of <br> elements.) To cover all situations, we now keep track of the bottommost edge in the LineBox object itself.
2022-02-27 15:34:34 +03:00
line_box.width(),
LibWeb: Bring CSS line-height implementation closer to spec We now distribute the line-height evenly between the space above and below inline-level boxes. This noticeably improves our baseline alignment in many cases. Note that the "vertical-align: <length>" case is quite awkward, as the extra height added by the offset baseline must count towards the line box height. There's a lot of room for improvement here, but this makes the buckets container on Acid3 show up in the right place, with the right size.
2022-03-25 00:45:51 +03:00
line_box.height(),
LibWeb: Align actual baselines, not just bottoms Until now, we've been treating the bottom of every line box fragment as its baseline, and just aligning all the bottoms to the bottom of the line box. That gave decent results in many cases, but was not correct. This patch starts moving towards actual baseline calculations as specified by CSS2. Note that once layout is finished with a line box, we also store the baseline of the line box in LineBox::m_baseline. This allows us to align the real baseline of display:inline-block elements with other inline content on the same line.
2022-03-03 12:09:10 +03:00
line_box.bottom(),
line_box.baseline());
AK: Make Vector use size_t for its size and capacity
2020-02-25 16:49:47 +03:00
for (size_t fragment_index = 0; fragment_index < line_box.fragments().size(); ++fragment_index) {
LibHTML: Rewrite inline and text layout Inline layout is now done by LayoutBlock. Blocks with inline children will split them into line boxes during layout. A LayoutBlock can have zero or more LineBox objects. Each LineBox represents one visual line. A LineBox can have any number of LineBoxFragment children. A fragment is an offset+length into a specific LayoutNode. To paint a LayoutBlock with inline children, we walk its line boxes, and walk their fragments, painting each fragment at a time by calling LineBoxFragment::render(), which in turn calls the LayoutNode via LayoutText::render_fragment(). Hit testing works similarly. This is very incomplete and has many bugs, but should make it easier for us to move forward with this code.
2019-10-03 16:20:13 +03:00
auto& fragment = line_box.fragments()[fragment_index];
AK: Make Vector use size_t for its size and capacity
2020-02-25 16:49:47 +03:00
for (size_t i = 0; i < indent; ++i)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append(" ");
builder.appendff(" {}frag {}{} from {} ",
fragment_color_on,
LibHTML: Rewrite inline and text layout Inline layout is now done by LayoutBlock. Blocks with inline children will split them into line boxes during layout. A LayoutBlock can have zero or more LineBox objects. Each LineBox represents one visual line. A LineBox can have any number of LineBoxFragment children. A fragment is an offset+length into a specific LayoutNode. To paint a LayoutBlock with inline children, we walk its line boxes, and walk their fragments, painting each fragment at a time by calling LineBoxFragment::render(), which in turn calls the LayoutNode via LayoutText::render_fragment(). Hit testing works similarly. This is very incomplete and has many bugs, but should make it easier for us to move forward with this code.
2019-10-03 16:20:13 +03:00
fragment_index,
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
color_off,
fragment.layout_node().class_name());
if (interactive)
builder.appendff("@{:p}, ", &fragment.layout_node());
builder.appendff("start: {}, length: {}, rect: {}\n",
LibHTML: Rewrite inline and text layout Inline layout is now done by LayoutBlock. Blocks with inline children will split them into line boxes during layout. A LayoutBlock can have zero or more LineBox objects. Each LineBox represents one visual line. A LineBox can have any number of LineBoxFragment children. A fragment is an offset+length into a specific LayoutNode. To paint a LayoutBlock with inline children, we walk its line boxes, and walk their fragments, painting each fragment at a time by calling LineBoxFragment::render(), which in turn calls the LayoutNode via LayoutText::render_fragment(). Hit testing works similarly. This is very incomplete and has many bugs, but should make it easier for us to move forward with this code.
2019-10-03 16:20:13 +03:00
fragment.start(),
fragment.length(),
LibWeb: Display actual (float) values when dumping layout
2021-09-21 14:42:42 +03:00
fragment.absolute_rect().to_string());
LibWeb: Remove hand-rolled is_foo() helpers in Layout::Node classes
2021-01-01 20:55:47 +03:00
if (is<Layout::TextNode>(fragment.layout_node())) {
AK: Make Vector use size_t for its size and capacity
2020-02-25 16:49:47 +03:00
for (size_t i = 0; i < indent; ++i)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append(" ");
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
auto& layout_text = static_cast<Layout::TextNode const&>(fragment.layout_node());
LibHTML: Use LayoutText::text_for_rendering() in layout tree dumps This way the fragment offsets make a lot more sense, since they assume whitespace has already been collapsed.
2019-11-19 20:36:33 +03:00
auto fragment_text = layout_text.text_for_rendering().substring(fragment.start(), fragment.length());
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.appendff(" \"{}\"\n", fragment_text);
LibHTML: Rewrite inline and text layout Inline layout is now done by LayoutBlock. Blocks with inline children will split them into line boxes during layout. A LayoutBlock can have zero or more LineBox objects. Each LineBox represents one visual line. A LineBox can have any number of LineBoxFragment children. A fragment is an offset+length into a specific LayoutNode. To paint a LayoutBlock with inline children, we walk its line boxes, and walk their fragments, painting each fragment at a time by calling LineBoxFragment::render(), which in turn calls the LayoutNode via LayoutText::render_fragment(). Hit testing works similarly. This is very incomplete and has many bugs, but should make it easier for us to move forward with this code.
2019-10-03 16:20:13 +03:00
}
}
}
}
LibWeb: Rename Element::specified_css_values() => computed_css_values() Let's make it very clear that these are *computed* values, and not at all the specified values. The specified values are currently discarded by the CSS cascade algorithm.
2022-03-15 21:41:35 +03:00
if (show_specified_style && layout_node.dom_node() && layout_node.dom_node()->is_element() && verify_cast<DOM::Element>(layout_node.dom_node())->computed_css_values()) {
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.
2020-12-07 21:36:13 +03:00
struct NameAndValue {
String name;
String value;
};
Vector<NameAndValue> properties;
LibWeb: Rename Element::specified_css_values() => computed_css_values() Let's make it very clear that these are *computed* values, and not at all the specified values. The specified values are currently discarded by the CSS cascade algorithm.
2022-03-15 21:41:35 +03:00
verify_cast<DOM::Element>(*layout_node.dom_node()).computed_css_values()->for_each_property([&](auto property_id, auto& value) {
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.
2020-12-07 21:36:13 +03:00
properties.append({ CSS::string_from_property_id(property_id), value.to_string() });
});
quick_sort(properties, [](auto& a, auto& b) { return a.name < b.name; });
LibWeb: Dump layout node style properties in alphabetical order
2020-06-14 19:47:21 +03: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.
2020-12-07 21:36:13 +03:00
for (auto& property : properties) {
for (size_t i = 0; i < indent; ++i)
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
builder.append(" ");
LibWeb: Convert StringBuilder::appendf() => AK::Format
2021-05-07 21:47:25 +03:00
builder.appendff(" ({}: {})\n", property.name, property.value);
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.
2020-12-07 21:36:13 +03:00
}
LibWeb: Dump layout node style properties in alphabetical order
2020-06-14 19:47:21 +03:00
}
LibHTML: Get rid of the style tree We now create a layout tree directly from the DOM tree. This way we don't actually lose text nodes ^)
2019-09-21 15:32:17 +03:00
LibHTML: Start building the style tree. Walk the DOM and construct a parallel style tree that points back to the DOM and has the relevant CSS property values hanging off of them. The values are picked based on naive selector matching. There's no cascade or specificity taken into account yet.
2019-06-28 22:17:34 +03:00
++indent;
LibWeb: Allow dumping layout tree into a StringBuilder
2020-12-09 00:11:02 +03:00
layout_node.for_each_child([&](auto& child) {
dump_tree(builder, child, show_box_model, show_specified_style, interactive);
LibHTML: Start building the style tree. Walk the DOM and construct a parallel style tree that points back to the DOM and has the relevant CSS property values hanging off of them. The values are picked based on naive selector matching. There's no cascade or specificity taken into account yet.
2019-06-28 22:17:34 +03:00
});
--indent;
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_selector(CSS::Selector const& selector)
LibHTML: Implement some very simple selector matching. We walk the entire DOM and check all selectors against all elements. Only id, class and tag name are checked right now. There's no ancestor stack or compound selectors. All in good time :^)
2019-06-27 21:40:21 +03:00
{
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
StringBuilder builder;
dump_selector(builder, selector);
dbgln("{}", builder.string_view());
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_selector(StringBuilder& builder, CSS::Selector const& selector)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
{
builder.append(" CSS::Selector:\n");
LibHTML: Implement compound selectors This patch moves the Selector object model closer to the specification objects in Selectors Level 4. A "Selector" in LibHTML is now a { Vector<ComplexSelector> }, which is a { Relation, CompoundSelector }. A CompoundSelector is really just a Vector<SimpleSelector>, and SimpleSelector is "Component" renamed. This makes a lot more selectors actually match on the Ubuntu Apache2 default homepage. :^)
2019-11-27 22:37:36 +03:00
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
for (auto& relative_selector : selector.compound_selectors()) {
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append(" ");
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
char const* relation_description = "";
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
switch (relative_selector.combinator) {
case CSS::Selector::Combinator::None:
LibWeb: Support more advanced selectors in document.querySelectorAll() I made some mistakes in the selector parsing code. It's now able to parse selectors composed of multiple complex selectors, instead of just one complex selector.
2020-03-29 23:45:38 +03:00
relation_description = "None";
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
break;
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
case CSS::Selector::Combinator::ImmediateChild:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
relation_description = "ImmediateChild";
break;
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
case CSS::Selector::Combinator::Descendant:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
relation_description = "Descendant";
break;
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
case CSS::Selector::Combinator::NextSibling:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
relation_description = "AdjacentSibling";
break;
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
case CSS::Selector::Combinator::SubsequentSibling:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
relation_description = "GeneralSibling";
break;
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
case CSS::Selector::Combinator::Column:
LibWeb: Add selector support to the new CSSParser This is stolen from the old parser, but it seems to parse fine :^)
2021-04-29 22:16:28 +03:00
relation_description = "Column";
break;
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
}
LibHTML: Implement compound selectors This patch moves the Selector object model closer to the specification objects in Selectors Level 4. A "Selector" in LibHTML is now a { Vector<ComplexSelector> }, which is a { Relation, CompoundSelector }. A CompoundSelector is really just a Vector<SimpleSelector>, and SimpleSelector is "Component" renamed. This makes a lot more selectors actually match on the Ubuntu Apache2 default homepage. :^)
2019-11-27 22:37:36 +03:00
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
if (*relation_description)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.appendff("{{{}}} ", relation_description);
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
for (size_t i = 0; i < relative_selector.simple_selectors.size(); ++i) {
auto& simple_selector = relative_selector.simple_selectors[i];
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
char const* type_description = "Unknown";
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
switch (simple_selector.type) {
LibWeb: Move CSS classes into the Web::CSS namespace
2020-07-26 21:01:35 +03:00
case CSS::Selector::SimpleSelector::Type::Universal:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
type_description = "Universal";
LibHTML: Various little improvements to the CSS parser The parser now kinda recognizes immediate child selectors, !important, and various other little things. It's still extremely far from robust and/or correct. :^)
2019-10-06 10:28:10 +03:00
break;
LibWeb: Move CSS classes into the Web::CSS namespace
2020-07-26 21:01:35 +03:00
case CSS::Selector::SimpleSelector::Type::Id:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
type_description = "Id";
LibHTML: Parse descendant relations in CSS selectors "div p" now generates a Selector with two components where the second component is a type=TagName, value="p", relation=Descendant. We still don't handle matching of these, but at least we parse them.
2019-10-06 12:05:57 +03:00
break;
LibWeb: Move CSS classes into the Web::CSS namespace
2020-07-26 21:01:35 +03:00
case CSS::Selector::SimpleSelector::Type::Class:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
type_description = "Class";
LibHTML: Add adjacent (+) and general (~) sibling combinators This patch implements two more selector features: - "div + p" matches the <p> sibling immediately after a <div>. - "div ~ p" matches all <p> siblings after a <div>.
2019-10-06 20:59:07 +03:00
break;
LibWeb: Move CSS classes into the Web::CSS namespace
2020-07-26 21:01:35 +03:00
case CSS::Selector::SimpleSelector::Type::TagName:
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
type_description = "TagName";
break;
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
case CSS::Selector::SimpleSelector::Type::Attribute:
type_description = "Attribute";
LibWeb: Add selector support to the new CSSParser This is stolen from the old parser, but it seems to parse fine :^)
2021-04-29 22:16:28 +03:00
break;
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
case CSS::Selector::SimpleSelector::Type::PseudoClass:
type_description = "PseudoClass";
LibWeb: Add :not pseudoclass to the CSS parser The selector given in the :not() is stored in the SimpleSelector as a String.
2021-05-23 21:59:26 +03:00
break;
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
case CSS::Selector::SimpleSelector::Type::PseudoElement:
type_description = "PseudoElement";
break;
LibWeb: Include selector pseudo-class in style sheet dumps
2020-06-13 01:43:06 +03:00
}
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
builder.appendff("{}:", type_description);
// FIXME: This is goofy
if (simple_selector.value.has<FlyString>())
builder.append(simple_selector.name());
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
if (simple_selector.type == CSS::Selector::SimpleSelector::Type::PseudoClass) {
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
auto const& pseudo_class = simple_selector.pseudo_class();
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
char const* pseudo_class_description = "";
switch (pseudo_class.type) {
case CSS::Selector::SimpleSelector::PseudoClass::Type::Link:
pseudo_class_description = "Link";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Visited:
pseudo_class_description = "Visited";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Active:
pseudo_class_description = "Active";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Root:
pseudo_class_description = "Root";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::FirstOfType:
pseudo_class_description = "FirstOfType";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::LastOfType:
pseudo_class_description = "LastOfType";
break;
LibWeb: Support CSS :only-of-type selector This matches any element that doesn't have a sibling with the same tag name as itself.
2022-02-18 00:43:22 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::OnlyOfType:
pseudo_class_description = "OnlyOfType";
break;
LibWeb: Implement :nth-of-type and :nth-last-of-type selectors :^)
2022-02-26 16:53:13 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::NthOfType:
pseudo_class_description = "NthOfType";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastOfType:
pseudo_class_description = "NthLastOfType";
break;
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::NthChild:
pseudo_class_description = "NthChild";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastChild:
pseudo_class_description = "NthLastChild";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Focus:
pseudo_class_description = "Focus";
break;
LibWeb: Implement the :focus-within selector This matches if it has focus, or any nodes inside it do.
2022-03-20 16:28:32 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::FocusWithin:
pseudo_class_description = "FocusWithin";
break;
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::Empty:
pseudo_class_description = "Empty";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Hover:
pseudo_class_description = "Hover";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::LastChild:
pseudo_class_description = "LastChild";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::FirstChild:
pseudo_class_description = "FirstChild";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::OnlyChild:
pseudo_class_description = "OnlyChild";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Disabled:
pseudo_class_description = "Disabled";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Enabled:
pseudo_class_description = "Enabled";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Checked:
pseudo_class_description = "Checked";
break;
case CSS::Selector::SimpleSelector::PseudoClass::Type::Not:
pseudo_class_description = "Not";
break;
LibWeb: Implement the :is() selector This lets us finally get rid of a FIXME in the default style sheet. :^)
2022-03-17 18:28:42 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::Is:
pseudo_class_description = "Is";
break;
LibWeb: Implement the :where() selector This is identical to :is() except for specificity, so we can use the same code paths. :^)
2022-03-17 19:13:13 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::Where:
pseudo_class_description = "Where";
break;
LibWeb: Add basic support for :lang() CSS selector This doesn't have parsing support for multiple languages in the same selector. Support for language subcodes is not great either. But it does do the basics.
2022-03-20 14:39:11 +03:00
case CSS::Selector::SimpleSelector::PseudoClass::Type::Lang:
pseudo_class_description = "Lang";
break;
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
}
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.appendff(" pseudo_class={}", pseudo_class_description);
LibWeb: Add basic support for :lang() CSS selector This doesn't have parsing support for multiple languages in the same selector. Support for language subcodes is not great either. But it does do the basics.
2022-03-20 14:39:11 +03:00
if (pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::Lang) {
builder.append('(');
builder.join(',', pseudo_class.languages);
builder.append(')');
} else if (pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::Not
LibWeb: Implement the :where() selector This is identical to :is() except for specificity, so we can use the same code paths. :^)
2022-03-17 19:13:13 +03:00
|| pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::Is
|| pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::Where) {
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
builder.append("([");
LibWeb: Implement the :is() selector This lets us finally get rid of a FIXME in the default style sheet. :^)
2022-03-17 18:28:42 +03:00
for (auto& selector : pseudo_class.argument_selector_list)
LibWeb: Use Selectors instead of a String for :not() selectors Rather than parsing the selector every time we want to check it, we now parse it once at the beginning. A bonus effect of this is that we now support a selector list in :not(), instead of just a single selector, though only when using the new parser.
2021-07-12 19:58:47 +03:00
dump_selector(builder, selector);
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
builder.append("])");
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
} else if ((pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::NthChild)
LibWeb: Implement `:nth-[last-]child(n of foo)` syntax In Selectors level 4, `:nth-child()` and `:nth-last-child()` can both optionally take a selector-list argument. This selector-list acts as a filter, so that only elements matching the list are counted. For example, this means that the following are equivalent: ```css :nth-child(2n+1 of p) {} p:nth-of-type(2n+1) {} ```
2022-03-17 22:13:51 +03:00
|| (pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastChild)
|| (pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::NthOfType)
|| (pseudo_class.type == CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastOfType)) {
builder.appendff("(step={}, offset={}", pseudo_class.nth_child_pattern.step_size, pseudo_class.nth_child_pattern.offset);
if (!pseudo_class.argument_selector_list.is_empty()) {
builder.append(", selectors=[");
for (auto const& child_selector : pseudo_class.argument_selector_list)
dump_selector(builder, child_selector);
builder.append("]");
}
builder.append(")");
LibWeb: Add 'PseudoClass' as a CSS SimpleSelector::Type Same reasoning as the previous commit.
2021-07-12 18:18:00 +03:00
}
}
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
if (simple_selector.type == CSS::Selector::SimpleSelector::Type::PseudoElement) {
char const* pseudo_element_description = "";
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
switch (simple_selector.pseudo_element()) {
LibWeb: Move PseudoElement enum up a level This in preparation for changing how we store these, plus it's unwieldy having to type CSS::Selector::SimpleSelector::PseudoElement.
2022-02-24 18:13:20 +03:00
case CSS::Selector::PseudoElement::Before:
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
pseudo_element_description = "before";
break;
LibWeb: Move PseudoElement enum up a level This in preparation for changing how we store these, plus it's unwieldy having to type CSS::Selector::SimpleSelector::PseudoElement.
2022-02-24 18:13:20 +03:00
case CSS::Selector::PseudoElement::After:
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
pseudo_element_description = "after";
break;
LibWeb: Move PseudoElement enum up a level This in preparation for changing how we store these, plus it's unwieldy having to type CSS::Selector::SimpleSelector::PseudoElement.
2022-02-24 18:13:20 +03:00
case CSS::Selector::PseudoElement::FirstLine:
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
pseudo_element_description = "first-line";
break;
LibWeb: Move PseudoElement enum up a level This in preparation for changing how we store these, plus it's unwieldy having to type CSS::Selector::SimpleSelector::PseudoElement.
2022-02-24 18:13:20 +03:00
case CSS::Selector::PseudoElement::FirstLetter:
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
pseudo_element_description = "first-letter";
break;
LibWeb: Implement the ::marker pseudo-element This matches the marker boxes of list-items.
2022-02-25 20:29:38 +03:00
case CSS::Selector::PseudoElement::Marker:
pseudo_element_description = "marker";
break;
LibWeb: Add 'PseudoElement' as a CSS SimpleSelector::Type Same reasoning again! This is the last one. While I was at it, I added the two remaining CSS2.2 pseudo-elements, ::first-line and ::first-letter. All 4 are handled in the new CSS parser, including with the compatibility single-colon syntax. I have not added support to the old parser.
2021-07-12 18:34:18 +03:00
}
builder.appendff(" pseudo_element={}", pseudo_element_description);
}
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
if (simple_selector.type == CSS::Selector::SimpleSelector::Type::Attribute) {
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
auto const& attribute = simple_selector.attribute();
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
char const* attribute_match_type_description = "";
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
switch (attribute.match_type) {
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
case CSS::Selector::SimpleSelector::Attribute::MatchType::HasAttribute:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "HasAttribute";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::ExactValueMatch:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "ExactValueMatch";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::ContainsWord:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "ContainsWord";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::ContainsString:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "ContainsString";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::StartsWithSegment:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "StartsWithSegment";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::StartsWithString:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "StartsWithString";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
case CSS::Selector::SimpleSelector::Attribute::MatchType::EndsWithString:
LibWeb: Fix dump_selector() handling of attribute selectors Encountering an attribute selector was immediately ending the dump output by mistake, and it was assigning the match types to the wrong variable.
2021-07-24 15:28:45 +03:00
attribute_match_type_description = "EndsWithString";
LibWeb: Add 'Attribute' as a CSS SimpleSelector::Type Previously, SimpleSelectors optionally had Attribute-selector data as well as their main type. Now, they're either one or the other, which better matches the spec, and makes parsing and matching more straightforward.
2021-07-12 16:58:03 +03:00
break;
}
LibWeb: Use a Variant for SimpleSelector's contents This reduces SimpleSelector's size from 112 bytes to 80 bytes. :^)
2022-03-21 18:43:59 +03:00
builder.appendff(" [{}, name='{}', value='{}']", attribute_match_type_description, attribute.name, attribute.value);
LibHTML: Implement some attribute selector support This patch adds a[foo] and a[foo=bar] attribute selectors. Note that an attribute selector is an optional part of a selector component, and not a component on its own.
2019-11-21 22:07:43 +03:00
}
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
LibWeb: Bring Selector terminology in line with the CSS spec - CompoundSelector -> *deleted* - ComplexSelector -> CompoundSelector - Relation -> Combinator Our Selector is really a ComplexSelector, but only the Parser and SelectorEngine need to know that, so keeping it named Selector makes it more understandable for users. Our CompoundSelector is really a CompoundSelectorAndCombinator. Combining the two makes sense in our codebase, but the accurate name is so long that I think it makes the code less readable. Renamed some Combinators to also match the spec terminology: - AdjacentSibling -> NextSibling - GeneralSibling -> SubsequentSibling The previous names are somewhat ambiguous, so hopefully this is clearer.
2021-07-23 17:24:33 +03:00
if (i != relative_selector.simple_selectors.size() - 1)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append(", ");
LibHTML: Implement some very simple selector matching. We walk the entire DOM and check all selectors against all elements. Only id, class and tag name are checked right now. There's no ancestor stack or compound selectors. All in good time :^)
2019-06-27 21:40:21 +03:00
}
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append("\n");
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
}
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_rule(CSS::CSSRule const& rule)
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
{
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
StringBuilder builder;
dump_rule(builder, rule);
dbgln("{}", builder.string_view());
}
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
void dump_rule(StringBuilder& builder, CSS::CSSRule const& rule, int indent_levels)
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
{
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
indent(builder, indent_levels);
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
builder.appendff("{}:\n", rule.class_name());
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
switch (rule.type()) {
LibWeb: Implement initial CSSFontFaceRule and FontFace classes For now, this is the bare minimum that's needed: font-family and src.
2022-03-28 22:30:26 +03:00
case CSS::CSSRule::Type::FontFace:
dump_font_face_rule(builder, verify_cast<CSS::CSSFontFaceRule const>(rule), indent_levels);
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
break;
LibWeb: Added simple parsing for (at)import rules For now, the parsing is very crude, and parses only the document url. The meta queries for the import are ignored.
2021-02-21 19:36:34 +03:00
case CSS::CSSRule::Type::Import:
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
dump_import_rule(builder, verify_cast<CSS::CSSImportRule const>(rule), indent_levels);
break;
case CSS::CSSRule::Type::Media:
dump_media_rule(builder, verify_cast<CSS::CSSMediaRule const>(rule), indent_levels);
LibWeb: Added simple parsing for (at)import rules For now, the parsing is very crude, and parses only the document url. The meta queries for the import are ignored.
2021-02-21 19:36:34 +03:00
break;
LibWeb: Implement initial CSSFontFaceRule and FontFace classes For now, this is the bare minimum that's needed: font-family and src.
2022-03-28 22:30:26 +03:00
case CSS::CSSRule::Type::Style:
dump_style_rule(builder, verify_cast<CSS::CSSStyleRule const>(rule), indent_levels);
break;
LibWeb: Implement `@supports` rule :^) The main thing missing is that we don't serialize the supports clause, but for actually using a `@supports (something: cool) {}` rule in CSS, it works!
2021-10-08 19:48:14 +03:00
case CSS::CSSRule::Type::Supports:
dump_supports_rule(builder, verify_cast<CSS::CSSSupportsRule const>(rule), indent_levels);
break;
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
case CSS::CSSRule::Type::__Count:
LibWeb: Create base class CSSRule for all CSS rules This is a foundation for handling other ("at") CSS rules.
2021-02-21 14:45:26 +03:00
VERIFY_NOT_REACHED();
}
}
LibWeb: Implement initial CSSFontFaceRule and FontFace classes For now, this is the bare minimum that's needed: font-family and src.
2022-03-28 22:30:26 +03:00
void dump_font_face_rule(StringBuilder& builder, CSS::CSSFontFaceRule const& rule, int indent_levels)
{
auto& font_face = rule.font_face();
indent(builder, indent_levels + 1);
builder.appendff("font-family: {}\n", font_face.font_family());
indent(builder, indent_levels + 1);
builder.append("sources:\n");
for (auto const& source : font_face.sources()) {
indent(builder, indent_levels + 2);
builder.appendff("{}\n", source.url);
}
}
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
void dump_import_rule(StringBuilder& builder, CSS::CSSImportRule const& rule, int indent_levels)
LibWeb: Added simple parsing for (at)import rules For now, the parsing is very crude, and parses only the document url. The meta queries for the import are ignored.
2021-02-21 19:36:34 +03:00
{
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
indent(builder, indent_levels);
LibWeb: Added simple parsing for (at)import rules For now, the parsing is very crude, and parses only the document url. The meta queries for the import are ignored.
2021-02-21 19:36:34 +03:00
builder.appendff(" Document URL: {}\n", rule.url());
}
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
void dump_media_rule(StringBuilder& builder, CSS::CSSMediaRule const& media, int indent_levels)
{
indent(builder, indent_levels);
builder.appendff(" Media: {}\n Rules ({}):\n", media.condition_text(), media.css_rules().length());
for (auto& rule : media.css_rules()) {
dump_rule(builder, rule, indent_levels + 1);
}
}
LibWeb: Implement `@supports` rule :^) The main thing missing is that we don't serialize the supports clause, but for actually using a `@supports (something: cool) {}` rule in CSS, it works!
2021-10-08 19:48:14 +03:00
void dump_supports_rule(StringBuilder& builder, CSS::CSSSupportsRule const& supports, int indent_levels)
{
indent(builder, indent_levels);
builder.appendff(" Supports: {}\n Rules ({}):\n", supports.condition_text(), supports.css_rules().length());
for (auto& rule : supports.css_rules()) {
dump_rule(builder, rule, indent_levels + 1);
}
}
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
void dump_style_rule(StringBuilder& builder, CSS::CSSStyleRule const& rule, int indent_levels)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
{
LibWeb: Add naive support for document.querySelectorAll() This currently returns a JS::Array of elements matching a selector. The more correct behavior would be to return a static NodeList, but as we don't have NodeLists right now, that'll be a task for the future.
2020-03-29 23:24:23 +03:00
for (auto& selector : rule.selectors()) {
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
dump_selector(builder, selector);
LibHTML: Implement some very simple selector matching. We walk the entire DOM and check all selectors against all elements. Only id, class and tag name are checked right now. There's no ancestor stack or compound selectors. All in good time :^)
2019-06-27 21:40:21 +03:00
}
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
indent(builder, indent_levels);
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
builder.append(" Declarations:\n");
LibWeb: Include custom properties in CSS dump
2021-11-30 19:23:35 +03:00
auto& style_declaration = verify_cast<CSS::PropertyOwningCSSStyleDeclaration>(rule.declaration());
for (auto& property : style_declaration.properties()) {
LibWeb: Add CSSMediaRule This is the class corresponding to a `@media` rule. It contains a list of media queries and a list of child css rules.
2021-09-29 14:48:04 +03:00
indent(builder, indent_levels);
LibWeb: Include the "important" flag in CSS dumps
2021-09-21 12:29:44 +03:00
builder.appendff(" {}: '{}'", CSS::string_from_property_id(property.property_id), property.value->to_string());
LibWeb: Add an enum for !important
2022-02-12 17:53:59 +03:00
if (property.important == CSS::Important::Yes)
LibWeb: Include the "important" flag in CSS dumps
2021-09-21 12:29:44 +03:00
builder.append(" \033[31;1m!important\033[0m");
builder.append('\n');
LibHTML: Implement some very simple selector matching. We walk the entire DOM and check all selectors against all elements. Only id, class and tag name are checked right now. There's no ancestor stack or compound selectors. All in good time :^)
2019-06-27 21:40:21 +03:00
}
LibWeb: Include custom properties in CSS dump
2021-11-30 19:23:35 +03:00
for (auto& property : style_declaration.custom_properties()) {
indent(builder, indent_levels);
builder.appendff(" {}: '{}'", property.key, property.value.value->to_string());
LibWeb: Add an enum for !important
2022-02-12 17:53:59 +03:00
if (property.value.important == CSS::Important::Yes)
LibWeb: Include custom properties in CSS dump
2021-11-30 19:23:35 +03:00
builder.append(" \033[31;1m!important\033[0m");
builder.append('\n');
}
LibHTML: Implement some very simple selector matching. We walk the entire DOM and check all selectors against all elements. Only id, class and tag name are checked right now. There's no ancestor stack or compound selectors. All in good time :^)
2019-06-27 21:40:21 +03:00
}
LibWeb: Convert CSS Dump, Selector, & SelectorEngine to east const
2021-07-12 16:13:29 +03:00
void dump_sheet(CSS::StyleSheet const& sheet)
LibHTML: Add an empty CSS parser.
2019-06-21 21:54:13 +03:00
{
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
StringBuilder builder;
dump_sheet(builder, sheet);
dbgln("{}", builder.string_view());
}
Userland: Replace VERIFY(is<T>) with verify_cast<T> Instead of doing a VERIFY(is<T>(x)) and *then* casting it to T, we can just do the cast right away with verify_cast<T>. :^)
2021-06-24 22:13:09 +03:00
void dump_sheet(StringBuilder& builder, CSS::StyleSheet const& sheet)
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
{
Userland: Replace VERIFY(is<T>) with verify_cast<T> Instead of doing a VERIFY(is<T>(x)) and *then* casting it to T, we can just do the cast right away with verify_cast<T>. :^)
2021-06-24 22:13:09 +03:00
auto& css_stylesheet = verify_cast<CSS::CSSStyleSheet>(sheet);
LibHTML: Flesh out the code to dump a StyleSheet object graph.
2019-06-25 07:31:47 +03:00
LibWeb: Use a CSSRuleList inside CSSStyleSheet This better matches the spec. :^)
2021-09-28 18:18:20 +03:00
builder.appendff("CSSStyleSheet{{{}}}: {} rule(s)\n", &sheet, css_stylesheet.rules().length());
LibWeb: Split CSS::StyleSheet into StyleSheet and CSSStyleSheet This is a little convoluted but matches the CSSOM specification.
2021-03-07 18:14:04 +03:00
Userland: Replace VERIFY(is<T>) with verify_cast<T> Instead of doing a VERIFY(is<T>(x)) and *then* casting it to T, we can just do the cast right away with verify_cast<T>. :^)
2021-06-24 22:13:09 +03:00
for (auto& rule : css_stylesheet.rules()) {
LibWeb: Convert dbgprintf() => dbgln()
2021-02-17 17:59:13 +03:00
dump_rule(builder, rule);
LibHTML: Flesh out the code to dump a StyleSheet object graph.
2019-06-25 07:31:47 +03:00
}
LibHTML: Add an empty CSS parser.
2019-06-21 21:54:13 +03:00
}
LibWeb: Move everything into the Web namespace
2020-03-07 12:27:02 +03:00
}
Reference in New Issue Copy Permalink