[BUG] querySelector and querySelectorAll not working within <plasmo-csui> element

[smilingkylan]

What happened?

For some reason when I use getInlineAnchorList to mount components in the shadow dom, they apparently are not able to be queried with a simple document.querySelector. Please see attached videos.

query-selector-fail.mov

query-selector-fail-2.mov

Version

Latest

What OS are you seeing the problem on?

MacOSX

What browsers are you seeing the problem on?

Chrome

Relevant log output

See attached videos

(OPTIONAL) Contribution

• I would like to fix this BUG via a PR

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems.

[smilingkylan]

Sorry for the content on the X.com feed, that's just the nature of building an extension on top of X

[Can-Chen]

function findAllShadowRoots() {
    const allShadowRoots = [];
    function traverse(node) {
        if (node.shadowRoot) {
            allShadowRoots.push(node.shadowRoot);
        }
        const childNodes = node.childNodes;
        for (let i = 0; i < childNodes.length; i++) {
            traverse(childNodes[i]);
        }
    }
    traverse(document.body);
    return allShadowRoots;
}

const shadowRoots = findAllShadowRoots();
const result = shadowRoots.find(el => el.querySelector('someButton'))