unable to signup using keycloak through cypress

@ZijlkerVR I have followed steps 1 to 3 using this Blog Post of @vrockai, still can’t figure out why it won’t work.

It might be because of step 4 and 5 of your guide, can you provide more detailed information about that?

context('Logged in user', () => {
  beforeEach(() => {
    cy.kcLogin('testuser', 'testuserpass');
  });

  afterEach(() => {
    cy.kcLogout();
  });

  it('Should render logged user name somewhere on the page', () => {
    cy.visit('http://SAMPLE.com'); // still not logged in, although beforeEach is successful.
    cy.get('#username').should('contain', 'testuser');
  });
});

@pouriaMaleki Interesting blog post. His method is comparable to my first 2 steps. He has a cleaner way of retrieving the ActionURL though. He creates a UUID to fill state in step 1 but, atleast in my case, it’s optional so I just skipped it and get it later. Although creating a state UUID beforehand might actually decrease the number of steps I need in total so gotta look into that. Not sure if it’s the case.

I noticed he stops after his POST. In my case it would only give me KC cookies, but not site specific login cookies. I really need to follow through to atleast 3 more requests untill our site specific cookie will be set. Again… it might be specifically related to our implementation since they have build quite some code around Keycloak here. It’s been build by external supplier so lacking the knowledge on site.

Notice that my step 3 is a specific call back to the login page. Now that KC cookies are available it triggers our site to process and eventually end up with site specific auth cookies.

If I would follow redirect after step 2 POST I would get stuck. Might also be your problem.

Unfortunately I don’t understand why steps 4 and 5 are needed. I would expect followRedirect=true in step 3 to work, but I had to disable followRedirect and manually catch and explicitly request them in order to get a successfull login cookie. Could be a Cypress bug.

My advice would be to go through the requests step by step by catching en requesting manually like I did. Will give more control and insight. When we login through UI there is even more than these 5 requests/redirects, but I cut it off as soon as I get the cookie.

My code might help (simplified a bit by removing our environment specific condition) :

Cypress.Commands.add("login", (user, pass) => {
    Cypress.log({ name: 'Login' })
    const userName = (user != undefined) ? user : Cypress.env('user')
    const passWord = (pass != undefined) ? pass : Cypress.env('pass')
    cy.clearCookies()

    // Non UI login - awesomely fast
    // 1. Get login params from auth
    // 2. Post form to authenticate
    // 3. Get back to /login
    // 4. Follow redirect to auth
    // 5. Follow redirect to origin

    const getStartBody = {
        url: 'Cypress.config('baseUrl')' + '/auth/realms/*REALM*/protocol/openid-connect/auth',
        followRedirect: false,
        qs: {
            scope: 'name,email',
            response_type: 'code',
            approval_prompt: 'auto',
            redirect_uri: Cypress.config('baseUrl') + '/userauth',
            client_id: 'account'
        }
    }
    // Step 1
    cy.request(getStartBody).then((getStartResp) => {

        const actionUrl = getStartResp.body.match(/action\=\"(.*)\" /)[1].replace(/&/g, '&');
        const postLoginBody = {
            method: 'POST',
            url: actionUrl,
            followRedirect: false,
            form: true,
            body: { username: userName, password: passWord }
        }
        // Step 2
        cy.request(postLoginBody)
        // Keycloak cookies now set

    }).then(() => {
            // Step 3
            cy.request({
                url: '/login?redirect=/',
                followRedirect: false
            }).then((redirectResp1) => {
                // Step 4
                cy.request({
                    url: redirectResp1.redirectedToUrl,
                    followRedirect: false
                })
            }).then((redirectResp2) => {
                // Step 5
                cy.request({
                    url: redirectResp2.redirectedToUrl,
                    followRedirect: false
                })
            }).then(() => {
                // Finally got the site cookie
                cy.getCookie('cookie').should('exist')
            })
    })