'Where are fixtures located in the file structure of synpress (cypress) tests?

I am attempting to test my react app using synpress, which is a wrapper around cypress that allows you to interact with the metamask crypto wallet browser extension. I have set up my tests and they are working, but I need to utilize a fixture for some of them, but I cannot figure out where the fixtures are stored.

https://github.com/synthetixio/synpress#readme

Below is the current folder setup I have (which is the same as how the docs are):

project_dir
└── src
└── tests
    └── e2e
        └── .eslintrc.js
        └── tsconfig.json
        └── specs
            └── example-spec.js
        └── pages
            └── example-page.js

I need to read in some data from a fixture, so I have added a fixtures folder to the e2e directory (such that it is at project_dir/tests/e2e/fixtures), but no matter what I try it is erroring and saying that fixtures should be stored under node_modules@synthetixio/synpress/fixtures/, which I don't think would be correct.

Is there additional config required to utilise fixtures?



Solution 1:[1]

You can configure the fixture folder path in config.js file

{
 "fixturesFolder": "/tests/e2e/fixtures"
}

You can also verify the fixture folder value in Cypress Test Runner.

  1. Open Cypress Test runner: npx cypress open
  2. Settings
  3. Find Fixture Folder

enter image description here

Solution 2:[2]

Take a look at the example package.json scripts here, you can specify the fixtures folder on the command line

"test:e2e": "start-server-and-test ... --config='fixturesFolder=tests/e2e/fixtures'"

Or try adding synpress.json to project root - synpress.json

{
    "baseUrl": "http://localhost:3000",
    "userAgent": "synpress",
    "retries": { "runMode": 0, "openMode": 0 },
    "integrationFolder": "tests/e2e/specs",

    "fixturesFolder": "tests/e2e/fixtures",

    "screenshotsFolder": "tests/e2e/screenshots",
    "videosFolder": "tests/e2e/videos",
    "chromeWebSecurity": true,
    "viewportWidth": 1366,
    "viewportHeight": 768,
    "component": {
        "componentFolder": ".",
        "testFiles": "**/*spec.{js,jsx,ts,tsx}"
    },
    "env": {
        "coverage": false
    },
    "defaultCommandTimeout": 30000,
    "pageLoadTimeout": 30000,
    "requestTimeout": 30000
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nischay tv
Solution 2