在Cypress中，每个工作之前和之前是如何进行的？

Question

我想我错过了一些关于之前和之前的方式。我有一个规范文件，加载数据从夹具在之前的方法。这些数据中的一部分被用在之前的函数中，然后又被用在之前的函数中，以及在实际的测试中。规范文件包含2个测试。第一个测试按预期执行。第二个失败，因为beForeeach表示来自夹具的值之一未定义。

我的期望是，如果我加载数据从一个夹具在之前的方法，它应该是可用于所有测试规范文件。

在执行“检查按钮栏的状态”时，测试beforeach函数中的window.console.log（this.user_数据）是否按预期输出用户_数据。

执行“提交表单”测试时，beforeach函数中的window.console.log（this.user_数据）输出未定义，测试停止。

我错过了什么？

describe('Customer Profile', () => {

    before(function () {
        window.console.log('Enter the before function')
        // Load the fixture data. Its asynchronous so if we want to use it right here and now
        // we have to put the things that use inside a callback to be executed after the data
        // loaded. 
        cy.fixture('user').as('user_data').then(function (){
            window.console.log('Fixture has loaded the user data')
            cy.visit('/LaunchPad/login')
            // Fill out the login form
            cy.get('input[name="username"]').type(this.user_data.username)
            cy.get('input[name="password"]').type(this.user_data.password)
            cy.get('button[type="submit"]').click()
        })
    })

    beforeEach(function(){
        window.console.log('Enter the beforeEach function')
        window.console.log(this.user_data)
        // Preserve the cookies for all tests in this suite
        Cypress.Cookies.preserveOnce('SESSION')
        // Open the profile view
        cy.visit('/Manager/'+this.user_data.org+'/config/company-profile')
    })

    it('Check the state of the button bar', function(){
        window.console.log('Running test of button bar')
        cy.get('section.content-header > h1').contains('Company Profile Details')
        // Check the state of the action bar and its buttons
        cy.get('section.action-bar').get('label.btn.btn-sm.btn-primary').contains('Save')
            .should('have.attr', 'for', 'submit-form')
            .should('have.attr', 'tabindex', '0')

        cy.get('section.action-bar').get('#resetButton').contains('Reset')
            .should('have.attr', 'type', 'reset')
            .should('have.attr', 'value', 'Reset')
            .should('have.class', 'btn btn-sm btn-default')

        cy.get('section.action-bar').get('a.btn.btn-sm.btn-default').contains('Cancel')
            .should('have.attr', 'href', '/Manager/'+this.user_data.org+'/')

        cy.get('section.action-bar').get('a').contains('Delete').should('not.exist')

    })

    // This form has no required fields and no validation. So just pick a value or two
    // submit the form and verify the banner is correct
    it('Submit form', function(){
        window.console.log('Running the submit form test')
        cy.fixture('company_profile').as('company_profile')
        cy.get('#companyProfileDto.name').type(this.company_profile.name)
    })


})

根据卡洛斯·阿尔弗雷多（Carlos Alfredo）的回答，在阅读了更多的内容后，我更新了这篇文章。1.我仍然需要访问登录页面。我们使用csrf和誓言，试图得到工作的例子只是花了太多的时间。2.我必须为会话cookie使用白名单，因为preserveOnce根本不起作用。

这是我现在有的文件。它访问登录页面一次，并获取会话cookies设置。这两项测试按预期进行。

支持/index.js

before(function(){
    cy.login('bob', 'password')
    cy.fixture('user').as('user_data')
    cy.fixture('company_profile').as('company_profile')
})

beforeEach(function(){
    window.console.log('Enter the global beforeEach function')
    // Load the fixture data

})

support/commands.js

/*
    We visit the login form despite what the best practise recommendation is because
    we have OAUTH redirects and a CSRF token to deal with. Since the majority of the
    examples and working use cases provided dont deal with those scenarios this is 
    the best I can do at the moment. 
*/
Cypress.Commands.add('login', (username, password, options = {}) => {
    cy.visit('/LaunchPad/login')
    // Fill out the login form
    cy.get('input[name="username"]').type(username)
    cy.get('input[name="password"]').type(password)
    cy.get('button[type="submit"]').click()
})
/*
    We are white listing the cookie because Cypress.Cookies.preserveOnce('SESSION') 
    does not work. https://github.com/cypress-io/cypress/issues/2952

    Because we are forcing Cypress to not clear the cookies, you will have to close
    the test window after the suite is completed other wise the Vision360 apps will
    think your session is alive.
*/
Cypress.Cookies.defaults({
    whitelist: 'SESSION'
})

