#kaigieffect LT 2024 - rexml-css_selector: A REXML extension for supporting CSS selector

This is a presentation slide for #kaigieffect LT 2024. https://timeedev.connpass.com/event/318445/

Repository: https://github.com/makenowjust/rexml-css_selector

Transcript

1. @ #kaigieffectLT, 2024-05-29 Hiroya Fujinami (@makenowjust) rexml-css_selector: A REXML extension for supporting CSS selector.
2. $ whoami ‣ Hiroy a Fujin a mi (౻࿘େ໻) - t @make_now_just / g @makenowjust ‣ Ph.D student a t N a tion a l Institute of Inform a tics / SOKENDAI ‣ Work p a rt-time a t STORES, Inc. ‣ Ruby committer (regex engine, memoiz a tion) 2
3. @ RubyKaigi 2024 Make Your Own Regex Engine! 3
4. REXML 4
5. REXML 4
6. CSS selector https://developer.mozilla.org/en-US/docs/Web/CSS/Next-sibling_combinator 5
7. CSS selector https://developer.mozilla.org/en-US/docs/Web/CSS/Next-sibling_combinator 5
8. REXML + CSS selector 6
9. REXML + CSS selector I cre a ted. @makenowjust 6
10. makenowjust/ rexml-css_selector 7
11. makenowjust/ rexml-css_selector 7 St a r!
12. ‣ REXML::CSSSelector.each_select t a kes two a rguments: - scope: a node m a tching from - selector: a CSS selector string ‣ It c a lls a block with a m a tched node. ‣ Other APIs: - select_all, select, is REXML::CSSSelector.each_select Usage 8
13. ‣ tag ‣ * ‣ .class ‣ #ID Supported CSS selector features 9 ‣ [attr] ‣ [attr=value] ‣ [attr~=value] ‣ [attr|=value] ‣ [attr^=value] ‣ [attr$=value] ‣ [attr*=value] CSS 3 compatible? ‣ :first-child ‣ :last-child ‣ :only-child ‣ :nth-child ‣ :nth-last-child ‣ :first-of-type ‣ :last-of-type ‣ :only-of-type ‣ :nth-of-type ‣ :nth-last-of-type ‣ :root, :scope ‣ :is, :where ‣ :not ‣ :has ‣ :empty ‣ :checked, :disabled ‣ E F ‣ E + F ‣ E ~ F ‣ E > F
14. Placeholder 10 ‣ $name is a ccepted a t where a v a lue is expected. ‣ This v a lue is repl a ced by substitutions[name] on run-time. REXML::CSSSelector.select_all( scope, 'div#main input[class=$user_value]', substitutions: { user_value: } ) A safe way to handle user values.
15. Adapter 11 ‣ XML tree tr a vers a l oper a tions a re a bstr a cted by a d a pters. - element?, get_parent_node, get_attribute, ... ‣ Def a ult: REXMLAdapter ‣ By implementing a n a d a pter for our tree, we c a n get CSS selector m a tching for this. ‣ → PrismAdapter Generic usage of CSS selector.
16. PrismAdapter 12 call[name="require"] > arguments > string:first-child
17. PrismAdapter 12 call[name="require"] > arguments > string:first-child "prism" "rexml/css_selector" "rexml/css_selector/adapters/prism_adapter"
18. Implementation 13 root p a rent p a rent child child child v a lue=2 v a lue=1 v a lue=3 root > p a rent > child[v a lue=2] def each_select(scope, selector) each_recursive(scope) do |node| yield node if is(node, selector) end end
19. Implementation 14 root p a rent p a rent child child child v a lue=2 v a lue=1 v a lue=3 root > p a rent > child[v a lue=2] ᶃ ᶄ ᶅ ᶆ ᶇ ᶈ def each_select(scope, selector) each_recursive(scope) do |node| yield node if is(node, selector) end end
20. Implementation 15 root p a rent p a rent child child child v a lue=2 v a lue=1 v a lue=3 root > p a rent > child[v a lue=2] def each_select(scope, selector) each_recursive(scope) do |node| yield node if is(node, selector) end end
21. ‣More document a tion/ex a mples/testing. ‣Type de f inition (RBS) ‣Ref a ctoring ‣Perform a nce ‣REXML con f luence...? TODO 16 Th a nk you! I want you & your P.R.