Integration testing of SSO workflows using Cypress

Hey Folks, welcome back. If you have read and followed my previous posts about SSO implementation, you would have a fair idea of a way to implement this auth mechanism using SAML. I am sure you would be able to build it too just as we did it! The feeling of building something is just awesome, you are over the moon that you overcame all the challenges on your path in building it and it works just as you expected. One thing that might get forgotten in this jubilation though is testing that it works in various scenarios.

So, how would you go about ensuring that the cool application you just built is robust enough to endure all kinds of real-world scenarios? Below are some things you might consider doing.

1. Unit tests: Writing good unit tests that ensure maximum coverage of the system under test in one way the bugs can be minimized. Our leader Klaus Nji has an excellent blog post about best practices for unit tests here and our Cloud Architect Jessie Hernandez has a beautiful blog on code quality/testing/code coverage here
2. Integration tests: These help in testing the compliance of the newly built software with other parts of the system as a whole.
3. Beta customers: Releasing your product to the beta customers not only helps in ensuring that there aren't any major bugs before a wider release but also in getting valuable feedback about the overall look, feel, and functionality of the product.
4. Another way is to just release your product anyways to the public and have them find bugs for you 😜. I hope no one does this... 😅

For our SSO work that I discussed in my previous posts, we definitely had a lot of unit tests along with a good bunch of integration tests. However, here I am going to list some details about an E2E testing tool we used to test SSO and how that was done.

We used Cypress for testing the SAML-based SSO auth workflow. While building these tests, there was very little guidance available on the internet and hence I decided to share a few details with you folks here.

SSO authentication workflow was a bit challenging to test using Cypress as there are multiple redirections involved that hop from Service Provider to Idp back and forth. Cypress, by default, doesn't allow cross-website hopping during its tests. Hence, it needs to be configured to support such redirections.

Below is a sample example of a cypress test that is a subset of the SSO auth workflow scenarios. First, to enable the redirections, your cypress.json file should have this parameter set to false.

{
   "projectId":<your project id here>,
   "chromeWebSecurity":false
}

Now as discussed in the SSO post <paste link for SAML flow post>, the login request initiated by Service Provider is redirected to the IdP. Initiating the login process in Cypress can simply be done by calling the login endpoint for your application which would be similar to below,

cy.visit({
    method: 'POST',
    url: baseURL + "/api/login-using-sso",
    body: {
        email: email,
    }
})

Once this endpoint is called and if your backend code does the redirection to the IdP, this would redirect to the login form of the IdP that looks like below,

This is where the user will have to provide login credentials. This can be simulated using cypress test as,

cy.get('#okta-signin-username').should('be.visible').type(email);        cy.get('#okta-signin-password').should('be.visible').type(password);        cy.get('#okta-signin-submit').should('be.visible').click()

Here, #okta-signin-username is the id for the textbox that will holds user’s email. Similarly, we fetch ids for password and submit button elements too.

The above code simulates the user actions and autofill the email and password for the user in the respective fields in the form above.

Once that's done, the login request is sent to IdP and the IdP then responds back to the application with encoded assertion response on /saml/acs endpoint exposed by the application. Hence, we can assert the same in our sample cypress test here which is as follows,

cy.url().should('contain', '/saml/acs');

If we combine all the elements discussed above, our login cypress test would look like below,

That's it! You now have a cypress test for SAML-based SSO login workflow!