Marie Cruz
Marie is a software tester and also a tech blogger at testingwithmarie.com where she talks about testing and test automation in general. Currently, she works as a Developer Advocate for k6.io
Testing iframes with Cypress
Cypress lunch and learn recap
- Cypress functional testing ✅
- Cypress API testing ✅
- Cypress Visual testing with Applitools ✅
Remember the limitations?
Are there limitations?
- No support for multiple tabs.
- No support for visiting more than 1 domain.
- Iframe support limited
But.. workarounds are documented here.
https://docs.cypress.io/guides/references/trade-offs.html
What are iframes?
Cypress' limitations with iframes
- Cypress can't access iframes directly
- No built-in command to switch to iframes
- IFrames snapshots not shown on Cypress Test Runner
Does that mean we can't automate iframes with Cypress?
No! It will need extra custom code though..
Let's start coding!
Iframe Demo App
What we did
- Used jQuery property "0.contentDocument.body"
- Created a custom command to switch to the iframe
- Introduced cy.wrap
- Used cypress-iframe plugin
- Disabled chromeWebSecurity to test cross domains
Additional Resources
Any questions?
Testing Iframes with Cypress
By Marie Cruz
Testing Iframes with Cypress
In this lunch and learn, we'll look at how you can test iframes with Cypress and talk about the current limitations of testing iframes.
