Cypress - how to access the button inside the iFrame located inside the shadow element

user_16772407 0
Viewed 274

I have a problem where I can't access the button inside the iFrame located inside the shadow element.

Here is the HTML code:

<mati-frame>
    #shadow-root (open)
        <iframe>
            <button>
              Start
            </button>
        </iframe>
</mati-frame>
cypress automated-tests html javascript
1 Answers

Not sure what you tried. I found the test was flaky depending on how the iframe was set up.

Mostly it failed to find the iframe's contentDocument, but turning off chromeWebSecurity seems to give consistent results.

cypress.json

{
  "chromeWebSecurity": false,
  "includeShadowDom": true
}

Test

cy.get('mati-frame')
  .find('iframe')
  .its('0.contentDocument.body')
  .find('button')                // passes
user_166166930
Related