3.1.0 • Published 11 months ago
whales-story-shots v3.1.0
🐳📖📸Whales-story-shots
CLI API
shoot.js
- perform automatic story shootingcompare.js
- perform automatic image comparison
Support
- v1 - Storybook 4
- v2 - Storybook 5
API
Storybook API
- to activate whale-shots
import 'whales-story-shots/storybook/register';
- to activate dev mode hightlighting
import whalesStyles from 'whales-story-shots/storybook/styles';
<style dangerouslySetInnerHTML={{ __html: whalesStyles }} />
- to active shot for specific story
import whales from 'whales-story-shots/storybook/decorator';
addDecorator(whales({
hinted: { jsLingui: [Trans] }, // will "hint" jsLingui Trans components and store it's coordinates
failOnCatch: true|false // fail or not on any exception during the render (error image will be stored in any case)
}));
Whales API
compare/stories
- for comparisonshot/shooter
- for image generation
ENV
IMAGESDIR
(/build-output) - directory to store result imagesSOURCEDIR
(/images) - directory to get result images(for comparison)METADIR
(/meta-output) - directory to store result meta filesSTORYBOOK
(http://host.docker.internal:6006) - storybook locationSTORYBOOK_PORT
(6006) - portWAIT_UNTIL
(load) - load, idleISOLATED
(false) - should stories be shooted in isolation(slow) or notTHREAD_COUNT
(8) - workers countPATHRULE
- "path rule" file location
Volumes
/whales-story-shots/compare/pathRule
- to override file name generator
#!/usr/bin/env bash
DIR="$( cd "$( dirname "${BASH_SOURCE[0]}" )" >/dev/null && pwd )"
echo "data will be saved to"
echo "${DIR}/../../build-output/shots"
# force image update
./node_modules/whales-story-shots/install.sh
# run image generation
docker run --shm-size 1G --rm \
-v "${DIR}/../../build-output/shots":/build-output \
-v "${DIR}/../../build-output/shots/meta":/meta-output \
-e MODE="iframe" \
whales-story-shots:latest node /whales-story-shots/shoot.js
# run image comparison
docker run --shm-size 1G --rm \
-v "${DIR}/../../templates":/images \
-v"${DIR}/pathRule":/whales-story-shots/compare/pathRule \
-v "${DIR}/../../build-output/shots":/build-output \
-v "${DIR}/../../build-output/shots/meta":/meta-output \
whales-story-shots:latest node /whales-story-shots/compare.js
Docker less run
It just could be faster, especially if you are already inside Docker.
Generation
const shooter = require('whales-story-shots/shot/shooter');
const storybook = `file://${join(__dirname, '..', '..', 'storybook-static')}`;
const imagesDir = join(__dirname, 'shots');
shooter({
storybook,
imagesDir,
metaDir: join(imagesDir, 'meta'),
waitUntil: 'load',
isolated: false,
}).then(() => {
process.exit();
});
Comparison
export METADIR="${DIR}/../../build-output/shots/meta"
export IMAGESDIR="${DIR}/../../build-output/shots"
export SOURCEDIR="${DIR}/../../templates"
export PATHRULE="${DIR}/pathRule"
node ../../node_modules/whales-story-shots/compare.js
3.1.0
11 months ago
3.0.1
2 years ago
3.0.0
2 years ago
2.1.1
2 years ago
2.1.0
4 years ago
2.0.2
4 years ago
2.0.1
4 years ago
2.0.0
4 years ago
2.0.0-2
5 years ago
2.0.0-1
5 years ago
1.5.10
5 years ago
1.5.9
5 years ago
1.5.8
5 years ago
1.5.7
5 years ago
1.5.6
5 years ago
1.5.5
5 years ago
1.5.4
5 years ago
1.5.3
5 years ago
1.5.2
5 years ago
1.5.1
5 years ago
1.5.0
5 years ago
1.4.2
5 years ago
1.4.1
6 years ago
1.4.0
6 years ago
1.3.2
6 years ago
1.3.1
6 years ago
1.3.0
6 years ago
1.2.0
6 years ago
1.1.1
6 years ago
1.0.3
6 years ago
1.0.2
6 years ago
1.0.1
6 years ago
1.0.0
6 years ago
0.0.16
6 years ago
0.0.15
6 years ago
0.0.14
6 years ago
0.0.13
6 years ago
0.0.12
6 years ago
0.0.11
6 years ago
0.0.10
6 years ago
0.0.9
6 years ago
0.0.8
6 years ago
0.0.7
6 years ago
0.0.6
6 years ago
0.0.5
6 years ago
0.0.4
6 years ago
0.0.3
6 years ago
0.0.2
6 years ago
0.0.1
6 years ago