# snapguidist

> Snapshot testing for React Styleguidist

Latest version **4.0.0** (published 2018-08-17) · MIT license · 0 weekly downloads

## Install

```sh
npm install snapguidist
pnpm add snapguidist
yarn add snapguidist
bun add snapguidist
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 4.0.0 |
| Published | 2018-08-17 |
| First published | 2016-12-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 10 |
| Unpacked size | 26.9 KB |
| Known vulnerabilities | 0 (+3 in 2 direct dependencies) |
| Install scripts | no |
| GitHub stars | 286 |
| Maintainers | cef62, michelebertoli |

## Links

- npm: https://www.npmjs.com/package/snapguidist
- Repository: https://github.com/styleguidist/snapguidist
- Homepage: https://github.com/styleguidist/snapguidist#readme
- Issues: https://github.com/styleguidist/snapguidist/issues
- npm.io page: https://npm.io/package/snapguidist

## Dependencies (10)

- [cors](https://npm.io/package/cors.md) 2.8.4
- [unfetch](https://npm.io/package/unfetch.md) 3.1.1
- [jest-diff](https://npm.io/package/jest-diff.md) 23.5.0
- [classnames](https://npm.io/package/classnames.md) 2.2.6
- [codemirror](https://npm.io/package/codemirror.md) 5.39.2
- [strip-ansi](https://npm.io/package/strip-ansi.md) 4.0.0
- [body-parser](https://npm.io/package/body-parser.md) 1.18.3
- [jest-snapshot](https://npm.io/package/jest-snapshot.md) 23.5.0
- [react-codemirror2](https://npm.io/package/react-codemirror2.md) 5.1.0
- [react-test-renderer](https://npm.io/package/react-test-renderer.md) 16.4.2

## Recent versions

- 4.0.0 (latest) — 2018-08-17
- 3.1.2-0 (next) — 2018-04-15
- 3.1.2 — 2018-04-15
- 3.1.1 — 2018-03-03
- 3.1.0 — 2018-02-24
- 3.0.0 — 2018-02-04
- 3.0.0-3 — 2018-02-04
- 2.1.1 — 2017-11-15
- 2.1.0 — 2017-09-30
- 2.0.1 — 2017-09-04
- 2.0.1-0 — 2017-09-04
- 2.0.0 — 2017-06-18
- 2.0.0-7 — 2017-06-17
- 2.0.0-6 — 2017-06-14
- 2.0.0-5 — 2017-06-14
- … 15 more at https://npm.io/package/snapguidist/versions

## README

[![Build Status](https://travis-ci.org/styleguidist/snapguidist.svg?branch=master)](https://travis-ci.org/styleguidist/snapguidist)
[![NPM version](https://img.shields.io/npm/v/snapguidist.svg)](https://www.npmjs.com/package/snapguidist)
[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)

<img alt="Preview" src="logo.png" width="450px" height="166px" />

[Jest](https://github.com/facebook/jest) Snapshot Testing for [React Styleguidist](https://github.com/styleguidist/react-styleguidist).

## Demo

![Demo](demo.gif)

## Getting Started

To add `snapguidist` to your `react-styleguidist` configuration, follow these steps:

1. install the package using yarn or npm:

  ```bash
  yarn add --dev snapguidist
  ```

2. enhance the webpack configuration in `styleguide.config.js`:

  ```diff
  +const snapguidist = require('snapguidist');
  -module.exports = {
  +module.exports = snapguidist({
    components: 'src/components/**/[A-Z]*.js',
    defaultExample: true,
    webpackConfig: {
      module: {
        rules: [
          {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
          },
          {
            test: /\.css$/,
            loader: 'style-loader!css-loader',
          },
        ],
      },
    },
  -};
  +});
  ```

## Migrate to v4

In v4, snapshots have been renamed to `.sg` (as opposed to `.snap`) to avoid conflicts with Jest, and improve compatibility with [create-react-app](https://github.com/facebook/create-react-app).

Once upgraded to v4, please run `yarn test -u` to remove the old snapshots (new ones will be automatically generated on the next run)
or the following commands to rename them:
```sh
cd .snapguidist/__snapshots/
for old in *.snap; do git mv $old `basename $old .snap`.sg; done
```

## Example

To run the example, install the dependencies and start it:

```bash
cd example
yarn install
yarn start
```

## Development

> Any contribution to `snapguidist` is highly appreciated.

Run the following command from the root folder to enable the *hot-reload*:

```bash
yarn build:watch & yarn start
```

### Credits

Logo by [@SaraVieira](https://github.com/SaraVieira)

---
_Source: https://npm.io/package/snapguidist · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._