UNPKG

6.33 kBTypeScriptView Raw
1/// <reference types="jest" />
2
3import { PixelmatchOptions } from "pixelmatch";
4import { Options as SSIMOptions } from "ssim.js";
5
6export interface MatchImageSnapshotOptions {
7 /**
8 * If set to true, the build will not fail when the screenshots to compare have different sizes.
9 * @default false
10 */
11 allowSizeMismatch?: boolean | undefined;
12 /**
13 * Sets the max number of bytes for stdout/stderr when running diff-snapshot in a child process.
14 * @default 10 * 1024 * 1024 (10,485,760)
15 */
16 maxChildProcessBufferSizeInBytes?: number | undefined;
17 /**
18 * Custom config passed to 'pixelmatch' or 'ssim'
19 */
20 customDiffConfig?: PixelmatchOptions | Partial<SSIMOptions> | undefined;
21 /**
22 * The method by which images are compared.
23 * `pixelmatch` does a pixel by pixel comparison, whereas `ssim` does a structural similarity comparison.
24 * @default 'pixelmatch'
25 */
26 comparisonMethod?: "pixelmatch" | "ssim" | undefined;
27 /**
28 * Custom snapshots directory.
29 * Absolute path of a directory to keep the snapshot in.
30 */
31 customSnapshotsDir?: string | undefined;
32 /**
33 * A custom absolute path of a directory to keep this diff in
34 */
35 customDiffDir?: string | undefined;
36 /**
37 * Store the received images separately from the composed diff images on failure.
38 * This can be useful when updating baseline images from CI.
39 * @default false
40 */
41 storeReceivedOnFailure?: boolean | undefined;
42 /**
43 * A custom absolute path of a directory to keep this received image in.
44 */
45 customReceivedDir?: string | undefined;
46 /**
47 * A custom postfix which is added to the snapshot name of the received image
48 * @default '-received'
49 */
50 customReceivedPostfix?: string | undefined;
51 /**
52 * A custom name to give this snapshot. If not provided, one is computed automatically. When a function is provided
53 * it is called with an object containing testPath, currentTestName, counter and defaultIdentifier as its first
54 * argument. The function must return an identifier to use for the snapshot.
55 */
56 customSnapshotIdentifier?:
57 | ((parameters: {
58 testPath: string;
59 currentTestName: string;
60 counter: number;
61 defaultIdentifier: string;
62 }) => string)
63 | string
64 | undefined;
65 /**
66 * Changes diff image layout direction.
67 * @default 'horizontal'
68 */
69 diffDirection?: "horizontal" | "vertical" | undefined;
70 /**
71 * Either only include the difference between the baseline and the received image in the diff image, or include
72 * the 3 images (following the direction set by `diffDirection`).
73 * @default false
74 */
75 onlyDiff?: boolean | undefined;
76 /**
77 * This needs to be set to a existing file, like `require.resolve('./runtimeHooksPath.cjs')`.
78 * This file can expose a few hooks:
79 * - `onBeforeWriteToDisc`: before saving any image to the disc, this function will be called (can be used to write EXIF data to images for instance)
80 * - `onBeforeWriteToDisc: (arguments: { buffer: Buffer; destination: string; testPath: string; currentTestName: string }) => Buffer`
81 */
82 runtimeHooksPath?: string | undefined;
83 /**
84 * Will output base64 string of a diff image to console in case of failed tests (in addition to creating a diff image).
85 * This string can be copy-pasted to a browser address string to preview the diff for a failed test.
86 * @default false
87 */
88 dumpDiffToConsole?: boolean | undefined;
89 /**
90 * Will output the image to the terminal using iTerm's Inline Images Protocol.
91 * If the term is not compatible, it does the same thing as `dumpDiffToConsole`.
92 * @default false
93 */
94 dumpInlineDiffToConsole?: boolean | undefined;
95 /**
96 * Removes coloring from the console output, useful if storing the results to a file.
97 * @default false.
98 */
99 noColors?: boolean | undefined;
100 /**
101 * Sets the threshold that would trigger a test failure based on the failureThresholdType selected. This is different
102 * to the customDiffConfig.threshold above - the customDiffConfig.threshold is the per pixel failure threshold, whereas
103 * this is the failure threshold for the entire comparison.
104 * @default 0.
105 */
106 failureThreshold?: number | undefined;
107 /**
108 * Sets the type of threshold that would trigger a failure.
109 * @default 'pixel'.
110 */
111 failureThresholdType?: "pixel" | "percent" | undefined;
112 /**
113 * Updates a snapshot even if it passed the threshold against the existing one.
114 * @default false.
115 */
116 updatePassedSnapshot?: boolean | undefined;
117 /**
118 * Applies Gaussian Blur on compared images, accepts radius in pixels as value. Useful when you have noise after
119 * scaling images per different resolutions on your target website, usually setting its value to 1-2 should be
120 * enough to solve that problem.
121 * @default 0.
122 */
123 blur?: number | undefined;
124 /**
125 * Runs the diff in process without spawning a child process.
126 * @default false.
127 */
128 runInProcess?: boolean | undefined;
129}
130
131/**
132 * Function to be passed to jest's expect.extend.
133 * Example:
134 * import { toMatchImageSnapshot } from 'jest-image-snapshot';
135 * expect.extend({ toMatchImageSnapshot });
136 */
137export function toMatchImageSnapshot(options?: MatchImageSnapshotOptions): { message(): string; pass: boolean };
138
139/**
140 * Configurable function that can be passed to jest's expect.extend.
141 * Example:
142 * import { configureToMatchImageSnapshot } from 'jest-image-snapshot';
143 * const toMatchImageSnapshot = configureToMatchImageSnapshot({ noColors: true });
144 * expect.extend({ toMatchImageSnapshot });
145 */
146export function configureToMatchImageSnapshot(
147 options: MatchImageSnapshotOptions,
148): () => { message(): string; pass: boolean };
149
150/**
151 * Mutates original state with new state
152 */
153export function updateSnapshotState<TObject, TPartial>(
154 originalSnapshotState: TObject,
155 partialSnapshotState: TPartial,
156): TObject & TPartial;
157
158declare global {
159 namespace jest {
160 interface Matchers<R, T> {
161 toMatchImageSnapshot(options?: MatchImageSnapshotOptions): R;
162 }
163 }
164}