From 19561dddb8aa527543bdcdec239aeaefc15aa33c Mon Sep 17 00:00:00 2001 From: Bradley Ayers Date: Wed, 2 May 2018 02:00:12 +1000 Subject: [PATCH] storybook__addon-storyshots: initial version (#25440) --- types/storybook__addon-storyshots/index.d.ts | 60 +++++++++++++++++++ .../storybook__addon-storyshots-tests.ts | 40 +++++++++++++ .../storybook__addon-storyshots/tsconfig.json | 31 ++++++++++ types/storybook__addon-storyshots/tslint.json | 1 + 4 files changed, 132 insertions(+) create mode 100644 types/storybook__addon-storyshots/index.d.ts create mode 100644 types/storybook__addon-storyshots/storybook__addon-storyshots-tests.ts create mode 100644 types/storybook__addon-storyshots/tsconfig.json create mode 100644 types/storybook__addon-storyshots/tslint.json diff --git a/types/storybook__addon-storyshots/index.d.ts b/types/storybook__addon-storyshots/index.d.ts new file mode 100644 index 0000000000..01df2538ae --- /dev/null +++ b/types/storybook__addon-storyshots/index.d.ts @@ -0,0 +1,60 @@ +// Type definitions for @storybook/addon-storyshots 3.4 +// Project: https://github.com/storybooks/storybook/tree/master/addons/storyshots +// Definitions by: Bradley Ayers +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.6 + +import * as React from 'react'; +import { StoryObject } from '@storybook/react'; +import { Page } from "puppeteer"; + +export type Test = (options: { + story: StoryObject; + context: StoryContext; + renderShallowTree: any; + renderTree: any; + snapshotFileName: string; +}) => void | undefined | Promise; + +export interface SnapshotOptions { + createNodeMock?: (element: any) => any; +} + +export interface StoryContext { + kind: string; + story: string; +} + +export interface ImageSnapshotOptions { + context: { + kind: any; + story: string + }; + url: string; +} + +export function imageSnapshot(options?: { + storybookUrl: string; + getMatchOptions: (options: ImageSnapshotOptions) => { failureThreshold: number, failureThresholdType: 'percent' }; + beforeScreenshot: (page: Page, options: ImageSnapshotOptions) => Promise; +}): Test; + +export function multiSnapshotWithOptions(options: SnapshotOptions): Test; + +export const shallowSnapshot: Test; + +export const snapshot: Test; + +export function snapshotWithOptions(options: SnapshotOptions): Test; + +export const renderOnly: Test; + +export function getSnapshotFileName(context: StoryContext): string; + +export default function initStoryshots(options: { + configPath?: string; + framework?: string; + integrityOptions?: {}; + suite?: string; + test?: Test; +}): void; diff --git a/types/storybook__addon-storyshots/storybook__addon-storyshots-tests.ts b/types/storybook__addon-storyshots/storybook__addon-storyshots-tests.ts new file mode 100644 index 0000000000..3a97a50e71 --- /dev/null +++ b/types/storybook__addon-storyshots/storybook__addon-storyshots-tests.ts @@ -0,0 +1,40 @@ +import initStoryshots, { multiSnapshotWithOptions, snapshotWithOptions, getSnapshotFileName, renderOnly } from "@storybook/addon-storyshots"; +import { shallow } from 'enzyme'; +import toJson from 'enzyme-to-json'; +import 'jest'; +import 'jest-specific-snapshot'; + +initStoryshots({ + integrityOptions: { cwd: '' }, + test: multiSnapshotWithOptions({}), +}); + +initStoryshots({ + test: ({ story, context }) => { + const snapshotFileName = getSnapshotFileName(context); + const storyElement = story.render() as JSX.Element; + const shallowTree = shallow(storyElement); + + if (snapshotFileName) { + expect(toJson(shallowTree)).toMatchSpecificSnapshot(snapshotFileName); + } + } +}); + +initStoryshots({ + configPath: "", + test: renderOnly +}); + +initStoryshots({ + framework: 'react', + configPath: '', + test: snapshotWithOptions({ + createNodeMock: (element) => { + if (element.type === 'div') { + return { scrollWidth: 123 }; + } + return null; + } + }) +}); diff --git a/types/storybook__addon-storyshots/tsconfig.json b/types/storybook__addon-storyshots/tsconfig.json new file mode 100644 index 0000000000..651fb4482b --- /dev/null +++ b/types/storybook__addon-storyshots/tsconfig.json @@ -0,0 +1,31 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "paths": { + "@storybook/addon-storyshots": [ + "storybook__addon-storyshots" + ], + "@storybook/react": [ + "storybook__react" + ] + }, + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "storybook__addon-storyshots-tests.ts" + ] +} diff --git a/types/storybook__addon-storyshots/tslint.json b/types/storybook__addon-storyshots/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/storybook__addon-storyshots/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }