Cannot read property 'indexOf' of undefined when using .type()

Current behavior:

I’m currently using Cypress version 3.4.1 to run automation tests. I have a SignIn test suite to validate the login functionality . They are pretty straightforward tests that run against the application URL and validate if the user is able to login to the the app or not.

In Cypress 3.4.1, the login tests are executed successfully. But when I tried to upgrade to a version > 3.4.1, for example: latest version 3.8.1, I see this error TypeError: Cannot read property 'indexOf' of undefined

Let’s take this one test should display en error on invalid login attempt as an example

I see the following error when I try to type in the username into the #login_username input field.

Console output:

Desired behavior:

Cypress should Type the username into the input text box successfully.

Console output when the behavior is correct.

Test code to reproduce

Below is the code for the Invalid Login test

    it('should display en error on invalid login attempt', () => {
      cy.get('#login_username')
        .type('insuranceproctor');

      cy.get('#login_password')
        .type('54321drowssap');

      cy.get('#signin-btn')
        .should('be.enabled')
        .click();

      cy.get('h3')
        .should('be.visible')
        .and('contain', 'Whoops!');

      cy.get('p')
        .eq(0)
        .should('be.visible')
        .and('contain', 'Your username and password don\'t match, please try again.');

      cy.url()
        .should('contain', 'signin');
    });

Versions

Currently used version: Cypress 3.4.1 Chrome 79

Seeing this error in versions 3.5.0 and above.

Extra Info

The URL loads just fine and I’m able to see the sign-in screen and the cookies are loading correctly. All other tests where I have the login functionality mocked pass 100% I’m seeing this issue only with these tests which interact directly with the UI to login.

Workaround

I’m able to use invoke to change the value of the input fields, but that’s not the actual purpose of the login test so I definitely need a solution. I’m a fan of Cypress and I’m super excited to see all the improvements you guys are doing! thanks a lot ❤️

[sainthkh]

It seems that the problem is more with simple.com’s code than Cypress.

When you beautify the problematic code, you can find that Event class is extended.

n = this.Event = this.DOMEvent = new Type("DOMEvent", function(n, i) {
    if (i || (i = window),
        n = n || i.event,
        n.$extended)
        return n;
    this.event = n,
        this.$extended = !0,
        this.shift = n.shiftKey,
        this.control = n.ctrlKey,
        this.alt = n.altKey,
        this.meta = n.metaKey;
    for (var r = this.type = n.type, s = n.target || n.srcElement; s && 3 == s.nodeType;)
        s = s.parentNode;
    if (this.target = document.id(s),
        0 == r.indexOf("key")) {

But the problem is that they only considered the case when the type of n is an Event, not string.

So, when Cypress sent a simple Event with "keydown" as the first argument, r.indexOf("key") couldn’t work.

I’m currently fixing this. It might take a little bit longer than expected because I need to simplify this problem and create a test case.

And it also should be fixed with #5650. Interestingly, they’re 2 separate problems, but the solution is the same.

[jennifer-shehane]

I’m able to recreate this error with the code below. This is a regression introduced in Cypress 3.5.0

it('throws error', () => {
  cy.visit('https://signin.simple.com')
  cy.get('#login_username')
    .type('foobar')
})

3.4.1

3.5.0