I have a modal with several different possible views (login, signup, password reset, etc). I am navigating the different views for the modal through a piece of state in redux.
The links work fine outside of my Cypress tests, but in my tests, some of them work and some of them make the modal completely disappear.
For example, when I tell Cypress to click the Sign up link it properly switches, but when I tell it to click Forgot Password the modal just disappears. I've logged the redux state values and it is in the correct state value to show the modal and the state is NOT being updated to a hidden status. If I manually click the Forgot password link in the test runner it properly navigates to the the forgot password form.
They are both wrapped in a tags as such:
<a
onClick={() =>
dispatch(setAuthModalView(AuthModalViewTypes.FORGOT_PASSWORD))
}
className="text-sm"
data-testid="forgotPassword">
Forgot Password?
</a>
Here are my cypress tests:
Password Reset:
cy.visit('/')
cy.contains('Sign In').click()
cy.contains('Forgot Password').click()
cy.findByTestId('auth-modal')
Sign up
cy.visit('/')
cy.contains('Sign In').click()
cy.contains('Sign Up').click()
cy.findByTestId('auth-modal')
Just to reiterate, the modal correctly navigates to the page when I manually click the link, and redux has the proper state to show the modal, but it's just dissapearing.
I've tried placing cy.wait commands in betweeen the commands to make sure it's not a timing issue, but it was no help.
Any help is appreciated

