Search code examples
azureazure-active-directoryazure-web-app-servicecypresscypress-component-test-runner

Unable to load my Azure hosted web app through Cypress


I have an Azure hosted App when I try to cy.visit('url') Cypress stuck and below is visible. After sometime "HTTP Error 414. The request URL is too long." is visible. Please help if anyone have any idea on how to resolve this.

enter image description here


Solution

  • From the URL, it looks like your app uses an active directory login. This means that your Cypress test must first log in with a test user. You can achieve this as follows:

    In Cypress you can add your own custom commands like described here: https://docs.cypress.io/api/cypress-api/custom-commands

    This way you can write a custom command that technically logs a test user into active directory, e.g.:

    Cypress.Commands.add('login', () => {
      return cy
        .request({
          method: 'POST',
          url: `https://login.microsoftonline.com/${tenantId}/oauth2/token`,
          form: true,
          body: {
            grant_type: 'password',
            tenant: 'tenantId',
            client_id: 'clientId',
            client_secret: 'clientSecret',
            username: 'username',
            password: 'password',
            resource: 'clientId',
          },
        })
        .then((response) => {
          sessionStorage.setItem('access_token', response.body.access_token);
        });
    });

    Then you can use your custom command in your test as first action like:

    cy.login();
    

    and then perform your site visit:

    cy.visit()