Microsoft login removes the Cypress test frame when it redirects, causing tests to fail

[blittle91]

Current behavior

Using 9.6.0, I want to use the origin function to firstly, login through Microsoft and then continue with the test within the baseUrl.

Using the code below, when cy.visit('/'); is executed, the test frame around Cypress (when using yarn cypress open) is removed and consequently, Cypress can no longer communicate with the browser and all tests fail.

describe('Authenticate', () => {
    beforeEach(() => {
        cy.origin('https://login.microsoftonline.com', () => {
            cy.visit('/');
            cy.get('[name="loginfmt"]').type(`${Cypress.env('email')}{enter}`);
            cy.get('[name="passwd"]').type(`${Cypress.env('password')}{enter}`);
            cy.get('[type="submit"]').type('{enter}');
        });
    });

    it('Show homepage once logged in', () => {
    });
});

Is there a working solution for this?

Desired behavior

For the Cypress test frame to persist whilst the login occurs.

Test code to reproduce

As above.

Cypress Version

9.6.0

Other

No response

[Abcmsaj]

This has been a long-standing issue waaaaay before the introduction of cy.origin, but now that we have a legitimate ability to swap superdomains, I think it needs addressing. We are trying to write tests for checking SSO buttons work correctly by navigating us from our website to the Microsoft login page - I only want to assert the url contains https://login.microsoftonline.com - but due to this bug, can't because the test frame disappears

[mjhenkes]

We are spiking on which auth providers are frame busting in issue #21342 and will be working through enabling them.

[Abcmsaj]

We are spiking on which auth providers are frame busting in issue #21342 and will be working through enabling them.

Thank you, Matt - I'll let my team know to follow along!

[mschile]

The code for this is done in #22568, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[Gans79]

Any Update on when this fix will be released ?

[mschile]

@Gans79, this is scheduled to be released this week.

[verheyenkoen]

@Gans79 This has just been released in Cypress 10.4.0: https://docs.cypress.io/guides/references/changelog

[thecodeholic]

First of all huge thanks to the Cypress team for an excellent testing framework.

I updated to Cypress 10.4.0, But It does not seem to be working or I have something misconfigured.
I actually created a completely new project and testing there...
The strange thing is that on version 10.3.0 it redirects the whole frame, but on version 10.4.0 it does not do anything. Simply goes on timeout.
Has anyone have that issue?

This is my beforeEach.

beforeEach(() => {
  cy.origin(`https://login.microsoftonline.com/`, () => {
    cy.visit('/');
    cy.get('[name="loginfmsst"]').type(`${Cypress.env('email')}{enter}`);
    cy.get('[name="passwd"]').type(`${Cypress.env('password')}{enter}`);
    cy.get('[type="submit"]').type('{enter}');
  });
})

This is my config

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      // implement node event listeners here
    },
    experimentalSessionAndOrigin: true
  },
  chromeWebSecurity: false,
});

Here is output in cypress interface

And here is the chrome console output

[AtofStryker]

@thecodeholic have you tried adding the new experimentalModifyObstructiveThirdPartyCode along side experimentalSessionAndOrigin as described here? It looks like you are being frame busted, which the experimentalModifyObstructiveThirdPartyCode should modify to get you up and running.

[thecodeholic]

@AtofStryker That was the case. Thanks a lot.

[ArunVinayagmurthy]

describe("XXX", () => {
  it("XXXX", () => {
    cy.origin("https://login.microsoftonline.com/", () => {
      cy.visit("/");
    });
  });
});

config file

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  e2e: {
  experimentalModifyObstructiveThirdPartyCode: true,
  },
});

This works