Search code examples
javascriptcypress

Data from fixture file cannot be extracted


I'm trying to get data from a json file to use in my test, but it always gives me an error saying it can't be fetched. I checked a lot of things on the internet, a lot of videos, personally I can't find my problem.

  • Cypress version 13.06

fixture file call "userData.json":

{
  "userName": "John"
}

describe block:

describe("Cypress Test", () => {
  beforeEach(function () {
    cy.fixture("userData").then((userData) => {
      this.data = userData;
      cy.visit("WEBSITE");
    });
  });

My test:

 it("Handling FIXTURE", () => {
   cy.get('input[name="name"]').type(this.data.userName);
  });

The error:

TypeError
cy.xpath is not a function
cypress/e2e/dropDownFeatures.cy.js:86:8
  84 | 
  85 |   it("Handling FIXTURE", () => {
> 86 |     cy.get('input[name="name"]').type(this.data.userName);
     |        ^
  87 |   });
  88 | });
  89 | 

enter image description here enter image description here

this.data.userName => to feed the data from the file to the field I use it for


Solution

  • This is related to to the scope of the this.data variable. When using arrow functions, the this value is inherited from the enclosing lexical scope1. You can convert this to a regular function to fix the issue. Something like:

    // ...Rest
    
      it("Handling FIXTURE", function () { // <---- a regular function
        cy.get('input[name="name"]').type(this.data.userName);
      });
    });