(uncaught exception)Error: Syntax error cannot be handled in cy.origin() when user is trying to login on apppleid.apple.com

[katQA]

Current behavior

I'm trying to login with appleid on the site that I'm testing. When I get redirected to apple.com and try to login with user and credentials right when the user starts to interact with appleid.apple.com I got an uncaught exception that is failing the test or Cypress get stuck and I have to restart it. I have the following code:

        cy.origin(
            "https://appleid.apple.com",
            { args: { email, password } },
            ({ email, password }) => {
               Cypress.on('uncaught:exception', () => false);
               cy.get('#account_name_text_field').parent().blur({force: true});
               Cypress.on('uncaught:exception', () => false);
               cy.get('#account_name_text_field').parent().type(email);
            }
        );

Here is the error:
(uncaught exception)Error: Syntax error, unrecognized expression: INPUT[type="text"][id="account_name_text_field"][can-field="accountName"][aria-labelledby="apple_id_field_label"][autocorrect="off"][autocapitalize="off"][aria-required="true"][required="required"][spellcheck="false"][($focus)="appleIdFocusHandler()"][($blur)="appleIdBlurHandler()"][class="force-ltr form-textbox-input "][autocomplete="off"][aria-invalid="false"][data-focus-method="false"][value=""]

Desired behavior

The exception is handel and the tests is not failing.

Test code to reproduce

        cy.origin(
            "https://appleid.apple.com",
            { args: { email, password } },
            ({ email, password }) => {
               Cypress.on('uncaught:exception', () => false);
               cy.get('#account_name_text_field').parent().blur({force: true});
               Cypress.on('uncaught:exception', () => false);
               cy.get('#account_name_text_field').parent().type(email);
            }
        );

Here is the error:

(uncaught exception)Error: Syntax error, unrecognized expression: INPUT[type="text"][id="account_name_text_field"][can-field="accountName"][aria-labelledby="apple_id_field_label"][autocorrect="off"][autocapitalize="off"][aria-required="true"][required="required"][spellcheck="false"][($focus)="appleIdFocusHandler()"][($blur)="appleIdBlurHandler()"][class="force-ltr form-textbox-input "][autocomplete="off"][aria-invalid="false"][data-focus-method="false"][value=""]

Cypress Version

"cypress": "^13.6.1"

Node version

Node.js v18.15.0.

Operating System

Mac OS 14.3.1

Debug Logs

No response

Other

No response

[jennifer-shehane]

You should pull the Cypress.on('uncaught:exception', () => false); out to the top of the specFile or the support file. I'm not sure if that's exactly what's causing this issue, but I would call one outside of the tests.

[katQA]

Many thanks, this solved my issue! I pulled the handler at the top of the tests.