Skip to content

Unable to use ">" for getting direct child element. #71

@why2000

Description

@why2000

Describe the bug
With the getObject and getAllObject methods in querySelector.js, > symbol is removed in splitting, but never processed back and won't take effect. This causes all related Shadow.findElement(s) behaviors to be malfunctioning. See the following example:

To Reproduce
Steps to reproduce the behavior:

  1. Consider a following DOM:
<html>
  <div id="a">
      <div id="b">
         <div id="c"></div>
      </div>
      <div id="d"></div>
  </div>
  <script src="querySelector.js"></script>
</html>
  1. run getAllObject("div#a > div") in the console.
  2. Actual result is [<div id="b">, <div id="c">, <div id="d">], but #c is not a direct child of #a

Expected behavior
Expected result should be [<div id="b">, <div id="d">]

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: MacOS 13.6.4
  • Browser: Chrome 123 / Safari 17.3.1

Additional context

const multiLevelSelectors = splitByCharacterUnlessQuoted(selector, '>');

I don't understand why > is used to process multi-level DOM.
For functional, this is not needed at all, since without splitting, the script still works fine for piercing through multi-level shadow roots.
For performance, if we have to use some symbol to reduce the max size of possible elements cached in the allElements array, & would be a much better choice considering only one character is allowed in splitByCharacterUnlessQuoted.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions