英文:
Navigate into 2 pages in the same test
问题
这是你提供的 JavaScript 代码的翻译：
我在JavaScript和Cypress中非常新，如果这是非常简单的事情，请原谅我。
我想要做的是在一个测试中导航到两个页面。
我的test.cy.js文件包含以下代码：
describe('Sitop Manager登录页面', () => {
it('打开登录页面，填写表单并单击提交', () => {
cy.visit('/login')
cy.get('input[name="username"]').type('admin')
cy.get('input[name="password"]').type('admin')
cy.contains('Login').click()
})
it('打开设备页面', () => {
cy.visit('/devices')
cy.wait(500)
cy.get('ix-menu ix-menu-item[tab-icon=cogwheel]').click() //CSS选择器
})
})
问题在于，当它完成/login页面后，它会重新加载到登录页面，因此/devices页面无法进行测试。在我的cypress.config.js文件中，我已经设置了baseUrl：
const { defineConfig } = require("cypress");
module.exports = defineConfig({
e2e: {
baseUrl: 'http://localhost:3000', //在所有测试类中使用的baseUrl
setupNodeEvents(on, config) {
// 在这里实现节点事件监听器
},
},
});
希望这有所帮助。如果你有任何问题，请随时提出。
英文:
I'm very new in Javascript and Cypress so pardon me if it's something very simple.
What I would like to do is to navigate into 2 pages inside one test.
My test.cy.js file has this code:
describe('Sitop Manager Login Page', () => {
it('opens login page, fill the form and clicks submit', () => {
cy.visit('/login')
cy.get('input[name="username"]').type('admin')
cy.get('input[name="password"]').type('admin')
cy.contains('Login').click()
})
it('Open devices page', () => {
cy.visit('/devices')
cy.wait(500)
cy.get('ix-menu ix-menu-item[tab-icon=cogwheel]').click() //css selector
})
})
The issue is that when it finishes the /login page, then it reloads to login page again so the /devices page cannot be tested. In my cypress.config.js file i have setted the baseUrl
const { defineConfig } = require("cypress");
module.exports = defineConfig({
e2e: {
baseUrl: 'http://localhost:3000', //Baseurl to be used in all accross the testing classes
setupNodeEvents(on, config) {
// implement node event listeners here
},
},
});
答案1
得分: 1
如果 /devices 是一个需要登录的路由，那么任何访问它的测试的第一步都必须是登录。因此，你总是需要首先访问 /login，经过登录流程，然后才能访问 /devices。
wait 在登录之后访问 /devices 之前可能是不必要的，这取决于你的测试环境的默认超时设置。
如 @jjhelguero 在评论中提到的，你还可以拦截网络请求（也许是到你的登录端点），等待它成功返回作为 wait 的替代。get 会进行重试，但可能会超时：https://docs.cypress.io/api/commands/intercept
有一些方法可以避免实际登录，比如设置一个会话cookie，但可能你想要在测试中模拟实际用户的工作流程。
英文:
If /devices is a "login required" route, then the first step in any test that accesses it must be to log in. So you will always need to visit /login first, go through the login workflow, then you can visit /devices.
it('Open devices page', () => {
cy.visit('/login')
cy.get('input[name="username"]').type('admin')
cy.get('input[name="password"]').type('admin')
cy.contains('Login').click()
cy.wait(500)
cy.visit('/devices')
cy.get('ix-menu ix-menu-item[tab-icon=cogwheel]').click() //css selector
})
The wait after logging in and before visiting /devices may not be necessary, depending on the default timeout settings for your testing environment.
As @jjhelguero mentioned in the comments, you can also intercept a network request (perhaps to your login endpoint) and wait for it to return successfully as an alternative to the wait. get will retry, but could timeout: https://docs.cypress.io/api/commands/intercept
There are things you can do to avoid needing to actually log in, like setting a session cookie, but probably you want to emulate the actual user workflow in your tests.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论