I am trying to access modal-dialogue using cypress, what usually happens is that when you access the base Url, after 5-6 seconds, it will navigate user to modal-dialogue , where user have to login himself.
following is the class name of dialog:
<div class = "modal-dialog">
and I am trying to get access of email address field:
Check Screenshot of the page
While using the following code:
describe('Login', function(){
it('Login Successfully', function(){
const urlRedirects = [];
cy.visit('https://app.staging.showcare.io/product-showcase')
cy.get('.modal-dialog').should('be.visible').then(($dialog)=>{
cy.wrap($dialog).find('#signInFormUsername').click()
});
})
})
for which I am getting following error:
Cypress detected a cross origin error happened on page load:
> Blocked a frame with origin "https://app.staging.showcare.io" from accessing a cross-origin frame.
Before the page load, you were bound to the origin policy:
> https://showcare.io
A cross origin error happens when your application navigates to a new URL which does not match the origin policy above.
A new URL does not match the origin policy if the 'protocol', 'port' (if specified), and/or 'host' (unless of the same superdomain) are different.
Cypress does not allow you to navigate to a different origin URL within a single test.
You may need to restructure some of your test code to avoid this problem.
Alternatively you can also disable Chrome Web Security in Chromium-based browsers which will turn off this restriction by setting { chromeWebSecurity: false } in cypress.json.
Can someone please help me out?!