如何在 Cypress 的所有测试中访问相同的别名

Question

I'm trying to make the same alias, that is accessible in severel different tests. And the documentation doesn't explain how to achieve this.

I'm trying to do this:

Before
 - Generate datetime-stamp as a string: $dateTime

Test 1
 - Test that no order exists where $dateTime is the first name for the buyer.

Test 2
 - Make an order, setting $dateTime as the first name

Test 3
 - Test that there is an order where $dateTime is the first name

How do I, in the before() -function make a variable that is accessible in all my tests? ... And please note, that since the $dateTime should be the same in all tests, then it should be generated once and not in beforeEach() .

Update1

I can see that it is actually described in the "Do not do this"-section here . But I don't see how this is 'making my code do backflips'.

---

Update2

And are there an advantage of using fixtures, if I do this anyway:

context( 'Buy product' , function () {
    let dateTime = new Date();
    let dateTimeStr = dateTime.toLocaleDateString('en-GB', { year: 'numeric', day: 'numeric', month: 'short', hour: 'numeric', minute: 'numeric', second: 'numeric' });
    dateTimeStr = dateTimeStr.replaceAll( ', ', '--' );
    dateTimeStr = dateTimeStr.replaceAll( ' ', '-' );
    dateTimeStr = dateTimeStr.replaceAll( ':', '' );


    beforeEach( () => {
        cy.wrap( dateTimeStr ).as('dateTimeStr');
    });


    it( 'Order with DateTime DOES NOT exists', () => {
        cy.visit( 'https://example.org/dashboard/orders' );

        cy.get( "@dateTimeStr" )
        .then( (dateTimeStr) => {
            cy.contains( dateTimeStr ).should('not.exist');
        });
    });


    it( 'Buy product', function() {

        cy.visit( 'https://example.org/product/test' );
        ...
        cy.get( '#first_name' ).type( this.dateTimeStr );
        ...
        cy.get('#submit_order').click();
    });


    it( 'Order with DateTime exists', () => {
        cy.visit( 'https://example.org/dashboard/orders' );

        cy.get( "@dateTimeStr" )
        .then( (dateTimeStr) => {
            cy.contains( dateTimeStr ).should('exist');
        });
    });


});

This code works. But is explicitly mentioned in the documention, that I shouldn't do this. However... The documention doesn't really explain why. Flakyness? Anti-pattern? I don't know. It seems pretty smart to me.

Answer 1

I aggree with the documentation that using an allias that covers all documents is wrong, but the thing you are trying to do is not wrong and I suggest use Custom command

 Cypress.Commands.add('getDateTimeStr', () => {
    let dateTime = new Date();
    let dateTimeStr = dateTime.toLocaleDateString('en-GB', { year: 'numeric', day: 'numeric', month: 'short', hour: 'numeric', minute: 'numeric', second: 'numeric' });
    dateTimeStr = dateTimeStr.replaceAll( ', ', '--' );
    dateTimeStr = dateTimeStr.replaceAll( ' ', '-' );
    dateTimeStr = dateTimeStr.replaceAll( ':', '' );
    cy.wrap(dateTimeStr).as('dateTimeStr')
})

And use it in the beforeEach

 context( 'Buy product' , function () {
    beforeEach( () => {
        cy.getDateTimeStr()
    });
    
    
    it( 'Order with DateTime DOES NOT exists', () => {
        cy.visit( 'https://example.org/dashboard/orders' );
        
        cy.get( "@dateTimeStr" )
            .then( (dateTimeStr) => {
                cy.contains( dateTimeStr ).should('not.exist');
            });
    });
    
    
    it( 'Buy product', function() {
        
        cy.visit( 'https://example.org/product/test' );
    ...
        cy.get( '#first_name' ).type( this.dateTimeStr );
    ...
        cy.get('#submit_order').click();
    });
    
    
    it( 'Order with DateTime exists', () => {
        cy.visit( 'https://example.org/dashboard/orders' );
        
        cy.get( "@dateTimeStr" )
            .then( (dateTimeStr) => {
                cy.contains( dateTimeStr ).should('exist');
            });
    });
    
    
});