首页 > 解决方案 > Cypress:无法在 Cypress 浏览器中登录

问题描述

我正在尝试使用 Cypress 设置 Vue 应用程序的 E2E 测试。

我可以使用我的常规 Chrome 浏览器登录该应用程序。但是,Chrome打开的浏览器不让我登录。通过Cypress自动登录和手动登录都失败了。

有没有我缺少的设置?

我的 Vue 元素:

<template>
    <div class="d-flex justify-content-center">

            <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>

我的测试文件:

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');
        })
    })
})

更新:这里有一些建议:https ://github.com/cypress-io/cypress/issues/1759#issuecomment-391729559

标签: cypress

解决方案


在 e2e 测试运行时,你能看到任何东西吗?就像赛普拉斯在那个字段中打字一样?

除了我不会使用非常通用的定位器这一事实之外,我会停下来.click()然后检查新路径cy.url()


推荐阅读