1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-06-10 18:10:56 +09:00

LibWeb: Implement :host and :host(<compound-selector>) selector matching

The :host family of pseudo class selectors select the shadow host
element when matching against a rule from within the element's shadow
tree.

This is a bit convoluted due to the fact that the document-level
StyleComputer keeps track of *all* style rules, and not just the
document-level ones.

In the future, we should refactor style storage so that shadow roots
have their own style scope, and we can simplify a lot of this.
This commit is contained in:
Andreas Kling 2024-07-23 15:22:28 +02:00 committed by Andreas Kling
parent 274c46a3c9
commit 4c326fc5f6
Notes: github-actions[bot] 2024-07-23 16:04:40 +00:00
7 changed files with 127 additions and 44 deletions

View file

@ -12,6 +12,7 @@
#include <LibWeb/DOM/HTMLCollection.h>
#include <LibWeb/DOM/NodeOperations.h>
#include <LibWeb/DOM/ParentNode.h>
#include <LibWeb/DOM/ShadowRoot.h>
#include <LibWeb/DOM/StaticNodeList.h>
#include <LibWeb/Dump.h>
#include <LibWeb/Infra/CharacterTypes.h>
@ -44,7 +45,7 @@ WebIDL::ExceptionOr<JS::GCPtr<Element>> ParentNode::query_selector(StringView se
// FIXME: This should be shadow-including. https://drafts.csswg.org/selectors-4/#match-a-selector-against-a-tree
for_each_in_subtree_of_type<Element>([&](auto& element) {
for (auto& selector : selectors) {
if (SelectorEngine::matches(selector, {}, element, {}, this)) {
if (SelectorEngine::matches(selector, {}, element, nullptr, {}, this)) {
result = &element;
return TraversalDecision::Break;
}
@ -76,7 +77,7 @@ WebIDL::ExceptionOr<JS::NonnullGCPtr<NodeList>> ParentNode::query_selector_all(S
// FIXME: This should be shadow-including. https://drafts.csswg.org/selectors-4/#match-a-selector-against-a-tree
for_each_in_subtree_of_type<Element>([&](auto& element) {
for (auto& selector : selectors) {
if (SelectorEngine::matches(selector, {}, element, {}, this)) {
if (SelectorEngine::matches(selector, {}, element, nullptr, {}, this)) {
elements.append(&element);
}
}