Skip to main content

shadow$$

Access elements inside a given element's shadowRoot. The result is a WebdriverIO.ElementArray, the same list as $$. If you are working with lots of nested shadow roots, an alternative approach to shadow$$ is to use the deep selector.

info

WebdriverIO automatically pierces through shadow roots when using $ or $$ commands. This command is only needed if you automate within an environment that doesn't support WebDriver Bidi yet, e.g. mobile web testing with Appium.

Usage​

await $(selector).shadow$$(selector)

Parameters​

NameTypeDetails
selectorString, Functionselector or JS Function to fetch a certain element

Example​

shadow$$.js
it('should return elements inside a shadowRoot', async () => {
const innerEl = await $('.input').shadow$$('#innerEl');
console.log(await innerEl.getValue()); // outputs: 'test123'
});

Returns​

  • <WebdriverIO.ElementArray>

Welcome! How can I help?

WebdriverIO AI Copilot