diff --git a/lib/builder-webpack4/src/preview/virtualModuleModernEntry.js.handlebars b/lib/builder-webpack4/src/preview/virtualModuleModernEntry.js.handlebars index a0f9c4779f6..8bc5e77d568 100644 --- a/lib/builder-webpack4/src/preview/virtualModuleModernEntry.js.handlebars +++ b/lib/builder-webpack4/src/preview/virtualModuleModernEntry.js.handlebars @@ -11,7 +11,7 @@ const getProjectAnnotations = () => {{/each}} ]); -const fetchStoriesList = async () => { +const fetchStoryIndex = async () => { const result = await fetch('./stories.json'); return result.json(); } @@ -19,7 +19,7 @@ const fetchStoriesList = async () => { const channel = createChannel({ page: 'preview' }); addons.setChannel(channel); -const preview = new PreviewWeb({ importFn, getProjectAnnotations, fetchStoriesList }); +const preview = new PreviewWeb({ importFn, getProjectAnnotations, fetchStoryIndex }); window.__STORYBOOK_PREVIEW__ = preview; window.__STORYBOOK_STORY_STORE__ = preview.storyStore; diff --git a/lib/builder-webpack5/src/preview/virtualModuleModernEntry.js.handlebars b/lib/builder-webpack5/src/preview/virtualModuleModernEntry.js.handlebars index 2688f38cc2c..12823e4c07a 100644 --- a/lib/builder-webpack5/src/preview/virtualModuleModernEntry.js.handlebars +++ b/lib/builder-webpack5/src/preview/virtualModuleModernEntry.js.handlebars @@ -11,14 +11,14 @@ const getProjectAnnotations = () => {{/each}} ]); -const fetchStoriesList = async () => { +const fetchStoryIndex = async () => { const result = await fetch('./stories.json'); return result.json(); } const channel = createChannel({ page: 'preview' }); addons.setChannel(channel); -const preview = new PreviewWeb({ importFn, getProjectAnnotations, fetchStoriesList }); +const preview = new PreviewWeb({ importFn, getProjectAnnotations, fetchStoryIndex }); window.__STORYBOOK_PREVIEW__ = preview; window.__STORYBOOK_STORY_STORE__ = preview.storyStore; diff --git a/lib/client-api/src/ClientApi.ts b/lib/client-api/src/ClientApi.ts index 4a7b6aa286e..e67802e2b2a 100644 --- a/lib/client-api/src/ClientApi.ts +++ b/lib/client-api/src/ClientApi.ts @@ -486,10 +486,10 @@ Read more here: https://github.com/storybookjs/storybook/blob/master/MIGRATION.m } getStorybook = (): GetStorybookKind[] => { - const storiesList = this.getStoriesList(); + const storyIndex = this.getStoriesList(); const kinds: Record> = {}; - Object.entries(storiesList.stories).forEach(([storyId, { title, name, importPath }]) => { + Object.entries(storyIndex.stories).forEach(([storyId, { title, name, importPath }]) => { if (!kinds[title]) { kinds[title] = { kind: title, fileName: importPath, stories: [] }; } diff --git a/lib/core-client/src/preview/start.ts b/lib/core-client/src/preview/start.ts index 71e382cb889..4ab893b1043 100644 --- a/lib/core-client/src/preview/start.ts +++ b/lib/core-client/src/preview/start.ts @@ -69,7 +69,7 @@ export function start( preview = new PreviewWeb({ importFn: (path: Path) => clientApi.importFn(path), getProjectAnnotations, - fetchStoriesList: () => clientApi.getStoriesList(), + fetchStoryIndex: () => clientApi.getStoriesList(), }); if (globalWindow) { // eslint-disable-next-line no-underscore-dangle diff --git a/lib/preview-web/src/PreviewWeb.integration.test.ts b/lib/preview-web/src/PreviewWeb.integration.test.ts index 4b18d6e9fb8..6fd4070e48e 100644 --- a/lib/preview-web/src/PreviewWeb.integration.test.ts +++ b/lib/preview-web/src/PreviewWeb.integration.test.ts @@ -9,7 +9,7 @@ import { importFn, projectAnnotations, getProjectAnnotations, - fetchStoriesList, + fetchStoryIndex, emitter, mockChannel, waitForRender, @@ -61,7 +61,7 @@ describe('PreviewWeb', () => { storyFn() ); document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -71,7 +71,7 @@ describe('PreviewWeb', () => { it('renders docs mode through docs page', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); const docsRoot = window.document.createElement('div'); // @ts-ignore @@ -106,7 +106,7 @@ describe('PreviewWeb', () => { it('renders story mode through the updated stack', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); diff --git a/lib/preview-web/src/PreviewWeb.mockdata.ts b/lib/preview-web/src/PreviewWeb.mockdata.ts index 0a0ba09717f..a4d1d5259ab 100644 --- a/lib/preview-web/src/PreviewWeb.mockdata.ts +++ b/lib/preview-web/src/PreviewWeb.mockdata.ts @@ -33,7 +33,7 @@ export const projectAnnotations = { }; export const getProjectAnnotations = () => projectAnnotations; -export const storiesList: StoriesList = { +export const storyIndex: StoriesList = { v: 3, stories: { 'component-one--a': { @@ -53,7 +53,7 @@ export const storiesList: StoriesList = { }, }, }; -export const fetchStoriesList = async () => storiesList; +export const fetchStoryIndex = async () => storyIndex; export const emitter = new EventEmitter(); export const mockChannel = { diff --git a/lib/preview-web/src/PreviewWeb.test.ts b/lib/preview-web/src/PreviewWeb.test.ts index ec717d837ba..87f4cc501c6 100644 --- a/lib/preview-web/src/PreviewWeb.test.ts +++ b/lib/preview-web/src/PreviewWeb.test.ts @@ -12,7 +12,7 @@ import { importFn, projectAnnotations, getProjectAnnotations, - fetchStoriesList, + fetchStoryIndex, emitter, mockChannel, waitForEvents, @@ -75,7 +75,7 @@ describe('PreviewWeb', () => { throw err; }, importFn, - fetchStoriesList, + fetchStoryIndex, }); expect(preview.view.showErrorDisplay).toHaveBeenCalled(); @@ -87,14 +87,14 @@ describe('PreviewWeb', () => { it('sets globals from the URL', async () => { document.location.search = '?id=*&globals=a:c'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.storyStore.globals.get()).toEqual({ a: 'c' }); }); it('emits the SET_GLOBALS event', async () => { - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.SET_GLOBALS, { globals: { a: 'b' }, @@ -106,7 +106,7 @@ describe('PreviewWeb', () => { await new PreviewWeb({ getProjectAnnotations: () => ({}), importFn, - fetchStoriesList, + fetchStoryIndex, }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.SET_GLOBALS, { @@ -118,7 +118,7 @@ describe('PreviewWeb', () => { it('emits the SET_GLOBALS event from the URL', async () => { document.location.search = '?id=*&globals=a:c'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.SET_GLOBALS, { globals: { a: 'c' }, @@ -129,7 +129,7 @@ describe('PreviewWeb', () => { it('sets args from the URL', async () => { document.location.search = '?id=component-one--a&args=foo:url'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.storyStore.args.get('component-one--a')).toEqual({ @@ -142,7 +142,7 @@ describe('PreviewWeb', () => { it('selects the story specified in the URL', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.urlStore.selection).toEqual({ @@ -159,7 +159,7 @@ describe('PreviewWeb', () => { it('emits the STORY_SPECIFIED event', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.STORY_SPECIFIED, { storyId: 'component-one--a', @@ -170,7 +170,7 @@ describe('PreviewWeb', () => { it('emits the CURRENT_STORY_WAS_SET event', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.CURRENT_STORY_WAS_SET, { storyId: 'component-one--a', @@ -182,7 +182,7 @@ describe('PreviewWeb', () => { it('renders missing', async () => { document.location.search = '?id=random'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.showNoPreview).toHaveBeenCalled(); @@ -193,7 +193,7 @@ describe('PreviewWeb', () => { it.skip('tries again with a specifier if CSF file changes', async () => { document.location.search = '?id=component-one--d'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.showNoPreview).toHaveBeenCalled(); @@ -220,7 +220,7 @@ describe('PreviewWeb', () => { it.skip('DOES NOT try again if CSF file changes if selection changed', async () => { document.location.search = '?id=component-one--d'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.showNoPreview).toHaveBeenCalled(); @@ -250,7 +250,7 @@ describe('PreviewWeb', () => { it.skip('tries again with a specifier if stories list changes', async () => { document.location.search = '?id=component-three--d'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.showNoPreview).toHaveBeenCalled(); @@ -265,7 +265,7 @@ describe('PreviewWeb', () => { }); it('renders missing if no selection', async () => { - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.showNoPreview).toHaveBeenCalled(); @@ -276,7 +276,7 @@ describe('PreviewWeb', () => { it('calls view.prepareForStory', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.prepareForStory).toHaveBeenCalledWith( @@ -288,7 +288,7 @@ describe('PreviewWeb', () => { it('emits STORY_PREPARED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); expect(mockChannel.emit).toHaveBeenCalledWith(Events.STORY_PREPARED, { id: 'component-one--a', @@ -301,7 +301,7 @@ describe('PreviewWeb', () => { it('applies loaders with story context', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -318,7 +318,7 @@ describe('PreviewWeb', () => { it('passes loaded context to renderToDOM', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -346,7 +346,7 @@ describe('PreviewWeb', () => { }); document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -362,7 +362,7 @@ describe('PreviewWeb', () => { }); document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -378,7 +378,7 @@ describe('PreviewWeb', () => { }); document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -394,7 +394,7 @@ describe('PreviewWeb', () => { ); document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -413,7 +413,7 @@ describe('PreviewWeb', () => { ); document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -424,7 +424,7 @@ describe('PreviewWeb', () => { it('executes runPlayFunction', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -433,7 +433,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -445,7 +445,7 @@ describe('PreviewWeb', () => { it('calls view.prepareForDocs', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); expect(preview.view.prepareForDocs).toHaveBeenCalled(); @@ -454,7 +454,7 @@ describe('PreviewWeb', () => { it('render the docs container with the correct context', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -477,7 +477,7 @@ describe('PreviewWeb', () => { it('emits DOCS_RENDERED', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); @@ -489,7 +489,7 @@ describe('PreviewWeb', () => { describe('onUpdateGlobals', () => { it('emits GLOBALS_UPDATED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.UPDATE_GLOBALS, { globals: { foo: 'bar' } }); @@ -501,7 +501,7 @@ describe('PreviewWeb', () => { it('sets new globals on the store', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); emitter.emit(Events.UPDATE_GLOBALS, { globals: { foo: 'bar' } }); @@ -511,7 +511,7 @@ describe('PreviewWeb', () => { it('passes new globals in context to renderToDOM', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -533,7 +533,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -547,7 +547,7 @@ describe('PreviewWeb', () => { describe('onUpdateArgs', () => { it('emits STORY_ARGS_UPDATED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', @@ -562,7 +562,7 @@ describe('PreviewWeb', () => { it('sets new args on the store', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); emitter.emit(Events.UPDATE_STORY_ARGS, { @@ -578,7 +578,7 @@ describe('PreviewWeb', () => { it('passes new args in context to renderToDOM', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -604,7 +604,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -623,7 +623,7 @@ describe('PreviewWeb', () => { document.location.search = '?id=component-one--a'; componentOneExports.default.loaders[0].mockImplementationOnce(async () => gate); - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', @@ -653,7 +653,7 @@ describe('PreviewWeb', () => { document.location.search = '?id=component-one--a'; projectAnnotations.renderToDOM.mockImplementationOnce(async () => gate); - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', @@ -690,7 +690,7 @@ describe('PreviewWeb', () => { }); document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await renderToDOMCalled; // Story gets rendered with original args @@ -735,7 +735,7 @@ describe('PreviewWeb', () => { describe('onResetArgs', () => { it('emits STORY_ARGS_UPDATED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); mockChannel.emit.mockClear(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', @@ -763,7 +763,7 @@ describe('PreviewWeb', () => { it('resets a single arg', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); mockChannel.emit.mockClear(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', @@ -797,7 +797,7 @@ describe('PreviewWeb', () => { it('resets all args', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.UPDATE_STORY_ARGS, { storyId: 'component-one--a', updatedArgs: { foo: 'new', new: 'value' }, @@ -830,7 +830,7 @@ describe('PreviewWeb', () => { describe('on FORCE_RE_RENDER', () => { it('rerenders the story with the same args', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -849,7 +849,7 @@ describe('PreviewWeb', () => { describe('onSetCurrentStory', () => { it('updates URL', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--b', @@ -865,7 +865,7 @@ describe('PreviewWeb', () => { it('emits CURRENT_STORY_WAS_SET', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--b', @@ -880,7 +880,7 @@ describe('PreviewWeb', () => { it('renders missing if the story specified does not exist', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); emitter.emit(Events.SET_CURRENT_STORY, { @@ -896,7 +896,7 @@ describe('PreviewWeb', () => { describe('if the selection is unchanged', () => { it('emits STORY_UNCHANGED', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); emitter.emit(Events.SET_CURRENT_STORY, { @@ -910,7 +910,7 @@ describe('PreviewWeb', () => { it('does NOT call renderToDOM', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); projectAnnotations.renderToDOM.mockClear(); @@ -929,7 +929,7 @@ describe('PreviewWeb', () => { describe('when changing story in story viewMode', () => { it('updates URL', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--b', @@ -945,7 +945,7 @@ describe('PreviewWeb', () => { it('emits STORY_CHANGED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -960,7 +960,7 @@ describe('PreviewWeb', () => { it('emits STORY_PREPARED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -981,7 +981,7 @@ describe('PreviewWeb', () => { it('applies loaders with story context', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1004,7 +1004,7 @@ describe('PreviewWeb', () => { it('passes loaded context to renderToDOM', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1033,7 +1033,7 @@ describe('PreviewWeb', () => { it('renders exception if renderToDOM throws', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1055,7 +1055,7 @@ describe('PreviewWeb', () => { it('renders error if the story calls showError', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1080,7 +1080,7 @@ describe('PreviewWeb', () => { it('renders exception if the story calls showException', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1102,7 +1102,7 @@ describe('PreviewWeb', () => { it('executes runPlayFunction', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1117,7 +1117,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1132,7 +1132,7 @@ describe('PreviewWeb', () => { it('retains any arg changes', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1173,7 +1173,7 @@ describe('PreviewWeb', () => { componentOneExports.default.loaders[0].mockImplementationOnce(async () => gate); document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--b', @@ -1204,7 +1204,7 @@ describe('PreviewWeb', () => { document.location.search = '?id=component-one--a'; projectAnnotations.renderToDOM.mockImplementationOnce(async () => gate); - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--b', @@ -1237,7 +1237,7 @@ describe('PreviewWeb', () => { }); document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await renderToDOMCalled; // Story gets rendered with original args @@ -1286,7 +1286,7 @@ describe('PreviewWeb', () => { describe('when changing from story viewMode to docs', () => { it('updates URL', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--a', @@ -1302,7 +1302,7 @@ describe('PreviewWeb', () => { it('emits STORY_CHANGED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1317,7 +1317,7 @@ describe('PreviewWeb', () => { it('calls view.prepareForDocs', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1333,7 +1333,7 @@ describe('PreviewWeb', () => { it('render the docs container with the correct context', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1361,7 +1361,7 @@ describe('PreviewWeb', () => { it('emits DOCS_RENDERED', async () => { document.location.search = '?id=component-one--a'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1378,7 +1378,7 @@ describe('PreviewWeb', () => { describe('when changing from docs viewMode to story', () => { it('updates URL', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); emitter.emit(Events.SET_CURRENT_STORY, { storyId: 'component-one--a', @@ -1394,7 +1394,7 @@ describe('PreviewWeb', () => { it('unmounts docs', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1410,7 +1410,7 @@ describe('PreviewWeb', () => { // NOTE: I am not sure this entirely makes sense but this is the behaviour from 6.3 it('emits STORY_CHANGED', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1425,7 +1425,7 @@ describe('PreviewWeb', () => { it('calls view.prepareForStory', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1445,7 +1445,7 @@ describe('PreviewWeb', () => { it('emits STORY_PREPARED', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1466,7 +1466,7 @@ describe('PreviewWeb', () => { it('applies loaders with story context', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1489,7 +1489,7 @@ describe('PreviewWeb', () => { it('passes loaded context to renderToDOM', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1518,7 +1518,7 @@ describe('PreviewWeb', () => { it('renders exception if renderToDOM throws', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1545,7 +1545,7 @@ describe('PreviewWeb', () => { ); document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1570,7 +1570,7 @@ describe('PreviewWeb', () => { ); document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1587,7 +1587,7 @@ describe('PreviewWeb', () => { it('executes runPlayFunction', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1602,7 +1602,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }).initialize(); + await new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }).initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1630,7 +1630,7 @@ describe('PreviewWeb', () => { it('does not emit STORY_UNCHANGED', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1646,7 +1646,7 @@ describe('PreviewWeb', () => { it('does not emit STORY_CHANGED', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1659,7 +1659,7 @@ describe('PreviewWeb', () => { it('emits STORY_PREPARED with new annotations', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); mockChannel.emit.mockClear(); @@ -1678,7 +1678,7 @@ describe('PreviewWeb', () => { it('applies loaders with story context', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1700,7 +1700,7 @@ describe('PreviewWeb', () => { it('passes loaded context to renderToDOM', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1728,7 +1728,7 @@ describe('PreviewWeb', () => { it('retains the same delta to the args', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1757,7 +1757,7 @@ describe('PreviewWeb', () => { it('renders exception if renderToDOM throws', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1776,7 +1776,7 @@ describe('PreviewWeb', () => { it('renders error if the story calls showError', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1798,7 +1798,7 @@ describe('PreviewWeb', () => { it('renders exception if the story calls showException', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1817,7 +1817,7 @@ describe('PreviewWeb', () => { it('executes runPlayFunction', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1831,7 +1831,7 @@ describe('PreviewWeb', () => { it('emits STORY_RENDERED', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1853,7 +1853,7 @@ describe('PreviewWeb', () => { it('emits STORY_UNCHANGED', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1867,7 +1867,7 @@ describe('PreviewWeb', () => { it('does not re-render the story', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1894,7 +1894,7 @@ describe('PreviewWeb', () => { it('renders story missing', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1908,7 +1908,7 @@ describe('PreviewWeb', () => { it('does not re-render the story', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1929,7 +1929,7 @@ describe('PreviewWeb', () => { describe('onGetProjectAnnotationsChanged', () => { it('shows an error the new value throws', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1957,7 +1957,7 @@ describe('PreviewWeb', () => { it('updates globals to their new values', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1970,7 +1970,7 @@ describe('PreviewWeb', () => { it('updates args to their new values', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -1987,7 +1987,7 @@ describe('PreviewWeb', () => { it('rerenders the current story with new global meta-generated context', async () => { document.location.search = '?id=component-one--a'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); await waitForRender(); @@ -2011,7 +2011,7 @@ describe('PreviewWeb', () => { describe('onKeydown', () => { it('emits PREVIEW_KEYDOWN for regular elements', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); preview.onKeydown({ @@ -2026,7 +2026,7 @@ describe('PreviewWeb', () => { it('does not emit PREVIEW_KEYDOWN for input elements', async () => { document.location.search = '?id=component-one--a&viewMode=docs'; - const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoriesList }); + const preview = new PreviewWeb({ getProjectAnnotations, importFn, fetchStoryIndex }); await preview.initialize(); preview.onKeydown({ diff --git a/lib/preview-web/src/PreviewWeb.tsx b/lib/preview-web/src/PreviewWeb.tsx index 2f3fc504f89..3df3b65135a 100644 --- a/lib/preview-web/src/PreviewWeb.tsx +++ b/lib/preview-web/src/PreviewWeb.tsx @@ -21,7 +21,6 @@ import { CSFFile, StoryStore, StorySpecifier, - StoriesList, } from '@storybook/store'; import { WebProjectAnnotations, DocsContextProps } from './types'; @@ -59,11 +58,11 @@ export class PreviewWeb { constructor({ getProjectAnnotations, importFn, - fetchStoriesList, + fetchStoryIndex, }: { getProjectAnnotations: () => WebProjectAnnotations; importFn: ModuleImportFn; - fetchStoriesList: ConstructorParameters[0]['fetchStoriesList']; + fetchStoryIndex: ConstructorParameters[0]['fetchStoryIndex']; }) { this.channel = addons.getChannel(); this.view = new WebView(); @@ -74,7 +73,7 @@ export class PreviewWeb { } this.urlStore = new UrlStore(); - this.storyStore = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + this.storyStore = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); } getProjectAnnotationsOrRenderError( @@ -141,7 +140,7 @@ export class PreviewWeb { } const { storySpecifier, viewMode, args } = this.urlStore.selectionSpecifier; - const storyId = this.storyStore.storiesList.storyIdFromSpecifier(storySpecifier); + const storyId = this.storyStore.storyIndex.storyIdFromSpecifier(storySpecifier); if (!storyId) { this.renderMissingStory(storySpecifier); diff --git a/lib/store/src/StoriesListStore.ts b/lib/store/src/StoriesListStore.ts deleted file mode 100644 index 5f4b93389ec..00000000000 --- a/lib/store/src/StoriesListStore.ts +++ /dev/null @@ -1,75 +0,0 @@ -import { Channel } from '@storybook/addons'; -import { StoryId } from '@storybook/csf'; - -import { StorySpecifier, Path, StoriesList, StoriesListStory } from './types'; - -export class StoriesListStore { - fetchStoriesList: () => Promise | StoriesList; - - channel: Channel; - - storiesList: StoriesList; - - constructor({ fetchStoriesList }: { fetchStoriesList: StoriesListStore['fetchStoriesList'] }) { - this.fetchStoriesList = fetchStoriesList; - } - - async initialize() { - return this.cacheStoriesList(); - } - - initializeSync() { - return this.cacheStoriesListSync(); - } - - async onStoriesChanged() { - this.storiesList = await this.fetchStoriesList(); - } - - async cacheStoriesList() { - this.storiesList = await this.fetchStoriesList(); - } - - async cacheStoriesListSync() { - this.storiesList = this.fetchStoriesList() as StoriesList; - if (!this.storiesList.v) { - throw new Error( - `fetchStoriesList() didn't return a stories list, did you pass an async version then call initializeSync()?` - ); - } - } - - storyIdFromSpecifier(specifier: StorySpecifier) { - const storyIds = Object.keys(this.storiesList.stories); - if (specifier === '*') { - // '*' means select the first story. If there is none, we have no selection. - return storyIds[0]; - } - - if (typeof specifier === 'string') { - // Find the story with the exact id that matches the specifier (see #11571) - if (storyIds.indexOf(specifier) >= 0) { - return specifier; - } - // Fallback to the first story that starts with the specifier - return storyIds.find((storyId) => storyId.startsWith(specifier)); - } - - // Try and find a story matching the name/kind, setting no selection if they don't exist. - const { name, title } = specifier; - const match = Object.entries(this.storiesList.stories).find( - ([id, story]) => story.name === name && story.title === title - ); - - return match && match[0]; - } - - storyIdToMetadata(storyId: StoryId): StoriesListStory { - const storyMetadata = this.storiesList.stories[storyId]; - if (!storyMetadata) { - throw new Error(`Didn't find '${storyId}' in story metadata (\`stories.json\`)`); - } - - return storyMetadata; - } -} diff --git a/lib/store/src/StoriesListStore.test.ts b/lib/store/src/StoryIndexStore.test.ts similarity index 72% rename from lib/store/src/StoriesListStore.test.ts rename to lib/store/src/StoryIndexStore.test.ts index 584e993037a..165c6af3734 100644 --- a/lib/store/src/StoriesListStore.test.ts +++ b/lib/store/src/StoryIndexStore.test.ts @@ -1,9 +1,9 @@ -import { StoriesListStore } from './StoriesListStore'; -import { StoriesList } from './types'; +import { StoryIndexStore } from './StoryIndexStore'; +import { StoryIndex } from './types'; jest.mock('@storybook/channel-websocket', () => () => ({ on: jest.fn() })); -const stories: StoriesList = { +const stories: StoryIndex = { v: 3, stories: { 'component-one--a': { @@ -23,9 +23,9 @@ const stories: StoriesList = { }, }, }; -const fetchStoriesList = async () => stories; +const fetchStoryIndex = async () => stories; -const makeFetchStoriesList = (titlesAndNames) => { +const makeFetchStoryIndex = (titlesAndNames) => { return async () => ({ v: 3, stories: Object.fromEntries( @@ -41,19 +41,19 @@ const makeFetchStoriesList = (titlesAndNames) => { }); }; -describe('StoriesListStore', () => { +describe('StoryIndexStore', () => { describe('storyIdFromSpecifier', () => { describe('if you use *', () => { it('selects the first story in the store', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); expect(store.storyIdFromSpecifier('*')).toEqual('component-one--a'); }); it('selects nothing if there are no stories', async () => { - const store = new StoriesListStore({ - fetchStoriesList: makeFetchStoriesList([]), + const store = new StoryIndexStore({ + fetchStoryIndex: makeFetchStoryIndex([]), }); await store.initialize(); @@ -63,15 +63,15 @@ describe('StoriesListStore', () => { describe('if you use a component or group id', () => { it('selects the first story for the component', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); expect(store.storyIdFromSpecifier('component-two')).toEqual('component-two--c'); }); it('selects the first story for the group', async () => { - const store = new StoriesListStore({ - fetchStoriesList: makeFetchStoriesList([ + const store = new StoryIndexStore({ + fetchStoryIndex: makeFetchStoryIndex([ ['g1/a', '1'], ['g2/a', '1'], ['g2/b', '1'], @@ -84,8 +84,8 @@ describe('StoriesListStore', () => { // Making sure the fix #11571 doesn't break this it('selects the first story if there are two stories in the group of different lengths', async () => { - const store = new StoriesListStore({ - fetchStoriesList: makeFetchStoriesList([ + const store = new StoryIndexStore({ + fetchStoryIndex: makeFetchStoryIndex([ ['a', 'long-long-long'], ['a', 'short'], ]), @@ -96,7 +96,7 @@ describe('StoriesListStore', () => { }); it('selects nothing if the component or group does not exist', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); expect(store.storyIdFromSpecifier('random')).toBeUndefined(); @@ -104,14 +104,14 @@ describe('StoriesListStore', () => { }); describe('if you use a storyId', () => { it('selects a specific story', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); expect(store.storyIdFromSpecifier('component-one--a')).toEqual('component-one--a'); }); it('selects nothing if you the story does not exist', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); expect(store.storyIdFromSpecifier('component-one--c')).toBeUndefined(); @@ -119,8 +119,8 @@ describe('StoriesListStore', () => { // See #11571 it('does NOT select an earlier story that this story id is a prefix of', async () => { - const store = new StoriesListStore({ - fetchStoriesList: makeFetchStoriesList([ + const store = new StoryIndexStore({ + fetchStoryIndex: makeFetchStoryIndex([ ['a', '31'], ['a', '3'], ]), @@ -132,24 +132,24 @@ describe('StoriesListStore', () => { }); }); - describe('storyIdToMetadata', () => { + describe('storyIdToEntry', () => { it('works when the story exists', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); - expect(store.storyIdToMetadata('component-one--a')).toEqual({ + expect(store.storyIdToEntry('component-one--a')).toEqual({ name: 'A', title: 'Component One', importPath: './src/ComponentOne.stories.js', }); - expect(store.storyIdToMetadata('component-one--b')).toEqual({ + expect(store.storyIdToEntry('component-one--b')).toEqual({ name: 'B', title: 'Component One', importPath: './src/ComponentOne.stories.js', }); - expect(store.storyIdToMetadata('component-two--c')).toEqual({ + expect(store.storyIdToEntry('component-two--c')).toEqual({ name: 'C', title: 'Component Two', importPath: './src/ComponentTwo.stories.js', @@ -157,10 +157,10 @@ describe('StoriesListStore', () => { }); it('throws when the story does not', async () => { - const store = new StoriesListStore({ fetchStoriesList }); + const store = new StoryIndexStore({ fetchStoryIndex }); await store.initialize(); - expect(() => store.storyIdToMetadata('random')).toThrow(/Didn't find 'random'/); + expect(() => store.storyIdToEntry('random')).toThrow(/Didn't find 'random'/); }); }); }); diff --git a/lib/store/src/StoryIndexStore.ts b/lib/store/src/StoryIndexStore.ts new file mode 100644 index 00000000000..f5487f51e18 --- /dev/null +++ b/lib/store/src/StoryIndexStore.ts @@ -0,0 +1,80 @@ +import { Channel } from '@storybook/addons'; +import { StoryId } from '@storybook/csf'; + +import { StorySpecifier, StoryIndex, StoryIndexEntry } from './types'; + +type MaybePromise = Promise | T; + +export class StoryIndexStore { + fetchStoryIndex: () => MaybePromise; + + channel: Channel; + + stories: Record; + + constructor({ fetchStoryIndex }: { fetchStoryIndex: StoryIndexStore['fetchStoryIndex'] }) { + this.fetchStoryIndex = fetchStoryIndex; + } + + async initialize() { + return this.cache(); + } + + initializeSync() { + return this.cacheSync(); + } + + async onStoriesChanged() { + const { stories } = await this.fetchStoryIndex(); + this.stories = stories; + } + + async cache() { + const { stories } = await this.fetchStoryIndex(); + this.stories = stories; + } + + async cacheSync() { + const data = this.fetchStoryIndex() as StoryIndex; + if (!data.v) { + throw new Error( + `fetchStoryIndex() didn't return a stories list, did you pass an async version then call initializeSync()?` + ); + } + this.stories = data.stories; + } + + storyIdFromSpecifier(specifier: StorySpecifier) { + const storyIds = Object.keys(this.stories); + if (specifier === '*') { + // '*' means select the first story. If there is none, we have no selection. + return storyIds[0]; + } + + if (typeof specifier === 'string') { + // Find the story with the exact id that matches the specifier (see #11571) + if (storyIds.indexOf(specifier) >= 0) { + return specifier; + } + // Fallback to the first story that starts with the specifier + return storyIds.find((storyId) => storyId.startsWith(specifier)); + } + + // Try and find a story matching the name/kind, setting no selection if they don't exist. + const { name, title } = specifier; + const match = Object.entries(this.stories).find( + ([id, story]) => story.name === name && story.title === title + ); + + return match && match[0]; + } + + storyIdToEntry(storyId: StoryId): StoryIndexEntry { + const storyEntry = this.stories[storyId]; + if (!storyEntry) { + throw new Error(`Didn't find '${storyId}' in story index (\`stories.json\`)`); + } + + return storyEntry; + } +} diff --git a/lib/store/src/StoryStore.test.ts b/lib/store/src/StoryStore.test.ts index d3ba43a93e6..7570099cba3 100644 --- a/lib/store/src/StoryStore.test.ts +++ b/lib/store/src/StoryStore.test.ts @@ -5,7 +5,7 @@ import { HooksContext } from '../../addons/dist/ts3.9/hooks'; import { prepareStory } from './prepareStory'; import { processCSFFile } from './processCSFFile'; import { StoryStore } from './StoryStore'; -import { StoriesList } from './types'; +import { StoryIndex } from './types'; // Spy on prepareStory/processCSFFile jest.mock('./prepareStory', () => ({ @@ -42,7 +42,7 @@ const projectAnnotations: ProjectAnnotations = { render: jest.fn(), }; -const storiesList: StoriesList = { +const storyIndex: StoryIndex = { v: 3, stories: { 'component-one--a': { @@ -62,12 +62,12 @@ const storiesList: StoriesList = { }, }, }; -const fetchStoriesList = async () => storiesList; +const fetchStoryIndex = async () => storyIndex; describe('StoryStore', () => { describe('projectAnnotations', () => { it('normalizes on initialization', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); expect(store.projectAnnotations.globalTypes).toEqual({ @@ -79,7 +79,7 @@ describe('StoryStore', () => { }); it('normalizes on updateProjectAnnotations', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); store.updateProjectAnnotations(projectAnnotations); @@ -94,7 +94,7 @@ describe('StoryStore', () => { describe('loadStory', () => { it('pulls the story via the importFn', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); importFn.mockClear(); @@ -108,7 +108,7 @@ describe('StoryStore', () => { }); it('uses a cache', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const story = await store.loadStory({ storyId: 'component-one--a' }); @@ -132,7 +132,7 @@ describe('StoryStore', () => { describe('componentStoriesFromCSFFile', () => { it('returns all the stories in the file', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const csfFile = await store.loadCSFFileByStoryId('component-one--a'); @@ -145,7 +145,7 @@ describe('StoryStore', () => { describe('getStoryContext', () => { it('returns the args and globals correctly', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const story = await store.loadStory({ storyId: 'component-one--a' }); @@ -157,7 +157,7 @@ describe('StoryStore', () => { }); it('returns the args and globals correctly when they change', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const story = await store.loadStory({ storyId: 'component-one--a' }); @@ -172,7 +172,7 @@ describe('StoryStore', () => { }); it('returns the same hooks each time', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const story = await store.loadStory({ storyId: 'component-one--a' }); @@ -184,7 +184,7 @@ describe('StoryStore', () => { describe('cleanupStory', () => { it('cleans the hooks from the context', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); const story = await store.loadStory({ storyId: 'component-one--a' }); @@ -198,7 +198,7 @@ describe('StoryStore', () => { describe('loadAllCSFFiles', () => { it('imports *all* csf files', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); importFn.mockClear(); @@ -213,14 +213,14 @@ describe('StoryStore', () => { describe('extract', () => { it('throws if you have not called cacheAllCSFFiles', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); expect(() => store.extract()).toThrow(/Cannot call extract/); }); it('produces objects with functions and hooks stripped', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); await store.cacheAllCSFFiles(); @@ -332,7 +332,7 @@ describe('StoryStore', () => { const store = new StoryStore({ importFn: docsOnlyImportFn, projectAnnotations, - fetchStoriesList, + fetchStoryIndex, }); await store.initialize(); await store.cacheAllCSFFiles(); @@ -350,7 +350,7 @@ describe('StoryStore', () => { describe('getSetStoriesPayload', () => { it('maps stories list to payload correctly', async () => { - const store = new StoryStore({ importFn, projectAnnotations, fetchStoriesList }); + const store = new StoryStore({ importFn, projectAnnotations, fetchStoryIndex }); await store.initialize(); await store.cacheAllCSFFiles(); diff --git a/lib/store/src/StoryStore.ts b/lib/store/src/StoryStore.ts index 18b9f8391c3..21be7dc4301 100644 --- a/lib/store/src/StoryStore.ts +++ b/lib/store/src/StoryStore.ts @@ -10,7 +10,7 @@ import { import mapValues from 'lodash/mapValues'; import pick from 'lodash/pick'; -import { StoriesListStore } from './StoriesListStore'; +import { StoryIndexStore } from './StoryIndexStore'; import { ArgsStore } from './ArgsStore'; import { GlobalsStore } from './GlobalsStore'; import { processCSFFile } from './processCSFFile'; @@ -57,7 +57,7 @@ function normalizeProjectAnnotations({ } export class StoryStore { - storiesList: StoriesListStore; + storyIndex: StoryIndexStore; importFn: ModuleImportFn; @@ -78,13 +78,13 @@ export class StoryStore { constructor({ importFn, projectAnnotations, - fetchStoriesList, + fetchStoryIndex, }: { importFn: ModuleImportFn; projectAnnotations: ProjectAnnotations; - fetchStoriesList: ConstructorParameters[0]['fetchStoriesList']; + fetchStoryIndex: ConstructorParameters[0]['fetchStoryIndex']; }) { - this.storiesList = new StoriesListStore({ fetchStoriesList }); + this.storyIndex = new StoryIndexStore({ fetchStoryIndex }); this.importFn = importFn; this.projectAnnotations = normalizeProjectAnnotations(projectAnnotations); @@ -98,7 +98,7 @@ export class StoryStore { } async initialize({ cacheAllCSFFiles = false }: { cacheAllCSFFiles?: boolean } = {}) { - await this.storiesList.initialize(); + await this.storyIndex.initialize(); if (cacheAllCSFFiles) { await this.cacheAllCSFFiles(); @@ -106,7 +106,7 @@ export class StoryStore { } initializeSync({ cacheAllCSFFiles = false }: { cacheAllCSFFiles?: boolean } = {}) { - this.storiesList.initializeSync(); + this.storyIndex.initializeSync(); if (cacheAllCSFFiles) { this.cacheAllCSFFilesSync(); @@ -123,7 +123,7 @@ export class StoryStore { this.importFn = importFn; // We need to refetch the stories list as it may have changed too - await this.storiesList.cacheStoriesList(); + await this.storyIndex.cache(); if (this.cachedCSFFiles) { await this.cacheAllCSFFiles(); @@ -131,13 +131,13 @@ export class StoryStore { } async loadCSFFileByStoryId(storyId: StoryId): Promise> { - const { importPath, title } = this.storiesList.storyIdToMetadata(storyId); + const { importPath, title } = this.storyIndex.storyIdToEntry(storyId); const moduleExports = await this.importFn(importPath); return this.processCSFFileWithCache(moduleExports, title); } loadCSFFileByStoryIdSync(storyId: StoryId): CSFFile { - const { importPath, title } = this.storiesList.storyIdToMetadata(storyId); + const { importPath, title } = this.storyIndex.storyIdToEntry(storyId); const moduleExports = this.importFn(importPath); if (Promise.resolve(moduleExports) === moduleExports) { throw new Error( @@ -149,7 +149,7 @@ export class StoryStore { async loadAllCSFFiles(): Promise>> { const importPaths: Record = {}; - Object.entries(this.storiesList.storiesList.stories).forEach(([storyId, { importPath }]) => { + Object.entries(this.storyIndex.stories).forEach(([storyId, { importPath }]) => { importPaths[importPath] = storyId; }); @@ -170,7 +170,7 @@ export class StoryStore { loadAllCSFFilesSync(): Record> { const importPaths: Record = {}; - Object.entries(this.storiesList.storiesList.stories).forEach(([storyId, { importPath }]) => { + Object.entries(this.storyIndex.stories).forEach(([storyId, { importPath }]) => { importPaths[importPath] = storyId; }); @@ -245,7 +245,7 @@ export class StoryStore { throw new Error('Cannot call extract() unless you call cacheAllCSFFiles() first.'); } - return Object.entries(this.storiesList.storiesList.stories) + return Object.entries(this.storyIndex.stories) .map(([storyId, { importPath }]) => { const csfFile = this.cachedCSFFiles[importPath]; const story = this.storyFromCSFFile({ storyId, csfFile }); @@ -314,7 +314,7 @@ export class StoryStore { throw new Error('Cannot call fromId/raw() unless you call cacheAllCSFFiles() first.'); } - const { importPath } = this.storiesList.storyIdToMetadata(storyId); + const { importPath } = this.storyIndex.storyIdToEntry(storyId); if (!importPath) { throw new Error(`Unknown storyId ${storyId}`); } diff --git a/lib/store/src/types.ts b/lib/store/src/types.ts index 654d66d7bc0..1acbd0d4cc8 100644 --- a/lib/store/src/types.ts +++ b/lib/store/src/types.ts @@ -76,15 +76,15 @@ export declare type RenderContext = StoryIdenti unboundStoryFn: LegacyStoryFn; }; -export interface StoriesListStory { +export interface StoryIndexEntry { name: StoryName; title: ComponentTitle; importPath: Path; } -export interface StoriesList { +export interface StoryIndex { v: number; - stories: Record; + stories: Record; } export type StorySpecifier = StoryId | { name: StoryName; title: ComponentTitle } | '*'; diff --git a/yarn.lock b/yarn.lock index d38581bf3b8..1f322727ff9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5677,13 +5677,13 @@ __metadata: "@storybook/csf-tools": 6.4.0-alpha.19 "@storybook/node-logger": 6.4.0-alpha.19 "@storybook/postinstall": 6.4.0-alpha.19 + "@storybook/preview-web": 6.4.0-alpha.19 "@storybook/react": 6.4.0-alpha.19 "@storybook/source-loader": 6.4.0-alpha.19 "@storybook/store": 6.4.0-alpha.19 "@storybook/theming": 6.4.0-alpha.19 "@storybook/vue": 6.4.0-alpha.19 "@storybook/web-components": 6.4.0-alpha.19 - "@storybook/preview-web": 6.4.0-alpha.19 "@types/cross-spawn": ^6.0.2 "@types/doctrine": ^0.0.3 "@types/enzyme": ^3.10.8 @@ -6302,12 +6302,12 @@ __metadata: "@storybook/core-common": 6.4.0-alpha.19 "@storybook/core-events": 6.4.0-alpha.19 "@storybook/node-logger": 6.4.0-alpha.19 + "@storybook/preview-web": 6.4.0-alpha.19 "@storybook/router": 6.4.0-alpha.19 "@storybook/semver": ^7.3.2 "@storybook/store": 6.4.0-alpha.19 "@storybook/theming": 6.4.0-alpha.19 "@storybook/ui": 6.4.0-alpha.19 - "@storybook/preview-web": 6.4.0-alpha.19 "@types/case-sensitive-paths-webpack-plugin": ^2.1.4 "@types/dotenv-webpack": ^3.0.0 "@types/node": ^14.0.10 @@ -6622,9 +6622,9 @@ __metadata: "@storybook/client-logger": 6.4.0-alpha.19 "@storybook/core-events": 6.4.0-alpha.19 "@storybook/csf": 0.0.2--canary.d61cd6c.0 + "@storybook/preview-web": 6.4.0-alpha.19 "@storybook/store": 6.4.0-alpha.19 "@storybook/ui": 6.4.0-alpha.19 - "@storybook/preview-web": 6.4.0-alpha.19 airbnb-js-shims: ^2.2.1 ansi-to-html: ^0.6.11 core-js: ^3.8.2 @@ -6963,8 +6963,8 @@ __metadata: "@storybook/core": 6.4.0-alpha.19 "@storybook/core-common": 6.4.0-alpha.19 "@storybook/csf": 0.0.2--canary.d61cd6c.0 - "@storybook/store": 6.4.0-alpha.19 "@storybook/preview-web": 6.4.0-alpha.19 + "@storybook/store": 6.4.0-alpha.19 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 global: ^4.4.0 @@ -7216,6 +7216,31 @@ __metadata: languageName: node linkType: hard +"@storybook/preview-web@6.4.0-alpha.19, @storybook/preview-web@workspace:*, @storybook/preview-web@workspace:lib/preview-web": + version: 0.0.0-use.local + resolution: "@storybook/preview-web@workspace:lib/preview-web" + dependencies: + "@storybook/addons": 6.4.0-alpha.19 + "@storybook/channel-postmessage": 6.4.0-alpha.19 + "@storybook/client-logger": 6.4.0-alpha.19 + "@storybook/core-events": 6.4.0-alpha.19 + "@storybook/csf": 0.0.2--canary.d61cd6c.0 + "@storybook/store": 6.4.0-alpha.19 + ansi-to-html: ^0.6.11 + core-js: ^3.8.2 + global: ^4.4.0 + lodash: ^4.17.20 + qs: ^6.10.0 + regenerator-runtime: ^0.13.7 + ts-dedent: ^2.0.0 + unfetch: ^4.2.0 + util-deprecate: ^1.0.2 + peerDependencies: + react: ^16.8.0 || ^17.0.0 + react-dom: ^16.8.0 || ^17.0.0 + languageName: unknown + linkType: soft + "@storybook/react-docgen-typescript-plugin@npm:1.0.2-canary.253f8c1.0": version: 1.0.2-canary.253f8c1.0 resolution: "@storybook/react-docgen-typescript-plugin@npm:1.0.2-canary.253f8c1.0" @@ -7347,6 +7372,7 @@ __metadata: "@storybook/node-logger": "workspace:*" "@storybook/postinstall": "workspace:*" "@storybook/preact": "workspace:*" + "@storybook/preview-web": "workspace:*" "@storybook/react": "workspace:*" "@storybook/root": "workspace:*" "@storybook/router": "workspace:*" @@ -7359,7 +7385,6 @@ __metadata: "@storybook/ui": "workspace:*" "@storybook/vue": "workspace:*" "@storybook/web-components": "workspace:*" - "@storybook/preview-web": "workspace:*" "@testing-library/dom": ^7.29.4 "@testing-library/jest-dom": ^5.11.9 "@testing-library/react": ^11.2.2 @@ -7545,8 +7570,8 @@ __metadata: "@storybook/core-common": 6.4.0-alpha.19 "@storybook/csf": 0.0.2--canary.d61cd6c.0 "@storybook/node-logger": 6.4.0-alpha.19 - "@storybook/store": 6.4.0-alpha.19 "@storybook/preview-web": 6.4.0-alpha.19 + "@storybook/store": 6.4.0-alpha.19 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 fs-extra: ^9.0.1 @@ -7793,8 +7818,8 @@ __metadata: "@storybook/core": 6.4.0-alpha.19 "@storybook/core-common": 6.4.0-alpha.19 "@storybook/csf": 0.0.2--canary.d61cd6c.0 - "@storybook/store": 6.4.0-alpha.19 "@storybook/preview-web": 6.4.0-alpha.19 + "@storybook/store": 6.4.0-alpha.19 "@types/webpack-env": ^1.16.0 babel-plugin-bundled-import-meta: ^0.3.1 core-js: ^3.8.2 @@ -7814,31 +7839,6 @@ __metadata: languageName: unknown linkType: soft -"@storybook/preview-web@6.4.0-alpha.19, @storybook/preview-web@workspace:*, @storybook/preview-web@workspace:lib/preview-web": - version: 0.0.0-use.local - resolution: "@storybook/preview-web@workspace:lib/preview-web" - dependencies: - "@storybook/addons": 6.4.0-alpha.19 - "@storybook/channel-postmessage": 6.4.0-alpha.19 - "@storybook/client-logger": 6.4.0-alpha.19 - "@storybook/core-events": 6.4.0-alpha.19 - "@storybook/csf": 0.0.2--canary.d61cd6c.0 - "@storybook/store": 6.4.0-alpha.19 - ansi-to-html: ^0.6.11 - core-js: ^3.8.2 - global: ^4.4.0 - lodash: ^4.17.20 - qs: ^6.10.0 - regenerator-runtime: ^0.13.7 - ts-dedent: ^2.0.0 - unfetch: ^4.2.0 - util-deprecate: ^1.0.2 - peerDependencies: - react: ^16.8.0 || ^17.0.0 - react-dom: ^16.8.0 || ^17.0.0 - languageName: unknown - linkType: soft - "@stroncium/procfs@npm:^1.2.1": version: 1.2.1 resolution: "@stroncium/procfs@npm:1.2.1"