Javascript Cypress-使用Firebase SDK注销不工作
我有一个用Javascript Cypress-使用Firebase SDK注销不工作,javascript,firebase,vue.js,nuxt.js,cypress,Javascript,Firebase,Vue.js,Nuxt.js,Cypress,我有一个用Nuxt.js v.2.14.6编写的应用程序,我想使用Cypress v.5.4.0进行端到端测试。我使用Firebase SDK v.7.21.1进行身份验证。我创建了两个Cypress命令,一个用于创建新用户,另一个用于注销用户 设置: Cypress.Commands.add('register', ({ email, password, username }) => { cy.visit('') cy.contains('Sign Up').click()
Nuxt.js v.2.14.6编写的应用程序,我想使用Cypress v.5.4.0
进行端到端测试。我使用Firebase SDK v.7.21.1
进行身份验证。我创建了两个Cypress命令,一个用于创建新用户,另一个用于注销用户
设置:
Cypress.Commands.add('register', ({ email, password, username }) => {
cy.visit('')
cy.contains('Sign Up').click()
cy.url().should('contain', 'sign-up')
cy.get('input[id=username]').type(username)
cy.get('input[id=email]').type(email)
cy.get('input[id=password]').type(password)
cy.get('input[type=submit]').click()
cy.contains('Creating your account...')
cy.location('pathname', { timeout: 20000 }).should('eq', '/')
})
我的应用程序中的用户注册是在url/sign-up
上执行的(因此在第3行中进行url检查)。成功注册后,用户将重定向到主页(因此在最后一行进行位置检查)
用户可以通过导航栏中的下拉菜单注销。当“我的导航栏”中的下拉菜单消失并且出现“登录”按钮时,注销成功(因此在最后一行包含检查)
在我的应用程序中,我还有一个插件authlistener.client.js
,它使用Firebase SDK
的方法onIdTokenChanged
来确定注销事件。authlistener.client.js
如下所示:
export default async function ({ app, store, $sentry }) {
const isServerAuthenticated = store.getters.IS_AUTHENTICATED
if (!isServerAuthenticated) {
try {
await app.$fireAuth.signOut()
} catch {}
}
app.$fireAuth.onIdTokenChanged(async function (authUser) {
if (authUser) {
try {
await _handleAuthSuccess(authUser)
} catch (e) {
await _handleAuthError(e)
}
} else {
await _handleSignOut()
}
})
async function _handleAuthSuccess(authUser) {
const { claims, token } = await authUser.getIdTokenResult()
const user = BuildProfile(authUser, claims)
await store.dispatch('SET_SESSION_COOKIE', token)
store.commit('SET_USER', user)
}
async function _handleSignOut() {
store.commit('SET_USER', null)
await store.dispatch('SET_SESSION_COOKIE', null)
}
async function _handleAuthError(error) {
$sentry.captureException(error)
}
}
signOut() {
this.$fireAuth.signOut()
this.view.isUserMenuOpen = false
}
在导航栏的模板中,我有一个按钮,用于触发注销事件
<button @click="signOut" role="menuitem" data-cy="nav-sign-out">
Sign out
</button>
此方法使用由上述authlistener
插件处理的Firebase SDK
的signOut()
方法
无论是在生产中还是通过npm-run-dev
开发中,所描述的过程都运行良好
问题:
Cypress无法正确执行注销。Cypress能够使用我的注册
页面创建新用户。Cypress还可以打开导航栏下拉列表并单击注销按钮。Cypress中失败的是用户的实际注销,也就是说,用户下拉列表没有被登录按钮替换
由于Firebase将身份验证信息存储在indexedDb
中,因此我比较了本地开发设置的索引数据库和Cypress环境。有趣的是,在用户创建之后,Cypress环境中没有存储任何用户信息,但是在本地开发人员设置中存储了相关的用户信息
相关问题/解决方案
我发现了一个Github,它结合Firebase indexedDb解决了Cypress的一些问题。不幸的是,在每次测试运行之前清除indexedDB的解决方案对我不起作用
signOut() {
this.$fireAuth.signOut()
this.view.isUserMenuOpen = false
}