cypress: Can't log in to app under test

Current behavior:

My app’s login component will not let me log in when opened with the Cypress browser. I can log in via the normal Chrome browser. Copypasting the username and password which work in the normal browser to the Cypress browser ralso esults in a login error.

Desired behavior:

Valid credentials should let me log in.

Steps to reproduce:

Cypress test:

describe('Logging in', () => {
	it('Logs in as admin', () => {
		cy.visit('/')
            .get('input[type="text"]')
            .type('Admin')
		    .get('input[type="password"]')
            .type('Pass1234')
            .get('button').click()
		    .location().should((loc) => {
			expect(loc.pathname).to.eq('/dashboard-main/dashboard');
		})
	})
})

Login component (Vue):

<template>
    <div class="d-flex justify-content-center">
        <div v-if="isAuthenticated" class="text-center">
            <div>Hello, authenticated user!</div>
            <button v-on:click="logout()" class="button is-primary">Logout</button>
        </div>
        <div v-else>
            <div class="field is-horizontal">
                <div class="field-label is-normal">
                    <label class="label">Username</label>
                </div>
                <div class="field-body">
                    <div class="field">
                        <div class="control">
                            <input v-model="username" class="input" type="text"
                                   placeholder="Your username">
                        </div>
                    </div>
                </div>
            </div>
            <div class="field is-horizontal">
                <div class="field-label is-normal">
                    <label class="label">Password</label>
                </div>
                <div class="field-body">
                    <div class="field">
                        <div class="control">
                            <input v-model="password" class="input" type="password"
                                   placeholder="Your password">
                        </div>
                    </div>
                </div>
            </div>
            <div class="field is-horizontal">
                <div class="field-label">
                    <!-- Left empty for spacing -->
                </div>
                <div class="field-body">
                    <div class="field">
                        <div class="control text-center">
                            <button v-on:click="login()" class="button is-primary">
                                Login
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

Versions

Cypress: ^2.1.0 OS: Windows 10 Browser: Chrome 66.0.3359.139

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Comments: 38 (10 by maintainers)

Most upvoted comments

Not sure, I do not know whats going on, it seems to be priority for most of us I think now.

@boriskogan81 Wow, thank you so much! I prefixed a DEBUG=cypress:* to my cypress open command, and the login process works! If you think this is the proper solution, feel free to close the issue.

Update: This actually doesn’t fix my issue. The bug I posted above seems to occur non-deterministically, so prefixing a DEBUG=cypress:* seemed to fix it, but it was only temporary and perhaps a coincidence.