集成/customer\u profile/customer\u profile\u spec.js

describe('Customer Profile', () => {

    it('Check the state of the button bar', function(){
        window.console.log('Running test of button bar')

        cy.visit('/Manager/'+this.user_data.org+'/config/company-profile')

        cy.get('section.content-header > h1').contains('Company Profile Details')
        // Check the state of the action bar and its buttons
        cy.get('section.action-bar').get('label.btn.btn-sm.btn-primary').contains('Save')
            .should('have.attr', 'for', 'submit-form')
            .should('have.attr', 'tabindex', '0')

        cy.get('section.action-bar').get('#resetButton').contains('Reset')
            .should('have.attr', 'type', 'reset')
            .should('have.attr', 'value', 'Reset')
            .should('have.class', 'btn btn-sm btn-default')

        cy.get('section.action-bar').get('a.btn.btn-sm.btn-default').contains('Cancel')
            .should('have.attr', 'href', '/Manager/'+this.user_data.org+'/')

        cy.get('section.action-bar').get('a').contains('Delete').should('not.exist')

    })

    // This form has no required fields and no validation. So just pick a value or two
    // submit the form and verify the banner is correct
    it('Submit form', function(){
        window.console.log('Running the submit form test')
        cy.visit('/Manager/'+this.user_data.org+'/config/company-profile')

        // Fill and submit the form
        cy.get('input#companyProfileDto\\.name').clear().type(this.company_profile.name)
        cy.get('section.action-bar').get('label.btn.btn-sm.btn-primary').contains('Save').click()

        // Check the response
        cy.get('.callout-success').contains('Your changes are saved.')
        cy.get('input#companyProfileDto\\.name').should('have.value', this.company_profile.name)
    })

})

Answer 1

如果您保存了一组会话cookie，最快的方法可能是硬编码/暴力将它们强制进入生活，例如：

  beforeEach(() => {
    Cypress.Cookies.preserveOnce('SESSION')     // remember cookies for this session:
    cy.setCookie('logged_in_cookie_name', '000000000000000000000') // hard coded session cookie
    cy.setCookie('security_salt_etc', '000000000000000000000') // its like a revokable password but more secure
  })
  after(() => {    // logout!
    cy.clearCookies()
  })

Answer 2

看起来cypress正在为每个测试清理夹具。

摘自《柏树指南》关于“悬空之州”

... 事实上，当测试结束时，Cypress不会清理自己的内部状态。我们希望您在测试结束时处于悬挂状态！测试结束时，诸如存根、间谍甚至路线之类的东西都不会被移除。这意味着您的应用程序在运行Cypress命令时或在测试结束后手动使用它时的行为将相同。

该页面中没有关于fixtures的明确说明，但是，看起来它正在发生，并且fixtures也被清理了。这就是beforeach（）在第一个测试中起作用（检查按钮栏的状态），因为它正好在before（）之后运行。对于第二个测试，在钩子之前在中设置的所有内容都消失了，现在beforeach（）正在尝试获取从未定义过的装置。

希望能有帮助。

其他一些建议：

• 将您的登录作为一个自定义命令来执行是一个很好的做法，只需使用请求即可跳过UI

Answer 3

我遇到了一个几乎和你以前一样的问题。

在下一个代码块之前运行。

describe("Some test", function() {
    before(function() {
        //something ...
        cy.request('POST', loginUrl, loginInformation).its('body').as('currentUser')
    })

    // this.currentUser exists here
    it("Should foo", function() {
    })

    // this.currentUser doesn't exist here
    it("Should bar", function() {
    })
})

我修复了将（）之前的语句从描述范围中移出的问题。

before(function() {
    //something ...
    cy.request('POST', loginUrl, loginInformation).its('body').as('currentUser')
})

describe("Some test", function() {     
    // this.currentUser exists here
    it("Should foo", function() {
    })

    // this.currentUser also exists here
    it("Should bar", function() {
    })
})

我希望这能帮助你解决你的问题。