Cypress 12: Started Getting `400: Bad Request` when logging out from KC

[dthisner]

Cypress 11, our logout functionality is working just fine With Cypress 12+, it stopped working

We are seeing:

Our logout command:

Cypress.Commands.add('logoutKC', () =>
  cy.logout({
    root: ENVS.keycloak_root,
    realm: Cypress.env('keycloak_realm'),
    post_logout_redirect_uri: ENVS.keycloak_redirect,
  }),
);

Usage:

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

Running: "cypress-keycloak": "2.0.1"

Any ideas?

[lukasjelonek]

I have the same or a similar problem with cypress 13.6.1 and keycloak 22.0.

requestGET 400 http://localhost:12002/realms/tests/protocol/openid-connect/logout?post_logout_redirect_uri=http%3A%2F%2Flocalhost%3A4173&id_token_hint=

It seems as if the id_token_hint is invalid:

<p class="instruction">Invalid parameter: id_token_hint</p>

cy.logout({
    root: "http://localhost:12002",
    realm: Cypress.env("keycloak_realm"),
    post_logout_redirect_uri: baseUrl,
    path_prefix: "",
  });

I do not specify the id_token_hint and an empty value is send everytime.

The logout-function of the keycloak-js-adapter sends the id token as a hint. Would it be possible to use that token here as well? Or just remove the id_token_hint from the query?

[dthisner]

@lukasjelonek I used their code to copy what they where doing and make it my own logout. https://github.com/babangsund/cypress-keycloak/blob/06f519983e1222c5af0edde02173e10cfcbd0a1c/src/logout.ts

This is what I ended up with:

Cypress.Commands.add('logoutKC', () => {
  cy.request({
    followRedirect: true,
    url: `${ENVS.keycloak_root}/auth/realms/${Cypress.env('keycloak_realm')}/protocol/openid-connect/logout`,
  }).then((response) => {
    const html = document.createElement('html');
    html.innerHTML = response.body;
    const contentArea = html.getElementsByClassName('content-area')[0];

    if (contentArea === undefined || contentArea.id !== 'kc-logout-confirm') {
      return;
    }
    const form = contentArea.getElementsByTagName('form')[0];
    const url = `${ENVS.keycloak_root}${form.getAttribute('action')}`;
    const inputs = form.getElementsByTagName('input');

    const body: Record<string, string> = {};
    for (const input of Array.prototype.slice.call(inputs)) {
      body[input.name] = input.value;
    }
    return cy.request({
      url,
      method: 'POST',
      body,
      form: true,
    });
  });

// Broken way that is trying to use: https://github.com/babangsund/cypress-keycloak
  // cy.logout({
  //   root: ENVS.keycloak_root,
  //   realm: Cypress.env('keycloak_realm'),
  //   // path_prefix: 'auth',
  //   // id_token_hint: '',
  //   // post_logout_redirect_uri: ENVS.keycloak_redirect,
  // });
});

Worked for me :)