Struggling with automating an e-commerce store front using Cypress, specifically encountering issues with the login functionality.
The authentication and identity tool in use is keycloak. However, the Cypress test fails to successfully log in or register users. The workflow involves visiting siteundertest.com > Clicking on login/register > redirecting to keycloak > entering valid login credentials > clicking login. Expected outcome: Successful login leading to authenticated home page redirection (siteundertest.com). Actual result: "An error occurred processing your request."
Key points:
- This login process works flawlessly using Selenium
- POST requests are disabled for keycloak on the current domain, impeding the ability to bypass login/register via API calls (Bypass UI Login using Cypress)
- There's a suspicion of losing cookie/header information, unsure about what data needs to be provided alongside Cypress
- Attempts made to resolve through cypress.json config modifications like disabling web security and other suggested methods (Unable to signup using Keycloak through Cypress)
- Error persists across different browser environments (headless, Chrome, FF, Edge)
- Manual login functions correctly using various user accounts
- Encountering the same error when attempting registration via Keycloak button clicks
- Exploration of preserving cookies through Cypress Cookies but can't identify the root issue
A supportive developer assisted in gathering insights from keycloak regarding cookies, comparing Cypress vs. Selenium vs. Manual Web: https://i.sstatic.net/Oz920.png
The script:
describe('Login to Keycloak with Email', function(){
before(function () {
cy.fixture('logindata').then(function (data) {
this.data = data;
})
})
it('Open Homepage', function(){
cy.visit(this.data.OccTestHmepageUrl)
})
it('Click Log In', function(){
cy.get('[data-bind="visible: !(loggedInUserName() && (loggedIn() || isUserSessionExpired()))"] > #CC-loginHeader-login').click()
});
it('Verify Redirect to Keycloak', function(){
cy.get('.auth-land-page > :nth-child(1) > .text-center')
});
it('Click login button', function(){
cy.get('.emailLogin > .auth-button-content').click()
})
it('Enter valid email address', function(){
cy.fixture('logindata').then(function (data) {
this.data = data;
cy.get('#emailUsername')
.type(this.data.LoginEmail)}
)}
)
it('Enter valid password', function(){
cy.fixture('logindata').then(function (data) {
this.data = data;
cy.get('#password')
.type(this.data.LoginPassword)}
)}
)
it('Click login button', function(){
cy.get('#loginBtn').click()
// Error occurs here
})
it('Verify successful login', function(){
//Redirect fails
cy.get('#CC-loginHeader-logout')
})
})Appreciation in advance for any assistance provided!