javascripthtmlcypressweb-testingcypress-testing-library

Cypress Won't Open Button to Type Form


Chrome vs Cypress

Click focus

Using Cypress 13.3.0

So I've tried doing a .click( {force: true} ) and all that, even attempted using .trigger('click') on it, but it doesn't seem to open the form so the next line can get it and type in it. The cursor Cypress shows is focused on it and it clicks, but it doesn't seem to go anywhere. When I investigated the HTML elements, it seems to load a whole new area outside of the button. Any idea how I can fix this?

//image upload
cy.findByText(/Add existing Image/i).click({ force: true });
cy.get( //This wont open
'#edit-field-pac-publication-image-form-0-entity-id--wruseI7wRoU'
).type('test_0.jpeg (434)');

Solution

  • Assuming you're using an iframe for the image upload form, see below.

    Cross-origin iframes (Cypress)

    If your site embeds an <iframe> that is a cross-origin frame, Cypress will not be able to automate or communicate with this <iframe>.

    Examples of uses for cross-origin iframes Embedding a Vimeo or YouTube video. Displaying a credit card form from Stripe or Braintree. Displaying an embedded login form from Auth0. Showing comments from Disqus. It's actually possible for Cypress to accommodate these situations the same way Selenium does, but you will never have native access to these iframes from inside of Cypress.

    As a workaround, you may be able to use window.postMessage to directly communicate with these iframes and control them (if the 3rd party iframe supports it).

    Other than that, you'll have to wait for us to implement APIs to support this (check our open issue), or you can disable web security.