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.
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
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);
});
});