How to handle & check the element that doesn't render again on the iframe or page because the origin was changed

[adnanerlansyah403]

This is my code :

    cy.contains("header a", "Masuk")
    .invoke("attr", "href")
    .then(url => {
        cy.window().then(win => win.location.href = url);
        const magicOrigin = new URL(url).origin
        cy.origin(magicOrigin, { args: { url, account, customMessages } }, ({ url, account }) => {
            Cypress.on("uncaught:exception", () => {
                return false
            })
            cy.get("input[type=email]").type(account?.email)
            cy.get("input[type=password]").type(account?.password, { log: false })
            cy.get("body").then(() => {
                cy.wait(2000)
                cy.window().then(win => {
                    let alertMessage = win.document.querySelector(".alert.alert-warning");
                    expect(alertMessage).to.not.exist();
                    cy.wait(2000)
                })
            })


        });

    })
    cy.wait(5000)
    Cypress.Promise.all([
        cy.window().its("localStorage").invoke("getItem", "user"),
        cy.window().its("localStorage").invoke("getItem", "user_kind"),
        // Add more items if needed
    ]).then(([user, userKind /* , additionalItem */]) => {
        cy.get("h1.text-welcome").should("exist")
        cy.window().then((win) => {
            let textWelcome = win.document.querySelector("h1.text-welcome");
            const textWelcomeUsername = textWelcome.innerText.match(/, (.+)/)[1];
            expect(userData?.name).to.equal(textWelcomeUsername);
        })
        let userData = JSON.parse(user);
        expect(user, "Expected user data was already exist").to.exist;
        expect(userKind, "Expected user kind was 'student'").to.equal("student");
        customMessages = user ? ['User successfully logged in ✅'] : ['User failed to login ❌'];
    
        // Handle user_kind data as needed
    });

So on that code, I tried to login with different origin or page. My project or website adhere a microservices, that's why the auth page is different url or origin. The problem is it will throw an error on the these lines code. 'cy.get('body')' will not getting the element because the iframes or page already changed after password already typed it on input field (it will be immediately auto submit after filled in the input password and redirects to other url or page again)

cy.window().then(win => win.location.href = url);
        const magicOrigin = new URL(url).origin
        cy.origin(magicOrigin, { args: { url, account, customMessages } }, ({ url, account }) => {
            Cypress.on("uncaught:exception", () => {
                return false
            })
            cy.get("input[type=email]").type(account?.email)
            cy.get("input[type=password]").type(account?.password, { log: false })

            // this will cause the error iframe is undefined or something like that
            cy.get("body").then(() => {
                cy.wait(2000)
                cy.window().then(win => {
                    let alertMessage = win.document.querySelector(".alert.alert-warning");
                    expect(alertMessage).to.not.exist();
                    cy.wait(2000)
                })
            })


        });