Documentation
File Conventions

File Conventions

Three options:

  1. End fixture file names with .fixture.{js,jsx,ts,tsx,md,mdx}.
  2. Put fixture files inside __fixtures__ directories.
  3. Use fixture.{js,jsx,ts,tsx,md,mdx} as the name.

The file paths of your fixture files (relative to your project root) are used to create a tree view explorer in the React Cosmos UI.

Examples (one fixture file per component)

  1. MyComponent.fixture.jsx
  2. __fixtures__/MyComponent.jsx
  3. MyComponent/fixture.jsx
    • MyComponent
  • Examples (multiple fixture files per component)

    1. MyComponent/blankState.fixture.jsx
    2. MyComponent/__fixtures__/blankState.jsx or __fixtures__/MyComponent/blankState.jsx
      • blankState
  • Configuration

    You can customize these file conventions in your Cosmos config:

    OptionDescriptionDefault
    fixturesDirName for directories that contain fixture files (eg. __fixtures__/example.jsx)."__fixtures__"
    fixtureFileSuffixSuffix for fixture files (eg. example.fixture.jsx)."fixture"
    ignorePatterns for ignoring fixture and decorator files (eg. ["**/dist/**"]).