Got things bootstrappign

addons/storyshots/storyshots-core/package.json

@@ -49,6 +49,7 @@
     "@storybook/client-api": "6.4.0-alpha.19",
     "@storybook/core": "6.4.0-alpha.19",
     "@storybook/core-common": "6.4.0-alpha.19",
+    "@storybook/csf": "0.0.2--canary.cc8c2b0.0",
     "@types/glob": "^7.1.3",
     "@types/jest": "^26.0.16",
     "@types/jest-specific-snapshot": "^0.5.3",

addons/storyshots/storyshots-core/src/api/index.ts

@@ -1,5 +1,6 @@
 import global from 'global';
 import { addons, mockChannel } from '@storybook/addons';
+import { Framework, StoryContextForLoaders } from '@storybook/csf';
 import ensureOptionsDefaults from './ensureOptionsDefaults';
 import snapshotsTests from './snapshotsTestsTemplate';
 import integrityTest from './integrityTestTemplate';
@@ -50,7 +51,8 @@ function testStorySnapshots(options: StoryshotsOptions = {}) {
   };
 
   const data = storybook.raw().reduce(
-    (acc, item) => {
+    // TODO
+    (acc, item: StoryContextForLoaders<Framework>) => {
       if (storyNameRegex && !item.name.match(storyNameRegex)) {
         return acc;
       }
@@ -59,6 +61,8 @@ function testStorySnapshots(options: StoryshotsOptions = {}) {
         return acc;
       }
 
+      // FIXME -- need raw() to return story s
+      // @ts-ignore
       const { kind, storyFn: render, parameters } = item;
       const existing = acc.find((i: any) => i.kind === kind);
       const { fileName } = item.parameters;

addons/storyshots/storyshots-core/src/frameworks/Loader.ts

@@ -1,3 +1,4 @@
+import { Framework } from '@storybook/csf';
 import { ClientStoryApi, Loadable } from '@storybook/addons';
 import { ClientApi as ClientApiThing } from '@storybook/client-api';
 import { StoryshotsOptions } from '../api/StoryshotsOptions';
@@ -5,17 +6,18 @@ import { SupportedFramework } from './SupportedFramework';
 
 export type RenderTree = (story: any, context?: any, options?: any) => any;
 
-export interface ClientApi extends ClientStoryApi<unknown> {
+export interface ClientApi<TFramework extends Framework> extends ClientStoryApi<TFramework> {
   configure(loader: Loadable, module: NodeModule | false, showDeprecationWarning?: boolean): void;
   forceReRender(): void;
-  clearDecorators: ClientApiThing['clearDecorators'];
-  getStorybook: ClientApiThing['getStorybook'];
-  setAddon: ClientApiThing['setAddon'];
-  raw: ClientApiThing['raw'];
-  addArgsEnhancer: ClientApiThing['addArgsEnhancer'];
-  addArgTypesEnhancer: ClientApiThing['addArgTypesEnhancer'];
+  clearDecorators: ClientApiThing<TFramework>['clearDecorators'];
+  getStorybook: ClientApiThing<TFramework>['getStorybook'];
+  setAddon: ClientApiThing<TFramework>['setAddon'];
+  raw: ClientApiThing<TFramework>['raw'];
+  addArgsEnhancer: ClientApiThing<TFramework>['addArgsEnhancer'];
+  addArgTypesEnhancer: ClientApiThing<TFramework>['addArgTypesEnhancer'];
 }
 
+// TODO -- this is untyped for now, we could import each framework's Framework type
 export interface Loader {
   load: (
     options: StoryshotsOptions
@@ -23,7 +25,7 @@ export interface Loader {
     framework: SupportedFramework;
     renderTree: RenderTree;
     renderShallowTree: any;
-    storybook: ClientApi;
+    storybook: ClientApi<Framework>;
   };
   test: (options: StoryshotsOptions) => boolean;
 }

addons/storyshots/storyshots-core/src/frameworks/configure.ts

@@ -3,7 +3,7 @@ import path from 'path';
 import { toRequireContext } from '@storybook/core-common';
 import registerRequireContextHook from 'babel-plugin-require-context-hook/register';
 import global from 'global';
-import { ArgsEnhancer, ArgTypesEnhancer, DecoratorFunction } from '@storybook/client-api';
+import { Framework, ArgsEnhancer, ArgTypesEnhancer, DecoratorFunction } from '@storybook/csf';
 
 import { ClientApi } from './Loader';
 import { StoryshotsOptions } from '../api/StoryshotsOptions';
@@ -69,9 +69,9 @@ function getConfigPathParts(input: string): Output {
   return { preview: configDir };
 }
 
-function configure(
+function configure<TFramework extends Framework>(
   options: {
-    storybook: ClientApi;
+    storybook: ClientApi<TFramework>;
   } & StoryshotsOptions
 ): void {
   const { configPath = '.storybook', config, storybook } = options;
@@ -95,16 +95,20 @@ function configure(
     } = jest.requireActual(preview);
 
     if (decorators) {
-      decorators.forEach((decorator: DecoratorFunction) => storybook.addDecorator(decorator));
+      decorators.forEach((decorator: DecoratorFunction<TFramework>) =>
+        storybook.addDecorator(decorator)
+      );
     }
     if (parameters || globals || globalTypes) {
       storybook.addParameters({ ...parameters, globals, globalTypes });
     }
     if (argsEnhancers) {
-      argsEnhancers.forEach((enhancer: ArgsEnhancer) => storybook.addArgsEnhancer(enhancer as any));
+      argsEnhancers.forEach((enhancer: ArgsEnhancer<TFramework>) =>
+        storybook.addArgsEnhancer(enhancer as any)
+      );
     }
     if (argTypesEnhancers) {
-      argTypesEnhancers.forEach((enhancer: ArgTypesEnhancer) =>
+      argTypesEnhancers.forEach((enhancer: ArgTypesEnhancer<TFramework>) =>
         storybook.addArgTypesEnhancer(enhancer as any)
       );
     }

lib/addons/src/types.ts

@@ -5,6 +5,7 @@ import {
   LoaderFunction,
   Parameters,
   StoryContext,
+  StoryContextForEnhancers,
   StoryFn,
   StoryId,
   StoryKind,
@@ -110,7 +111,8 @@ export interface ClientStoryApi<TFramework extends Framework> {
   addDecorator(decorator: DecoratorFunction<TFramework>): StoryApi<TFramework>;
   addParameters(parameter: Parameters): StoryApi<TFramework>;
   getStorybook(): IStorybookSection[];
-  raw: () => any;
+  // TODO -- should be Story from store?
+  raw: () => StoryContextForEnhancers<TFramework>[];
 }
 
 type LoadFn = () => any;

lib/client-api/src/client_api.ts

@@ -20,7 +20,6 @@ import {
   Path,
   StoriesList,
   combineParameters,
-  ModuleImportFn,
 } from '@storybook/store';
 
 import { ClientApiAddons, StoryApi } from '@storybook/addons';
@@ -310,5 +309,5 @@ Read more here: https://github.com/storybookjs/storybook/blob/master/MIGRATION.m
   // TODO
   getStorybook: () => [];
 
-  raw: () => {};
+  raw: () => [];
 }