styleguidist / Snapguidist
Licence: mit
Snapshot testing for React Styleguidist
Stars: ✭ 287
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Snapguidist
GFontsSpace
Preview: https://pankajladhar.github.io/GFontsSpace
Stars: ✭ 88 (-69.34%)
Mutual labels: jest, snapshot-testing
Typescript Snapshots Plugin
Snapshots language service support for Typescript
Stars: ✭ 122 (-57.49%)
Mutual labels: jest, snapshot-testing
Snapshot Diff
Diffing snapshot utility for Jest
Stars: ✭ 490 (+70.73%)
Mutual labels: jest, snapshot-testing
jest-file-snapshot
Jest matcher to write snapshots to a separate file instead of the default snapshot file used by Jest
Stars: ✭ 35 (-87.8%)
Mutual labels: jest, snapshot-testing
Enzyme To Json
Snapshot test your Enzyme wrappers
Stars: ✭ 954 (+232.4%)
Mutual labels: jest, snapshot-testing
reducer-tester
Utilities for testing redux reducers
Stars: ✭ 19 (-93.38%)
Mutual labels: jest, snapshot-testing
jest-mock-date-examples
Different approaches to mocking the Date in Jest tests
Stars: ✭ 22 (-92.33%)
Mutual labels: jest
egghead-bookshelf
An example React application to accompany the "Add Internationalization (i18n) to a React app using React Intl" Egghead.io course
Stars: ✭ 28 (-90.24%)
Mutual labels: jest
automock
A library for testing classes with auto mocking capabilities using jest-mock-extended
Stars: ✭ 26 (-90.94%)
Mutual labels: jest
React Native Navigation Redux Starter Kit
React Native Navigation(v2) Starter Kit with Redux, Saga, ESLint, Babel, Jest and Facebook SDK 😎
Stars: ✭ 271 (-5.57%)
Mutual labels: jest
Simple React App
Simple base app using react, react-router v4, hot-reload & sass.
Stars: ✭ 263 (-8.36%)
Mutual labels: jest
Rockpack
Rockpack is a simple solution for creating React Application with Server Side Rendering, bundling, linting, testing within 5 minutes
Stars: ✭ 265 (-7.67%)
Mutual labels: jest
awesome-javascript-testing
🔧 Awesome JavaScript testing resources
Stars: ✭ 28 (-90.24%)
Mutual labels: jest
gradle-upgrade-interactive
CLI to interactively upgrade gradle dependencies, inspired by yarn.
Stars: ✭ 44 (-84.67%)
Mutual labels: jest
puppeteer-screenshot-tester
Small library that allows us to compare screenshots generated by puppeteer in our tests.
Stars: ✭ 50 (-82.58%)
Mutual labels: jest
Jest Snapshot Testing for React Styleguidist.
Demo
Getting Started
To add snapguidist
to your react-styleguidist
configuration, follow these steps:
- install the package using yarn or npm:
yarn add --dev snapguidist
- enhance the webpack configuration in
styleguide.config.js
:
+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.
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:
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:
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:
yarn build:watch & yarn start
Credits
Logo by @SaraVieira
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].