SelectorEngine.cpp 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. /*
  2. * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
  3. * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
  4. *
  5. * SPDX-License-Identifier: BSD-2-Clause
  6. */
  7. #include <LibWeb/CSS/Parser/Parser.h>
  8. #include <LibWeb/CSS/SelectorEngine.h>
  9. #include <LibWeb/DOM/Document.h>
  10. #include <LibWeb/DOM/Element.h>
  11. #include <LibWeb/DOM/Text.h>
  12. #include <LibWeb/HTML/AttributeNames.h>
  13. #include <LibWeb/HTML/HTMLHtmlElement.h>
  14. #include <LibWeb/HTML/HTMLInputElement.h>
  15. namespace Web::SelectorEngine {
  16. static inline bool matches_hover_pseudo_class(DOM::Element const& element)
  17. {
  18. auto* hovered_node = element.document().hovered_node();
  19. if (!hovered_node)
  20. return false;
  21. if (&element == hovered_node)
  22. return true;
  23. return element.is_ancestor_of(*hovered_node);
  24. }
  25. static inline bool matches_attribute(CSS::Selector::SimpleSelector::Attribute const& attribute, DOM::Element const& element)
  26. {
  27. switch (attribute.match_type) {
  28. case CSS::Selector::SimpleSelector::Attribute::MatchType::HasAttribute:
  29. return element.has_attribute(attribute.name);
  30. case CSS::Selector::SimpleSelector::Attribute::MatchType::ExactValueMatch:
  31. return element.attribute(attribute.name) == attribute.value;
  32. case CSS::Selector::SimpleSelector::Attribute::MatchType::ContainsWord:
  33. return element.attribute(attribute.name).split_view(' ').contains_slow(attribute.value);
  34. case CSS::Selector::SimpleSelector::Attribute::MatchType::ContainsString:
  35. return element.attribute(attribute.name).contains(attribute.value);
  36. case CSS::Selector::SimpleSelector::Attribute::MatchType::StartsWithSegment: {
  37. auto segments = element.attribute(attribute.name).split_view('-');
  38. return !segments.is_empty() && segments.first() == attribute.value;
  39. }
  40. case CSS::Selector::SimpleSelector::Attribute::MatchType::StartsWithString:
  41. return element.attribute(attribute.name).starts_with(attribute.value);
  42. case CSS::Selector::SimpleSelector::Attribute::MatchType::EndsWithString:
  43. return element.attribute(attribute.name).ends_with(attribute.value);
  44. case CSS::Selector::SimpleSelector::Attribute::MatchType::None:
  45. VERIFY_NOT_REACHED();
  46. break;
  47. }
  48. return false;
  49. }
  50. static inline DOM::Element const* previous_sibling_with_same_tag_name(DOM::Element const& element)
  51. {
  52. for (auto const* sibling = element.previous_element_sibling(); sibling; sibling = sibling->previous_element_sibling()) {
  53. if (sibling->tag_name() == element.tag_name())
  54. return sibling;
  55. }
  56. return nullptr;
  57. }
  58. static inline DOM::Element const* next_sibling_with_same_tag_name(DOM::Element const& element)
  59. {
  60. for (auto const* sibling = element.next_element_sibling(); sibling; sibling = sibling->next_element_sibling()) {
  61. if (sibling->tag_name() == element.tag_name())
  62. return sibling;
  63. }
  64. return nullptr;
  65. }
  66. static inline bool matches_pseudo_class(CSS::Selector::SimpleSelector::PseudoClass const& pseudo_class, DOM::Element const& element)
  67. {
  68. switch (pseudo_class.type) {
  69. case CSS::Selector::SimpleSelector::PseudoClass::Type::None:
  70. break;
  71. case CSS::Selector::SimpleSelector::PseudoClass::Type::Link:
  72. return element.is_link();
  73. case CSS::Selector::SimpleSelector::PseudoClass::Type::Visited:
  74. // FIXME: Maybe match this selector sometimes?
  75. return false;
  76. case CSS::Selector::SimpleSelector::PseudoClass::Type::Active:
  77. return element.is_active();
  78. case CSS::Selector::SimpleSelector::PseudoClass::Type::Hover:
  79. return matches_hover_pseudo_class(element);
  80. case CSS::Selector::SimpleSelector::PseudoClass::Type::Focus:
  81. return element.is_focused();
  82. case CSS::Selector::SimpleSelector::PseudoClass::Type::FirstChild:
  83. return !element.previous_element_sibling();
  84. case CSS::Selector::SimpleSelector::PseudoClass::Type::LastChild:
  85. return !element.next_element_sibling();
  86. case CSS::Selector::SimpleSelector::PseudoClass::Type::OnlyChild:
  87. return !(element.previous_element_sibling() || element.next_element_sibling());
  88. case CSS::Selector::SimpleSelector::PseudoClass::Type::Empty: {
  89. if (!element.has_children())
  90. return true;
  91. if (element.first_child_of_type<DOM::Element>())
  92. return false;
  93. // NOTE: CSS Selectors level 4 changed ":empty" to also match whitespace-only text nodes.
  94. // However, none of the major browser supports this yet, so let's just hang back until they do.
  95. bool has_nonempty_text_child = false;
  96. element.for_each_child_of_type<DOM::Text>([&](auto const& text_child) {
  97. if (!text_child.data().is_empty()) {
  98. has_nonempty_text_child = true;
  99. return IterationDecision::Break;
  100. }
  101. return IterationDecision::Continue;
  102. });
  103. return !has_nonempty_text_child;
  104. }
  105. case CSS::Selector::SimpleSelector::PseudoClass::Type::Root:
  106. return is<HTML::HTMLHtmlElement>(element);
  107. case CSS::Selector::SimpleSelector::PseudoClass::Type::FirstOfType:
  108. return !previous_sibling_with_same_tag_name(element);
  109. case CSS::Selector::SimpleSelector::PseudoClass::Type::LastOfType:
  110. return !next_sibling_with_same_tag_name(element);
  111. case CSS::Selector::SimpleSelector::PseudoClass::Type::OnlyOfType:
  112. return !previous_sibling_with_same_tag_name(element) && !next_sibling_with_same_tag_name(element);
  113. case CSS::Selector::SimpleSelector::PseudoClass::Type::Disabled:
  114. if (!element.tag_name().equals_ignoring_case(HTML::TagNames::input))
  115. return false;
  116. if (!element.has_attribute("disabled"))
  117. return false;
  118. return true;
  119. case CSS::Selector::SimpleSelector::PseudoClass::Type::Enabled:
  120. if (!element.tag_name().equals_ignoring_case(HTML::TagNames::input))
  121. return false;
  122. if (element.has_attribute("disabled"))
  123. return false;
  124. return true;
  125. case CSS::Selector::SimpleSelector::PseudoClass::Type::Checked:
  126. if (!element.tag_name().equals_ignoring_case(HTML::TagNames::input))
  127. return false;
  128. return static_cast<HTML::HTMLInputElement const&>(element).checked();
  129. case CSS::Selector::SimpleSelector::PseudoClass::Type::Not:
  130. for (auto& selector : pseudo_class.not_selector) {
  131. if (matches(selector, element))
  132. return false;
  133. }
  134. return true;
  135. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthChild:
  136. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastChild:
  137. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthOfType:
  138. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastOfType:
  139. auto const step_size = pseudo_class.nth_child_pattern.step_size;
  140. auto const offset = pseudo_class.nth_child_pattern.offset;
  141. if (step_size == 0 && offset == 0)
  142. return false; // "If both a and b are equal to zero, the pseudo-class represents no element in the document tree."
  143. auto const* parent = element.parent_element();
  144. if (!parent)
  145. return false;
  146. int index = 1;
  147. switch (pseudo_class.type) {
  148. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthChild: {
  149. for (auto* child = parent->first_child_of_type<DOM::Element>(); child && child != &element; child = child->next_element_sibling())
  150. ++index;
  151. break;
  152. }
  153. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastChild: {
  154. for (auto* child = parent->last_child_of_type<DOM::Element>(); child && child != &element; child = child->previous_element_sibling())
  155. ++index;
  156. break;
  157. }
  158. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthOfType: {
  159. for (auto* child = previous_sibling_with_same_tag_name(element); child; child = previous_sibling_with_same_tag_name(*child))
  160. ++index;
  161. break;
  162. }
  163. case CSS::Selector::SimpleSelector::PseudoClass::Type::NthLastOfType: {
  164. for (auto* child = next_sibling_with_same_tag_name(element); child; child = next_sibling_with_same_tag_name(*child))
  165. ++index;
  166. break;
  167. }
  168. default:
  169. VERIFY_NOT_REACHED();
  170. }
  171. // When "step_size == -1", selector represents first "offset" elements in document tree.
  172. if (step_size == -1)
  173. return !(offset <= 0 || index > offset);
  174. // When "step_size == 1", selector represents last "offset" elements in document tree.
  175. if (step_size == 1)
  176. return !(offset < 0 || index < offset);
  177. // When "step_size == 0", selector picks only the "offset" element.
  178. if (step_size == 0)
  179. return index == offset;
  180. // If both are negative, nothing can match.
  181. if (step_size < 0 && offset < 0)
  182. return false;
  183. // Like "a % b", but handles negative integers correctly.
  184. auto const canonical_modulo = [](int a, int b) -> int {
  185. int c = a % b;
  186. if ((c < 0 && b > 0) || (c > 0 && b < 0)) {
  187. c += b;
  188. }
  189. return c;
  190. };
  191. // When "step_size < 0", we start at "offset" and count backwards.
  192. if (step_size < 0)
  193. return index <= offset && canonical_modulo(index - offset, -step_size) == 0;
  194. // Otherwise, we start at "offset" and count forwards.
  195. return index >= offset && canonical_modulo(index - offset, step_size) == 0;
  196. }
  197. return false;
  198. }
  199. static inline bool matches(CSS::Selector::SimpleSelector const& component, DOM::Element const& element)
  200. {
  201. switch (component.type) {
  202. case CSS::Selector::SimpleSelector::Type::Universal:
  203. return true;
  204. case CSS::Selector::SimpleSelector::Type::Id:
  205. return component.value == element.attribute(HTML::AttributeNames::id);
  206. case CSS::Selector::SimpleSelector::Type::Class:
  207. return element.has_class(component.value);
  208. case CSS::Selector::SimpleSelector::Type::TagName:
  209. return component.value == element.local_name();
  210. case CSS::Selector::SimpleSelector::Type::Attribute:
  211. return matches_attribute(component.attribute, element);
  212. case CSS::Selector::SimpleSelector::Type::PseudoClass:
  213. return matches_pseudo_class(component.pseudo_class, element);
  214. case CSS::Selector::SimpleSelector::Type::PseudoElement:
  215. // Pseudo-element matching/not-matching is handled in the top level matches().
  216. return true;
  217. default:
  218. VERIFY_NOT_REACHED();
  219. }
  220. }
  221. static inline bool matches(CSS::Selector const& selector, int component_list_index, DOM::Element const& element)
  222. {
  223. auto& relative_selector = selector.compound_selectors()[component_list_index];
  224. for (auto& simple_selector : relative_selector.simple_selectors) {
  225. if (!matches(simple_selector, element))
  226. return false;
  227. }
  228. switch (relative_selector.combinator) {
  229. case CSS::Selector::Combinator::None:
  230. return true;
  231. case CSS::Selector::Combinator::Descendant:
  232. VERIFY(component_list_index != 0);
  233. for (auto* ancestor = element.parent(); ancestor; ancestor = ancestor->parent()) {
  234. if (!is<DOM::Element>(*ancestor))
  235. continue;
  236. if (matches(selector, component_list_index - 1, static_cast<DOM::Element const&>(*ancestor)))
  237. return true;
  238. }
  239. return false;
  240. case CSS::Selector::Combinator::ImmediateChild:
  241. VERIFY(component_list_index != 0);
  242. if (!element.parent() || !is<DOM::Element>(*element.parent()))
  243. return false;
  244. return matches(selector, component_list_index - 1, static_cast<DOM::Element const&>(*element.parent()));
  245. case CSS::Selector::Combinator::NextSibling:
  246. VERIFY(component_list_index != 0);
  247. if (auto* sibling = element.previous_element_sibling())
  248. return matches(selector, component_list_index - 1, *sibling);
  249. return false;
  250. case CSS::Selector::Combinator::SubsequentSibling:
  251. VERIFY(component_list_index != 0);
  252. for (auto* sibling = element.previous_element_sibling(); sibling; sibling = sibling->previous_element_sibling()) {
  253. if (matches(selector, component_list_index - 1, *sibling))
  254. return true;
  255. }
  256. return false;
  257. case CSS::Selector::Combinator::Column:
  258. TODO();
  259. }
  260. VERIFY_NOT_REACHED();
  261. }
  262. bool matches(CSS::Selector const& selector, DOM::Element const& element, Optional<CSS::Selector::PseudoElement> pseudo_element)
  263. {
  264. VERIFY(!selector.compound_selectors().is_empty());
  265. if (pseudo_element.has_value() && selector.pseudo_element() != pseudo_element)
  266. return false;
  267. if (!pseudo_element.has_value() && selector.pseudo_element().has_value())
  268. return false;
  269. return matches(selector, selector.compound_selectors().size() - 1, element);
  270. }
  271. }