I'm trying to use fixtures to hold data for different tests, specifically user credentials. This is an example of the code. I'm getting 'Cannot read properties of undefined (reading 'data')'. I tried to google search , I found Cypress fixtures - Cannot read properties of undefined (reading 'data')

I used closure variable technique as reccomended in that post , yet I got reference error of unable to reference data.Please help me.I know cypress.config can be used but I want to keep that for global configs

Json(credentials.json):

{
    "username":"*****",
    "password":"*****"
}

Code:

import { LoginPage } from "./pageobject/login_page"
describe('Test Scenario', () => {
    before(function () {
        cy
            .fixture('credentials').then(function (data) {
                this.data = data
            })
    })
    it('Simple login', () => {
       
        cy.visit(Cypress.env('url'))
        var loginpage = new LoginPage()
        loginpage.EnterUsername(this.data.username)
        loginpage.clickonSubmit()
        loginpage.EnterPassword(this.data.password)
        loginpage.clickonSubmit()
         Cypress
            .on('uncaught:exception', (err, runnable) => {
                return false;
            });
        cy.
            wait(10000)
        cy.
            get('span[id="user"]').should('have.text', this.data.username , 'User Login Unsuccessfully')



    });
});

CodePudding user response：

I suspect it's because you are using an arrow function instead of a regular function, you cannot access the this object with an arrow function.

Cypress docs

If you store and access the fixture data using this test context object, make sure to use function () { ... } callbacks. Otherwise the test engine will NOT have this pointing at the test context.

change it to this:

it('Simple login', function() {
       

   ...

    });

CodePudding user response：

There's a few things need adjusting

• use function () {} syntax in the it() block

• use beforeEach() and alias to load the fixture, because data on this can be cleared (especially after login)

• move uncaught:exception catcher to the top of the block

• don't cy.wait(), instead add timeout to next command

• .should() only has two parameters in this case, so use .and() to test the 2nd text

import { LoginPage } from './pageobject/login_page';

describe('Test Scenario', () => {

    beforeEach(function () {
        cy.fixture('credentials').as('data')
    })

    it('Simple login', function() {

        Cypress.on('uncaught:exception', (err, runnable) => {
            return false;
        });

        cy.visit(Cypress.env('url'));
        var loginpage = new LoginPage();
        loginpage.EnterUsername(this.data.username);
        loginpage.clickonSubmit();
        loginpage.EnterPassword(this.data.password);
        loginpage.clickonSubmit();

        cy.get('span[id="user"]', {timout:10_000})
          .should('have.text', this.data.username)
          .and('have.text', 'User Login Unsuccessfully')
    })
})