isabella232 / storytests-webpack-plugin

Plugin for creating test files according to Storybook

Storytests Webpack Plugin

If you use Storybook and you want to cover all your stories by tests, this plugin helps you to do this.
This plugin creates test files based on your Storybook structure.

Installation

npm i storytests-webpack-plugin --save-dev

Usage

Define parameters

1. path to stories

   storyFilesPath: string; // e.g. "components/**/__stories__/*.stories.tsx"

2. pattern for component name in your story files

   componentNamePattern: RegExp; // e.g. /[a-z]+(?=", module)/gi

3. pattern for story name in your story files

   storyNamePattern: RegExp; // e.g. /[a-z ]+(?=", \(\) => )/gi

4. path to directory with tests related to story

   testDirectoryPath: string; // e.g." ../../tests"

5. postfixes for test files

   testFilePostfixes: string[]; // e.g. ['hermione']

6. function for generating test file

   testTemplate: (componentName: string, storyName: string) => string;

Add the plugin to your webpack config

import StorytestsWebpackPlugin from 'storytests-webpack-plugin';
import { componentNamePattern, storyFilesPath, storyNamePattern, testDirectoryPath, testFilePostfixes } from './constants/';
import { testTemplate } from './helpers/';
...
module.exports = {
    ...
    plugins: [
        new StorytestsWebpackPlugin({
            componentNamePattern,
            storyFilesPath,
            storyNamePattern,
            testDirectoryPath,
            testFilePostfixes,
            testTemplate
        })
    ]
}

For contributors

Required Node.js version: 12.18.0
Required npm version: 6.14.4
How to install: https://nodejs.org/en/download/

How to publish

1. Update package version in package.json and package-lock.json

2. Run:

npm run build
npm publish