Hi,

we are using web components with shadow DOM. Is it possible to access the shadow DOM with built-in functions of Codeception?

How to reproduce?

1. Add this component

class MyComponent extends WebComponent {
  constructor() {
        super()
        this.attachShadow({mode: 'open'})
    }

    connectedCallback() {
        this.shadowRoot.innerHTML = '<div id=test></div>'
    }
}

window.customElements.define('my-component', MyComponent)

2. Adding the component to the DOM.

<my-component />

3. Now try to access it from Codeception:

$I->waitForElementVisible('#test'); // not working

I didn't find a way to access the div in a shadow root.

The only way I would see is, to execute js with $I->executeJS(); but relying on this function for testing a complete application seems horrible to me.

Any ideas or tips?

Best Regards
mschop