jest-preset-gatsby

GitHub Repo

Build Status npm version

Preset for testing Gatsby sites using Jest, based off the official documentation on testing Gatsby with Jest. Compatible with both JavaScript and TypeScript codebases.

Warning: Does Not Include gatsby module mocks.

Installation

Install preset using npm:

npm install --save-dev jest-preset-gatsby

or yarn:

yarn add --dev jest-preset-gatsby

Usage

Configure Jest to use the preset in jest.config.js:

module.exports = {
  preset: "jest-preset-gatsby"
};

or package.json:

{
  "jest": {
    "preset": "jest-preset-gatsby"
  }
}

Using in a TypeScript Project

This preset also includes a preset for TypeScript projects; configure Jest to use it in jest.config.js:

module.exports = {
  preset: "jest-preset-gatsby/typescript"
};

or package.json:

{
  "jest": {
    "preset": "jest-preset-gatsby/typescript"
  }
}

Mocking Gatsby Module

This package does not include mocks for the gatsby module. In order to sufficiently test your project your should probably mock the gatsby module, add the following at __mocks__/gatsby.js if you’re in need of one:

const React = require("react");
const gatsby = jest.requireActual("gatsby");

module.exports = {
  ...gatsby,
  graphql: jest.fn(),
  Link: jest.fn().mockImplementation(
    // these props are invalid for an `a` tag
    ({
      activeClassName,
      activeStyle,
      getProps,
      innerRef,
      partiallyActive,
      ref,
      replace,
      to,
      ...rest
    }) =>
      React.createElement("a", {
        ...rest,
        href: to
      })
  ),
  StaticQuery: jest.fn(),
  useStaticQuery: jest.fn()
};

License

Copyright 2019 Kepler Sticka-Jones. Licensed MIT